Material 3 Expressive: Neue Toolbar-Designs von Google

MÜNCHEN (IT BOLTWISE) – Google setzt mit Material 3 Expressive auf neue Design-Elemente, die die Benutzeroberfläche von Apps revolutionieren sollen.

Google hat mit Material 3 Expressive eine neue Design-Philosophie vorgestellt, die darauf abzielt, die Benutzeroberfläche von Apps durch innovative Toolbar-Designs zu verbessern. Diese Initiative konzentriert sich auf die Einführung von Docked- und Floating-Toolbars, die Entwicklern mehr Flexibilität und Anpassungsmöglichkeiten bieten sollen. Die Docked-Toolbar erstreckt sich über die gesamte Breite des Fensters und eignet sich besonders für globale Aktionen, die auf mehreren Seiten gleich bleiben. Sie ersetzt die bisherige untere App-Leiste, die nun als veraltet gilt.

Im Gegensatz dazu schwebt die Floating-Toolbar über dem Hauptinhalt und ist ideal für kontextbezogene Aktionen, die sich auf den spezifischen Seiteninhalt beziehen. Diese Toolbar kann in Kombination mit einem Floating Action Button (FAB) verwendet werden, um eine nahtlose Benutzererfahrung zu schaffen. Ein Beispiel für die Anwendung dieser neuen Komponente ist die überarbeitete Albenansicht in Google Fotos, die nun Schaltflächen für Teilen, Hinzufügen und Bearbeiten bietet und so ein vollflächiges Erlebnis am oberen Rand der Seite ermöglicht.

Interessanterweise können Floating-Toolbars auch als Registerkarten zwischen verwandten, aufeinanderfolgenden Seiten innerhalb der Produktstruktur verwendet werden, wie es bei Fitbit für den Wechsel zwischen Tages-, Wochen-, Monats- und Jahresansichten der Fall ist. Auf größeren Bildschirmen können diese Toolbars auch vertikal platziert werden, um die Benutzerfreundlichkeit zu erhöhen. Google empfiehlt, die Floating-Toolbars nicht über den Rand des Fensters oder der Paneele hinaus zu erweitern. Für Apps mit mehr Aktionen steht ein Überlaufmenü zur Verfügung.

Die Farbkonfigurationen der Toolbars sind ebenfalls anpassbar, wobei zwischen einem Standard- und einem lebhaften Farbschema gewählt werden kann. Das Standardschema eignet sich für eine geringe Betonung, um die Aufmerksamkeit auf den Hauptinhalt zu lenken, während das lebhafte Schema eine hohe Betonung bietet, um die Aufmerksamkeit auf die Bedienelemente zu lenken oder eine vorübergehende Änderung des Seitenverhaltens anzuzeigen, wie z.B. den Wechsel in den Bearbeitungsmodus.

Ein bemerkenswerter Aspekt von Material 3 Expressive ist die Empfehlung, keine Toolbar und Navigationsleiste (untere Leiste) gleichzeitig zu verwenden. Stattdessen sollte die Navigationsleiste auf den Hauptseiten und die Toolbars auf den Folgeseiten mit Aktionen angezeigt werden. Dies wirft die Frage nach der Existenz einer schwebenden Navigations- oder unteren Leiste auf, die in Material 3 Expressive derzeit nicht vorhanden ist. Trotz ihrer fortgesetzten Präsenz in Google Chat könnte eine solche Komponente in einem zukünftigen Update von Material 3 Expressive eingeführt werden.

Material 3 Expressive ist ein bedeutender Schritt in der Weiterentwicklung der Benutzeroberflächen von Google-Apps. Es bietet Entwicklern neue Möglichkeiten, die Benutzererfahrung zu verbessern und gleichzeitig die Konsistenz und Flexibilität der App-Designs zu erhöhen. Mit der Einführung dieser neuen Toolbars wird erwartet, dass Entwickler und Nutzer gleichermaßen von den verbesserten Interaktionsmöglichkeiten profitieren werden.

Unseren KI-Morning-Newsletter «Der KI News Espresso» mit den besten KI-News des letzten Tages gratis per eMail - ohne Werbung: Hier kostenlos eintragen!