Einstellungen

Überblick

Das Muster Einstellungen hilft Benutzern, Einstellungen in Web-Apps zu ändern und damit zusammenhängende Aktionen in Verbindung mit ihren Kontoeinstellungen durchzuführen.

Zu verwenden

Wenn Benutzer ihre Kontoeinstellungen ändern müssen (z. B. Sprache, Anmeldedaten und andere).

Nicht zu verwenden

• Wenn die App oder die Benutzerberechtigungen es nicht zulassen, dass der Benutzer die App-Einstellungen oder Präferenzen ändert.
• Zur Anzeige von Einstellungen, die der Benutzer nicht ändern kann.

Aufbau

1. Überschrift der Einstellungskarte: Zeigt eine h2-Überschrift und eine Aktionsschaltfläche an.
2. Hauptteil der Einstellungskarte: Enthält die Einstellungsdetails in Bezug auf den Karteninhalt.
3. Bearbeiten-Schaltfläche: Ermöglicht die Bearbeitung des Karteninhalts, indem vom Anzeigemodus in den Bearbeitungsmodus gewechselt wird.

Allgemeine Richtlinien

• Positionieren Sie die Beschriftungen über den Feldern der Einstellungskarte, damit sie besser lesbar sind.
• Gruppieren Sie Eingaben horizontal, wenn eine Gruppierung sinnvoll ist (z. B. Adresse und Postleitzahl).
• Der Titel der Einstellungskarte sollte der hierarchischen Reihenfolge der Überschriften folgen. Wenn die vorangehende Ebene h1 ist, verwenden Sie h2 für den Kartentitel.
• Überladen Sie die Seite nicht mit mehreren primären Aktionen, da dies die Aufmerksamkeit von Aktionen mit höherer Priorität (z. B. „Speichern“ im Bearbeitungsmodus) ablenkt.

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.

Anzeige- und Bearbeitungsmodus

Einstellungskarten können sich im Anzeigemodus (links) oder im Bearbeitungsmodus (rechts) befinden, je nachdem, welche Benutzeraufgabe gerade anliegt. Im Anzeigemodus kann der Benutzer nur den Inhalt anzeigen. Um mit dem Inhalt interagieren zu können, muss sich der Benutzer im Bearbeitungsmodus befinden.

Anzeigemodus	Bearbeitungsmodus

Kartenbreite

Optimieren Sie die Informationsdichte, indem Sie zwei oder drei Karten mithilfe des Inhaltsrasters in einer Reihe anordnen. Ordnen Sie die Karten so an, dass ein effizienter Arbeitsablauf möglich ist.

Legen Sie nicht automatisch für alle Karten die maximale Breite fest. Zu wenig Inhalt für die Größe der Karte verschwendet Platz und positioniert die Aktionsschaltflächen weit vom Inhalt entfernt.

Eingabebreite

Versuchen Sie, die Größe der Eingaben entsprechend der ungefähren Länge der Informationen zu bestimmen, die sie vernünftigerweise enthalten können. Dies bietet den Benutzern einen hilfreichen Hinweis, nutzt den Platz effizient aus und positioniert Ziele wie Dropdown-Pfeile in Reichweite. Das Runden von Längen auf die nächste Hälfte oder das nächste Drittel kann für mehr Konsistenz sorgen und bei der Gruppierung verwandter Felder helfen.

Erweitern Sie Eingaben nicht automatisch so, dass sie den gesamten Platz ausfüllen. Das verschwendet Platz und erschwert dem Benutzer die Auswertung der Informationen.

Reaktionsfähigkeit

Das Einstellungsmuster ist sowohl im Anzeigemodus (links) als auch im Bearbeitungsmodus (rechts) reaktionsfähig.

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

Verwandte Komponenten

• Texteingabe
• Schaltfläche
• Andere Eingaben je nach Bedarf (z. B. Dropdown und Datum)

Ressourcen

Laden Sie eine ZIP-Datei mit sämtlichen aktuellen Jutro-Mustern herunter und beginnen Sie mit der Gestaltung.

Jutro-Musterbibliothek (19.6 MB)