Mit unserer Chatbot-Plattform können Nutzer KI-Chatbots bauen, indem sie dem Bot eigenes Wissen bereitstellen. Der Haken: Die anfängliche Lösung zur Wissensbereitstellung ist unter Zeitdruck entstanden und nicht besonders intuitiv, was sich auch in User Tests und dem Supportfeedback widerspiegelte. Gemeinsam mit unserer Produktmanagerin habe ich eine Guided Tour entwickelt, die den Prozess Schritt für Schritt begleitet.
Dank einer klaren User Journey, Animationen und gezielten User-Tests ist eine Lösung entstanden, mit der Nutzer ihren Chatbot rund 70 % schneller mit Wissen versorgen können, bei einer Fehlerquote von 0 %.
70% schneller zum fertigen AI- Chatbot
Eine interaktive Guided Tour, die das komplexe Wissens-Setup für AI Chatbots verständlich und effizient macht.
Überblick
Kurz gesagt
Zur Wahrung der Vertraulichkeit wurden visuelle Elemente anonymisiert.
Meine Rolle
Konzeption mit PM
UX-/UI-Design & Prototyping
User-Tests: Planung, Durchführung, Auswertung
Grafiken & Animationen
UX-/UI-Design & Prototyping
User-Tests: Planung, Durchführung, Auswertung
Grafiken & Animationen
Zeitraum
Januar – März 2025
Die Herausforderung
Das Problem
Nutzer wussten nicht, dass Dokumente erst validiert und zugewiesen werden müssen, damit sie für den Chatbot nutzbar sind.
Mit unserer Chatbot-Plattform können Nutzer KI-Chatbots bauen, indem sie eigenes Wissen in Dokumenten bereitstellen und in Wissenssammlungen ordnen. Die unter Zeitdruck implementierte, technisch funktionale, aber wenig intuitive Lösung führte zu Frustration und mehr Supportaufwand.
In ersten Tests wurden durchschnittlich 9:15 Minuten gebraucht, um diesen Prozess vollständig abzuschließen, wenn die Tester überhaupt alle nötigen Schritte erkannten: Die Dokumente mussten nicht nur hochgeladen, sondern auch validiert und an anderer Stelle in der Plattform dem gewünschten Bot zugewiesen werden.
Einige starteten bereits erste Tests mit dem Chatbot, ohne jemals ein Dokument validiert oder ihrem Bot zugewiesen zu haben, andere luden ihre Dokumente an einer falschen Stelle hoch.
In ersten Tests wurden durchschnittlich 9:15 Minuten gebraucht, um diesen Prozess vollständig abzuschließen, wenn die Tester überhaupt alle nötigen Schritte erkannten: Die Dokumente mussten nicht nur hochgeladen, sondern auch validiert und an anderer Stelle in der Plattform dem gewünschten Bot zugewiesen werden.
Einige starteten bereits erste Tests mit dem Chatbot, ohne jemals ein Dokument validiert oder ihrem Bot zugewiesen zu haben, andere luden ihre Dokumente an einer falschen Stelle hoch.
Unser Vorgehen
Um den Prozess der Wissensbereitstellung ohne großen Entwicklungsaufwand nutzerfreundlicher zu gestalten, haben unsere Produktmanagerin und ich eine „Guided Tour” konzipiert, die die Nutzenden Schritt für Schritt durch den Prozess führt. Für das Testing entwickelte ich zwei Varianten der Tour, eine mit Fokus auf einzelnen UI-Elemente und eine ohne Fokus.
Uns beschäftigten 3 Hauptfragen:
- Hilft eine „Guided Tour” dabei, den komplexen Prozess verständlicher zu machen?
- Unterstützt ein visueller Fokus auf einzelne UI-Elemente oder lenkt er eher ab?
- Verstehen Nutzer nicht nur, was sie tun, sondern auch, warum sie es tun?
Hintergrund abgedunkelt, Fokus auf einzelne UI-Elemente.
Kein abgedunkelter Hintergrund, gesamter Screen bleibt sichtbar.
Feedback aus dem Testing
Mit den Prototypen führten wir einen Usability-Test mit sechs Testern durch. Die Erkenntnisse aus den Tests haben wir mithilfe eines Affinity-Diagramms gebündelt und anschließend gemeinsam mit unserem Software-Architekten nach Aufwand und Impact priorisiert.
Fortschrittsanzeige
Die Tester nahmen die Anzeige zwar wahr, wussten aber nicht, welchen Zweck sie erfüllt.
Mehrere Aktionen pro Schritt
Tester fürchteten, dass bei mehreren Aktionen in einem Schritt die Tour nach der ersten Aktion verschwindet.
Schwerer auffindbar
Ohne visuellen Fokus dauerte es länger, bis die Tester wussten, welches
UI-Element relevant waren.
Kein „Tunnel-Effekt“
5/6 Tester konnten unabhängig der getesteten Variante gut beschreiben, was sie getan hatten und warum.
Icons im Text
4/6 Tester wünschten sich zur besseren Auffindbarkeit die Anzeige relevanter Icons in der Beschreibung.
Unauffällige Grafiken
3/6 Tester bemerkten die Grafiken erst nach mehreren Schritten, alle bewerteten sie aber als sehr hilfreich.
Die Umsetzung
Eine Aktion pro Schritt
Um die Nutzer nicht zu überfordern und ihnen die Sicherheit zu geben, dass die Anleitung bestehen bleibt, zeigt jeder Schritt der Tour nur eine einzige Aktion.
Verbesserte Fortschrittsanzeige
Die Darstellung des Tourverlaufs wurde klarer strukturiert, um einfacher als solche erkannt zu werden und den Usern eine bessere Orientierung zu bieten.
Animierte Grafiken
Um die visuelle Unterstützung auffälliger zu gestalten, wurden die Illustrationen animiert. Sie helfen nun nicht nur beim Verständnis, sondern ziehen auch schneller die Aufmerksamkeit auf sich.
Abgedunkelter Hintergrund
Wir entschieden uns für die Variante mit abgedunkeltem Hintergrund, da Testpersonen die relevanten Interaktionselemente schneller fanden und den Effekt als hilfreich beschrieben.
Animationen sorgen dafür, dass die Grafiken schneller wahrgenommen werden und helfen dabei, komplexe Schritte leichter zu erfassen.
Ergebnis & Wirkung
70%
Zeitersparnis
0%
Fehlerquote
Mit der Tour brauchten die Tester im Durchnschnitt nur noch 2:54 statt 9:15 Minuten, um ein Dokument korrekt bereitzustellen. Außerdem lag die Fehlerquote bei 0 %, weil die Tour eindeutig zeigt, welche Schritte in welcher Reihenfolge auszuführen sind. Das ist ein klarer Gewinn für unsere Nutzer und das Support-Team und das ohne großen Entwicklungsaufwand.
Wie es weiter geht
Der Austausch mit Customer Success und Architektur half, die Probleme zu identifizieren und dank der erhobenen Daten konnten wir den Erfolg der Tour direkt belegen.
Die Tour wird aktuell implementiert. Anschließend werden wir die Completion Rate messen und Nutzerfeedback per Umfrage einholen, um die Nutzererfahrung weiter zu verbessern. Auch wenn die Tour ein Quick Fix für ein größeres strukturelles Problem ist, zeigt sie, wie durchdachtes UX-Design unter engen Rahmenbedingungen konkrete Probleme lösen kann.
Gleichzeitig haben wir ein wiederverwendbares Format geschaffen, das künftig auch für Feature-Einführungen und Onboarding-Prozesse genutzt wird.
Gleichzeitig haben wir ein wiederverwendbares Format geschaffen, das künftig auch für Feature-Einführungen und Onboarding-Prozesse genutzt wird.
