Material 3 Expressive (M3) wurde entwickelt, um den Nutzeranforderungen nach modernen, relevanten und unverwechselbaren Designs gerecht zu werden. Mit „Expressive“ können Designer auch bestimmte Emotionen und Gefühle im Layout und in der Darstellung der Benutzeroberfläche widerspiegeln.
Farbe und Typografie
Das Farbsystem wird erweitert und umfasst jetzt die tieferen Farbtonpaletten von M3 sowie eine größere Auswahl an Tokens. Die einfachere Typografieskala nutzt variable Schriftachsen für mehr Ausdruck, wodurch Interaktionen ausdrucksstärker und ansprechender werden.
Farbgestaltung
Mit den neuen Tokens können mehr Farben in verschiedenen Designs und im Kontext des gesamten Designsystems verwendet werden.
Variable Schriftarten
Die aktualisierten Überlegungen zu variablen Schriftarten und ihren anpassbaren Achsen gehen über 1P hinaus und umfassen auch 3P-Anwendungsfälle wie Roboto Flex, die eine ähnliche Reihe von variablen Achsen hat.
Achse einer variablen Schriftart in Bewegung
Durch die Verwendung von Achsen für variable Schriftarten wird ausdrucksstarkes Bewegungsfeedback signalisiert und die Interaktionen werden ausdrucksstärker und angenehmer.
Beispiele für Anwendungsfälle:
- Dynamische Schriftstärke
- Dynamische Schriftbreite
- Dynamische Schriftstärke und ‑breite
Typrollen
Neben einer aktualisierten und optimierten Typografie führen wir auch neue Typrollen ein, die speziell auf wichtige Muster auf Wear zugeschnitten sind.
Diese neuen Typrollen unterstützen mehrere Anwendungsfälle, darunter Bogen-Text für Oberflächentitel, proaktive Inhalte mit Live-Bereich und eine Typrolle speziell für Ziffern. Sie ermöglichen größere und stilistischere Textgrößen für Strings, die nicht lokalisiert werden müssen.
Form und Bewegung
Außerdem nutzen wir die Formensprache auf viel umfassendere und aussagekräftigere Weise, indem wir flexible Containerformen verwenden, um das Abrunden und Schärfen von Eckenradien zu ermöglichen und so das Morphing von Listen und Schaltflächenstatus zu unterstützen. Wir führen randbündige Schaltflächen als neues, eigenes und ikonisches Designmuster für runde Geräte auf Wear ein.
Container, die sich an den Rand anpassen
Wir haben Formcontainer eingeführt, die rund sind und den Platz im kreisförmigen Formfaktor maximieren.
Form angewendet
Einsatz von Eckenradius und einzigartigen Formen als Container für ausdrucksstarkes Design – bis hin zu ansprechenden Ladeanimationen, interessanten Layouts, Schaltflächen, deren Form mit Morphing bearbeitet wird, und adaptiven Schaltflächengruppen.
Eckenradius
Verwendung von Material 3-Eckenformen, um Vielfalt, Unterscheidung und Beziehung zwischen Containerformen zu ermöglichen.
Gruppierte Container
Komponentencontainer verwenden flexible Layouttechniken, um sich dynamisch an den verfügbaren Platz anzupassen. Sie können den Raum gleichmäßig und symmetrisch aufteilen oder Elemente strategisch anordnen, um eine visuelle Hierarchie zu schaffen, wichtige Inhalte hervorzuheben und die Nutzerinteraktion durch ausdrucksstarke und bewegungsbasierte visuelle Hinweise zu beeinflussen.