Die meisten Chatbot-Schnittstellen haben dieselben Teile: einen Eingabebereich, einen Nachrichtenthread und Steuerelemente für jede Nachricht. Der Unterschied zwischen einem guten und einem frustrierenden Chatbot liegt hauptsächlich in den Details dieser Teile und ihrem Zustand.
Beginnen Sie mit dem leeren Zustand. Ein leerer Bildschirm mit einem Textfeld gibt keinen Aufschluss darüber, was der Bot tun kann. Fügen Sie eine kurze Beschreibung und drei oder vier Beispielaufforderungen hinzu, auf die die Leute tippen können.
Machen Sie den Thread leicht lesbar. Sorgen Sie dafür, dass die Nachrichtenbreite angenehm zum Lesen ist, trennen Sie Benutzer- und KI-Nachrichten deutlich, geben Sie Formatierungen wie Listen und Code richtig wieder und behalten Sie die neueste Nachricht im Blick, während neuer Text eingeht, ohne zu springen, wenn die Person nach oben gescrollt hat.
Gestalten Sie jeden Staat. „Senden“, „Denken“, „Streamen“, „Fertig“, „Gestoppt“ und „Fehlgeschlagen“ sollten jeweils unterschiedlich aussehen. Ein Denkindikator, oft ein animiertes Punktmuster oder eine Kugel, zeigt den Leuten an, dass die Anfrage eingegangen ist. Eine Stopptaste während des Streamings gibt die Kontrolle zurück. Bei Fehlern sollte angegeben werden, was passiert ist, und ein erneuter Versuch angeboten werden.
Fügen Sie den Antworten Steuerelemente hinzu: Kopieren, Neugenerieren, Bearbeiten der vorherigen Eingabeaufforderung und Geben von Feedback. Verwenden Sie für einen Sprachassistenten eine klare visuelle Darstellung zum Zuhören, Denken und Sprechen, damit die Leute wissen, wann sie sprechen müssen. ExodeUI, das wir erstellen, verfügt über kostenlose animierte Kugeln für diese Zustände, die in React, Vue, SwiftUI, Flutter und anderen Frameworks ausgeführt werden.