Come siamo passati alla creazione di elementi dell'interfaccia utente di input per la nostra piattaforma Chatbot

Pubblicato: 2017-01-01

I chatbot, così come esistono oggi, non hanno molte capacità per comprendere il linguaggio umano naturale. E questo è uno dei motivi principali per cui la maggior parte delle app di messaggistica (Messenger, Kik ecc.) ricorrono a un mix di interfaccia utente grafica e di testo nelle loro piattaforme bot: pensa a pulsanti, caroselli, schede immagine e non solo risposte di testo.

Noi di Tars utilizziamo il browser come piattaforma per creare la nostra interfaccia di chat per far funzionare i bot. E questo ci dà completa libertà su tutti i componenti che abbiamo. Se hai provato uno dei nostri bot (in caso contrario, provane uno qui e qui), sapresti che supportiamo fortemente l'interfaccia utente grafica + l'approccio basato su testo. Come parte di questo processo di pensiero, abbiamo creato una serie di input da tastiera personalizzati nella nostra interfaccia front-end per facilitare le diverse interazioni e situazioni dell'utente.

Messenger, Kik, Telegram sono enormi piattaforme in cui gli sviluppatori implementano centinaia di bot ogni giorno. Sento ancora che queste piattaforme di messaggistica non hanno fatto abbastanza sui componenti front-end per aiutare un boomaker a creare interazioni utente arricchenti.

Ed è per questo che volevo parlare di più su come abbiamo creato ogni interfaccia utente personalizzata, perché ognuna di esse ha un senso e come la loro mancanza rovina le interazioni degli utenti in questo momento.

Quindi eccoci qui:

Scorrimento data e ora

Pensa a uno scenario in cui è necessario chiedere a un utente per quando vorrebbe fissare l'appuntamento? Ci possono essere più modi per fornire le stesse informazioni.

25 novembre, 25 novembre, 25 novembre, 25/11, 25–11–2016, 25/11/16 — tutti essenzialmente significano lo stesso, ma diventa difficile per una macchina dare un senso a questi dati.

Questo è il motivo per cui abbiamo incorporato uno scroller di data e ora in cui gli utenti possono ruotare i quadranti e selezionare la data/ora.

chatbot1

Non ho visto nessun'altra piattaforma di messaggistica fornire questa interfaccia utente fino ad ora e ritengo che questo sia un must se un bot chiede data o ora all'utente.

Pulsanti verticali

chatbot2 Pensa a queste come opzioni a scelta multipla in una forma in cui hai un numero limitato di cose tra cui scegliere. Toccare i pulsanti rende l'interazione più rapida e limita anche l'ambito della conversazione.

L'approccio basato sui pulsanti ha senso quando devi scegliere tra una pizza veg e non veg, ma potrebbe non essere la migliore interfaccia utente da avere se hai 100 polizze assicurative tra cui scegliere.

Cosa si può fare di più con i pulsanti verticali?

  • aggiungi un'immagine accanto a ciascuna opzione per renderla visivamente più accattivante.
  • puoi lasciare che l'utente risponda a un solo tocco o fargli fare clic su "Invia" dopo aver toccato una qualsiasi delle opzioni. Quest'ultimo aiuta a riconfermare se l'utente non ha selezionato l'opzione particolare per errore. Non c'è modo di tornare indietro in un flusso di chat ed è per questo che questa personalizzazione ha senso.
  • aggiungi un menu rapido di informazioni a ciascuna opzione per fornire informazioni dettagliate e migliorare il processo decisionale.

chatbot3

Non tutti conoscono la differenza tra Advance e Basic Facial. L'aggiunta di dettagli su tutto ciò che è incluso e sui prezzi migliora l'esperienza dell'utente.

Un'altra cosa importante da tenere a mente quando usi l'interfaccia utente dei pulsanti è inquadrare la tua domanda nel modo giusto. Come spiega Leszek nel suo articolo qui, è meglio porre la domanda in un modo che limiti la gamma di opzioni e definisca il contesto invece di porre una domanda molto aperta.

chatbot4

Limitazione dell'input dell'utente

Sento che questa è una delle cose migliori che abbiamo fatto alla nostra interfaccia di chat. Ogni volta che forniamo un'interfaccia utente di input grafico (pulsanti, caroselli, ecc.), non consentiamo all'utente di digitare nulla nel testo.

Perché farlo? Perché un utente può digitare qualsiasi cosa là fuori e il tuo bot non è pronto per questo. Finché non ci sei, è meglio mantenerlo semplice e limitato piuttosto che interrompere la conversazione.

