Erstellen Sie barrierefreiere, persönliche Farbschemata, die die Hierarchie, den Status und die Marke Ihres Produkts kommunizieren. Beim Design von Wearables spielt Farbe eine entscheidende Rolle bei der Verbesserung der Lesbarkeit, Usability, visuellen Attraktivität und Ausdruckskraft, insbesondere auf kleineren Bildschirmen.
In den folgenden Prinzipien wird erläutert, wie Farben für verschiedene Themen verwendet werden können.
Von Schwarz aus erstellen
Smartwatches haben einen schwarzen Hintergrund anstelle des getönten Hintergrunds, der auf Smartphones verwendet wird. Dunkle Designs sind für Umgebungen mit wenig Licht und helle Designs für Tageslicht gedacht. Die Benutzeroberfläche einer Smartwatch muss jedoch sowohl bei Tag als auch bei Nacht reibungslos funktionieren. Daher müssen Farb-Tokens für Smartwatches speziell angepasst werden.
Neue Farbrollen
Das Farbsystem von Material 3 behält die Struktur von drei Akzentfarben und zwei neutralen Oberflächenfarben bei, führt aber Containerfarben in den Akzentrollen ein. Diese neuen Rollen ermöglichen ein größeres Ausdruckspotenzial, ohne die visuelle Hierarchie zu stören. Sie bieten im Wesentlichen Oberflächenfarbvarianten mit erhöhter Farbsättigung. Containerrollen sind besonders nützlich, um Status hervorzuheben, z. B. bei Ein-/Aus-Schaltflächen, oder um ein ergänzendes Design zu bieten, wenn der primäre Akzent bereits verwendet wird.
Semantische Bedeutung
In der Smartwatch-Benutzeroberfläche müssen Farben ihre Bedeutung klar und intuitiv vermitteln. So steht beispielsweise Rot für Fehler und Grün für Erfolg. So können Nutzer schnell Aktionen oder Status verstehen, ohne dass zusätzliche Erklärungen erforderlich sind. Diese semantische Verwendung von Farbe hilft Nutzern, sich in Ihrer Benutzeroberfläche zurechtzufinden und sicher Maßnahmen zu ergreifen.
Barrierefreie Farben (Kontrast)
In der Benutzeroberfläche einer Smartwatch müssen Farben ihre Bedeutung klar und intuitiv vermitteln. So steht beispielsweise Rot für Fehler und Grün für Erfolg. So können Nutzer schnell Aktionen oder Status verstehen, ohne dass zusätzliche Erklärungen erforderlich sind. Diese semantische Verwendung von Farbe hilft Nutzern, sich in Ihrer Benutzeroberfläche zurechtzufinden und sicher Maßnahmen zu ergreifen.
Das ist neu
Es gibt erhebliche Änderungen am visuellen Designsystem und daran, wie wir die Ausdruckskraft durch Aktualisierungen unserer Stilgrundlagen, Komponenten und Designbibliotheken für Kacheln steigern.
Das expressive Farbsystem von Material 3 umfasst die folgenden Funktionen:
- Integrierte Farbbeziehungen für Barrierefreiheit
- Über 28 Farbrollen, die Material-Komponenten zugeordnet sind
- Vordefinierte Farben für dunkle Designs, die auf Schwarz basieren
- Verbesserte Farbwerte für deaktivierte Elemente
- Zusätzliche Fehlerfarben
- Statische Baseline-Farbe mit Standardfarben, die jeder Farbrolle zugewiesen sind
- Dynamische Farbfunktionen, einschließlich System-/Zifferblatt und bildbasierte Farbthemen
Ressourcen
Weitere Informationen finden Sie in den folgenden Ressourcen.
Farbrichtlinien für Material Design
Hier finden Sie die neuesten Best Practices für Farbschemata mit Material 3 Expressive.
