Seitennavigation
Überblick
Das Seitennavigationsmuster wird in vielen verschiedenen Bereichen der Guidewire-Produkte verwendet und erweitert die Nutzung des linken Panels über die reine Navigation hinaus.
Die Elemente, die im linken Panel angezeigt werden, variieren je nach Anwendung und Anwendungsfall. Einige Beispiele für verschiedene Anwendungsfälle:
- In der Quote and Buy-Vorlage für Vermittler navigiert der Benutzer mithilfe einer Fortschrittsanzeige durch den Ablauf.
- In Guidewire PolicyCenter™ navigiert der Benutzer mithilfe der Strukturansicht im linken Panel zwischen Ordnern.
- In Guidewire Workflow Designer™ zieht der Benutzer Ablaufobjekte per Drag & Drop von der Palette auf das Canvas.
Zu verwenden
Angebots- und Kaufabläufe und wenn das linke Panel für andere Funktionen als die Navigation benötigt wird.
Nicht zu verwenden
Grundrisse, die kein linkes Panel haben.
Aufbau
Beispiel für das Seitennavigationsmuster, das im Angebots- und Kaufprozess für Vermittler angezeigt wird.
- Linkes Panel: Ein Panel auf der linken Seite des Fensters mit persistentem Inhalt.
- Fortschrittsanzeige: Ein Beispiel für die verschiedenen Arten von Elementen, die im Panel angezeigt werden können. In diesem Fall verwendet der Vermittler die Fortschrittsanzeige, um im Ablauf hin und her zu navigieren und bei Bedarf Änderungen am Angebot vorzunehmen.
- Fußzeile: Eine vereinfachte Fußzeile, die Informationen zum Versicherungsträger wie Copyright-Informationen, Adresse und einige optionale Links anzeigt.
- Informationen zum Angebot: Persistente Informationen zum Angebot einschließlich Sparte und Angebotsnummer.
Allgemeine Richtlinien
- Das Seitennavigationsmuster unterstützt mehrere Navigationsmenüs und andere Komponenten.
- Benutzer können Elemente hinzufügen und entfernen, die ihren Anforderungen entsprechen.
- Die Anordnung der Komponenten oder Elemente richtet sich nach den Anforderungen des Designers.
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.
Reaktionsfähigkeit
Das Seitennavigationsmuster wird für mobile Fenster reduziert. Die Option zur Anzeige ist über das Hamburger-Menü in der Kopfzeile für Mobilgeräte verfügbar.
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. Die UX-Designer analysierten, was verschiedene Versicherer erstellt haben, und nahmen Vergleiche mit anderen Branchen vor, die ähnliche Muster in ihren Designs verwenden, und überprüften die Stärken und Schwächen jeder Version. Wie mobilfreundlich ist das beispielsweise? Was können wir an diesen Designs verbessern? Wie gut wiederverwendbar ist dieses Muster in verschiedenen Produkten? Die Designer nahmen diese Informationen, fanden Gemeinsamkeiten und erstellten ein Muster, das auf diesen Praktiken basiert.
Verwandte Komponenten
- Symbol
- Accordion
- Link
- Avatar
- Badge
- Suche
- Einfacher Fortschrittsbalken
- Schrittfortschrittsbalken
- Phasenfortschrittsbalken
Ressourcen
Laden Sie eine ZIP-Datei mit sämtlichen aktuellen Jutro-Mustern herunter und beginnen Sie mit der Gestaltung.