Raccomandato per te:

Come Metaverse trasformerà l'industria automobilistica indiana

Come Metaverse trasformerà l'industria automobilistica indiana

Cosa significa la disposizione anti-profitto per le startup indiane?

Cosa significa la disposizione anti-profitto per le startup indiane?

In che modo le startup Edtech stanno aiutando il potenziamento delle competenze e a rendere la forza lavoro pronta per il futuro

In che modo le startup Edtech stanno aiutando la forza lavoro indiana a migliorare le competenze e a diventare pronte per il futuro...

Azioni tecnologiche new-age questa settimana: i problemi di Zomato continuano, EaseMyTrip pubblica stro...

Le startup indiane prendono scorciatoie alla ricerca di finanziamenti

Le startup indiane prendono scorciatoie alla ricerca di finanziamenti

Secondo quanto riferito, la startup di marketing digitale Logicserve Digital ha raccolto INR 80 Cr in finanziamenti dalla società di gestione patrimoniale alternativa Florintree Advisors.

Piattaforma di marketing digitale Logicserve Borse INR 80 Cr Finanziamenti, rinomina come LS Dig...

Quello che facciamo è questo:

chatbot5

Questa è la nostra interfaccia di chat

E questo è quello che succede quando non hai qualcosa del genere:

chatbot6

Questo è Facebook Messenger che non consente l'immissione di testo con restrizioni quando hai risposte rapide

Pulsante Fine e Passa

Queste sono due piccolissime sfumature che abbiamo finito per incorporare perché abbiamo sempre pensato ai chatbot con script come a un'evoluzione delle forme.

Quando invii il tuo indirizzo o fornisci un feedback dettagliato sull'interfaccia della chat, il comportamento generale è premere il pulsante di invio dopo aver scritto alcune parole e l'intera risposta viene infine distribuita su 3-4 affermazioni. Con il "pulsante Fatto", puoi continuare a digitare e premere questo una volta che hai dato la risposta completa.

Se non si dispone di tale opzione, il messaggio successivo della macchina arriverà dopo la prima istanza stessa, con conseguente risposta incompleta.

chatbot7

Avere un pulsante "Fatto" quando devi selezionare più opzioni o avere risposte a più righe

Potrebbero esserci anche casi in cui un utente vuole saltare la domanda e per questo abbiamo un "pulsante Passa" al posto del "pulsante Invia". Non appena l'utente inizia a digitare, il pulsante Passa si trasforma in pulsante Invia.

chatbot8

Non vuoi dare la tua email? Tocca "Passa" per saltare la domanda.

Suggerimenti per il completamento automatico

È come la funzionalità di completamento automatico nella ricerca di Google in cui inizi a digitare e suggerisce le possibili opzioni. Questo diventa particolarmente utile quando hai un lungo elenco di opzioni e avere pulsanti verticali non è un'opzione fattibile. Pensa a un lungo elenco di località, città, modelli di auto, ecc.

chatbot9

Stelle e Mi piace

Particolarmente utile quando chiedi feedback o esperienza agli utenti e la risposta è di natura più qualitativa. E puoi persino personalizzare le icone in modo che siano stelle, Mi piace, cuori, emoticon.

chatbot10

Schede immagine

Questo è utile quando è necessario mostrare più informazioni su ciascun elemento in una volta sola. Potrebbe essere un hamburger in un processo di ordinazione di cibo o una maglietta in un flusso di acquisto. Tutte le carte sono impilate l'una contro l'altra e puoi scorrere per guardare tutte le opzioni.

Ci sono 4 parti di questo elemento dell'interfaccia utente: immagine, titolo, descrizione e piè di pagina. Puoi utilizzarli in modo diverso a seconda di ciò che desideri visualizzare lì.

chatbot11

Nel caso in cui desideri testare tutti questi elementi dell'interfaccia utente di input, ecco il collegamento a un chatbot che ti guida uno alla volta.

La chat è un'interfaccia minimalista con solo bolle e una casella di testo non offre molto spazio. E credo che dovremo ripensare a come possiamo facilitare una varietà di interazioni utilizzando gli elementi esistenti e aggiungendone di nuovi all'interfaccia della chat.

Ti piacerebbe sapere se hai giocato tu stesso con l'interfaccia di messaggistica e hai aggiunto altri fantastici elementi della GUI?


[Questo post di Ish Jindal è apparso per la prima volta su Medium ed è stato riprodotto con il permesso.]