Assistent
Überblick
Ein Assistent ist ein mehrseitiges Formular, das Benutzer durch einen komplexen Ablauf oder eine Reihe miteinander verbundener Aufgaben führt, z. B. Angebotserstellung, Policenänderung und Verlängerung. Assistenten müssen flexibel genug sein, damit Kunden sie an ihre Bedürfnisse anpassen können. Dazu gehören Änderungen des Layouts, des Themes, der Komponenten und benutzerdefinierter Komponenten.
Zu verwenden
- Um lange, komplexe Aufgaben in kleinere, besser überschaubare Schritte zu unterteilen.
- Für Angebots- und Zahlungstransaktionen.
Nicht zu verwenden
- Wenn eine Aufgabe in einem einzigen Schritt erledigt werden kann, ohne Verwirrung zu stiften oder den Benutzer zu überfordern. In Fällen wie diesen wird ein Assistent möglicherweise nicht benötigt, da er zu unnötiger Komplexität führen kann.
- Für einfache Aufgaben zur Dateneingabe. Ziehen Sie in Betracht, stattdessen das Formularmuster zu verwenden.
Aufbau
Beispiel für das Assistentenmuster in einem Angebots- und Kaufablauf für Versicherungsnehmer (Desktopversion).
Das Layout, das Design und die Komponenten können je nach Anwendung und Anwendungsfall variieren.
In diesem Beispiel besteht das Assistentenmuster aus den folgenden Elementen:
- Schrittlayout: Teilt den Fortschritt des Benutzers beim Ausführen der Aufgabe mit.
- Hauptinhaltsbereich: Zeigt Formularcontainer, Formularfelder und Formularsteuerelemente an.
- Schaltflächenfußzeile: Enthält einen Standardsatz von Aktionen zur Steuerung des Ablaufs des Assistenten.
Allgemeine Richtlinien
- Verwenden Sie den Assistenten, wenn Benutzer bei einer Aufgabe mehrere aufeinanderfolgende Schritte ausführen müssen. Ein Assistent kann komplexe Aufgaben vereinfachen, indem er sie in eine Abfolge von Blöcken aufteilt. Bei Formularen, die eine Validierung oder Verifizierung von Benutzereingaben erfordern, hilft ein Assistent, die Benutzer durch den Prozess zu führen und Echtzeit-Feedback zu geben.
- Orientieren Sie sich an den Benutzern, indem Sie die einzelnen Schritte eindeutig beschriften und den aktuellen Schritt hervorheben.
- Minimieren Sie die Entscheidungsfindung und vereinfachen Sie die Interaktion, indem Sie eine klare, sequenzielle Reihenfolge der Schritte erzwingen.
- Ermöglichen Sie es Benutzern, den Assistenten auf halbem Weg zu verlassen und ihren Fortschritt zu speichern. Während die Benutzer die kognitiven Kosten für die Wiederherstellung des Kontexts und die Erinnerung an ihre Ziele tragen, müssen sie zumindest nicht dieselben Informationen erneut eingeben.
- Stellen Sie sicher, dass die Assistentenschritte autark sind und keine Informationen erfordern, die an anderer Stelle in der App oder in einem vorherigen Schritt verfügbar sind.
- Optimieren Sie den Assistentenablauf für verschiedene Bildschirmgrößen und Geräte (Desktop, Tablet, Mobilgeräte), um ein konsistentes Erlebnis zu gewährleisten.
Quelle: Nielsen Norman Group
Inhalt
Allgemeine Richtlinien fürs Schreiben
- Verwenden Sie die Großschreibung des ersten Worts und von Substantiven für alle Aspekte der Gestaltung von Guidewire-Produktschnittstellen. Schreiben Sie nicht alles groß.
- Verwenden Sie in den meisten Situationen Verben im Präsens und im Aktiv.
- Verwenden Sie gebräuchliche Abkürzungen, um Ihrem Text einen natürlichen und informellen Ton zu verleihen.
- Verwenden Sie eine einfache Sprache. Vermeiden Sie unnötigen Jargon und komplexe Sprache.
- Halten Sie Wörter und Sätze kurz.
Schrittbeschriftungen
Verwenden Sie für jeden Schritt eine kurze, aussagekräftige Beschriftung. Der Titel oben in jedem Fenster kann die Schrittbeschriftung erläutern. Es muss jedoch in jedem Fall eine direkte Beziehung zwischen der Schrittbeschriftung und dem Bildschirmtitel bestehen.
Schaltflächenbeschriftungen
Die Standardbeschriftungen für die Schaltflächen der Assistentennavigation sind Zurück, Weiter und Fertig. Halten Sie die Standardbeschriftungen der Schaltflächen beim Ersetzen kurz und aktionsorientiert, z. B. „Fahrer hinzufügen“.
Barrierefreiheit
Stellen Sie sicher, dass der Ablauf so gestaltet ist, dass er für Benutzer mit Behinderungen zugänglich ist, einschließlich derjenigen, die Screenreader-Kompatibilität und Tastaturnavigation benötigen.
Interaktionen
- Assistenten enthalten die Schaltflächen Zurück und Weiter, mit denen Benutzer die Schritte vor bzw. zurück durchgehen können. Darüber hinaus haben Benutzer die Möglichkeit, über einen sichtbaren Fortschrittsbalken direkt zu bestimmten Schritten zu navigieren.
- Jeder Schritt enthält in der Regel Felder, in die Benutzer Informationen eingeben oder eine Auswahl treffen. Abhängig von den Benutzereingaben können bestimmte Schritte oder Felder dynamisch ein- oder ausgeblendet werden.
- Die in den vorherigen Schritten eingegebenen Daten werden gespeichert bzw. gesichert, sodass der Benutzer frei navigieren kann, ohne dass sein Fortschritt verloren geht.
- Im abschließenden Schritt wird eine Zusammenfassung der eingegebenen Informationen dargestellt.
Reaktionsfähigkeit
Das Assistentenmuster ist so konzipiert, dass bei der Verwendung auf einem Tablet oder Mobiltelefon nur minimale Änderungen erforderlich sind. Bei kleinerer Fenstergröße kann es zu Stapelungen einiger Eingabefelder und anderer Komponenten kommen. Die Fortschrittsanzeigen können sich ändern, um den geringeren Platz auf dem Bildschirm zu berücksichtigen.
Theming
Standardmäßig entsprechen Theming und Branding der Anwendung, es sei denn, sie werden überschrieben.
Muster können mit Themes gestaltet werden, um bestimmte Markenanforderungen und Kundenwünsche zu erfüllen. Dazu gehören visuelle Elemente wie Farben, Typografie, Symbole, Schaltflächen und andere Komponenten und grafische Elemente.
Erfahren Sie mehr über das Theming mit Design-Token
Unterstützende Recherche
Die Recherche für dieses Muster bestand aus einer Wettbewerbsanalyse. Die Wettbewerbsanalyse ist eine Recherchetechnik, mit der Sie vergleichen und verstehen können, woran andere auf demselben Gebiet arbeiten. UX-Designer analysierten mehr als zehn der größten Versicherer in den USA, im Vereinigten Königreich und in der EU und überprüften die Layouts, Stile, Elemente und Verhaltensweisen der Assistenten. Sie suchten nach relativen Stärken und Schwächen, Trends und Unterschieden. Die Designer nahmen diese Informationen, fanden Gemeinsamkeiten und erstellten ein Muster, das auf diesen Praktiken basiert.
Die Benutzerfreundlichkeitstests wurden sowohl für Vermittler als auch für Versicherungsnehmer mit erfolgreichen Ergebnissen durchgeführt.
Verwandte Komponenten und Muster
Komponenten
- Einfacher Fortschrittsbalken
- Schrittfortschrittsbalken
- Phasenfortschrittsbalken
- Optionsfeldgruppe
- Kontrollkästchen
- Kopfzeile
- Umschaltfläche
- Dropdown
- Texteingabe
- Schaltflächen
- Symbol
- Modales Fenster
Muster
Ressourcen
Laden Sie eine ZIP-Datei mit sämtlichen aktuellen Jutro-Mustern herunter und beginnen Sie mit der Gestaltung.