Vor der mit Spannung erwarteten Ankündigung dieses Monats veröffentlichte Google versehentlich einen Blogbeitrag, in dem die Überlegungen und Forschungsergebnisse hinter Material 3 Expressive Design, der neuesten Designrichtung des Unternehmens, detailliert beschrieben wurden.
Der vollständige Artikel wurde im Blog archiviert von Wayback Machine (Mit Bildern, die in der unten gezeigten Archivversion nicht zu sehen sind.) Hier sind die wichtigsten Punkte:
Material 3 Expressive stellt das dar, was Google als „mutige neue Designrichtung“ bezeichnet, und ist „das am meisten nachgefragte Update des Google-Designsystems aller Zeiten“. Google möchte mit seinen Apps über „saubere“ und „langweilige“ Designs hinausgehen und Schnittstellen schaffen, die die Menschen auf emotionaler Ebene ansprechen. Neben der vollständigen Bezeichnung wird er auch als „M3 Expressive“ oder einfach als „ausdrucksstarkes Design“ bezeichnet.
Material 3 Expressive entstand aus der Forschung – nicht im Sinne von „41 Shades of Blue“, wo Designentscheidungen an Daten delegiert wurden, sondern im Rahmen einer gemeinsamen Untersuchung von Forschung, Design und Technik.
Im Jahr 2022 begann sich das Material Design-Team zu fragen: „Warum sehen all diese Apps so ähnlich aus? So langweilig? War da nicht Platz für mehr Gefühl?“
In den letzten drei Jahren haben wir die Auswirkungen dieses Dialogs untersucht und Dutzende von Design- und Forschungsrunden durchlaufen, um die nächste Evolutionsstufe des Materialdesigns zu finden. Durch 46 separate Forschungsstudien mit Hunderten von Designs und über 18000 Teilnehmern aus der ganzen Welt haben wir ein schönes, äußerst benutzerfreundliches System optimiert. Die Prinzipien von Material 3 Expressive basieren auf solider Forschung und bewährten Best Practices für die Benutzerfreundlichkeit. Designer können diese neuen Komponenten und Prinzipien daher mit der Gewissheit verwenden, dass sie etwas bauen, das einfach zu verwenden ist und mit dem die Leute eine Verbindung aufbauen können.
Diese Forschungsstudien umfassten:
- Blickverfolgung: Analysieren Sie, worauf Benutzer ihre Aufmerksamkeit richten. Eye Tracking ist ein leistungsstarkes Tool zum Verständnis des Benutzerverhaltens und zur Identifizierung von Bereichen, in denen das Design verbessert werden kann.
- Umfragen und Fokusgruppen: Messung emotionaler Reaktionen auf verschiedene Designs. Diese Methoden helfen zu verstehen, wie Benutzer Designs auf emotionaler Ebene wahrnehmen.
- Experimente: Gefühle und Vorlieben sammeln. Um herauszufinden, welche Designs die Benutzer bevorzugen, und um die Auswirkungen verschiedener Elemente auf das Benutzererlebnis zu bewerten, sind Experimente unerlässlich.
- Benutzerfreundlichkeit: Finden Sie heraus, wie schnell die Teilnehmer die Benutzeroberfläche verstehen und verwenden. Die Benutzerfreundlichkeit ist ein entscheidender Maßstab für den Erfolg jedes Designs und bestimmt, wie einfach und effizient Benutzer ihre Ziele erreichen können.
Google sagt: „Die wesentlichen Bestandteile eines ausdrucksstarken Designs sind die Verwendung von Farbe, Form, Maßstab, Bewegung und Eingrenzung.“ Außerdem: „Material 3 Expressive zeichnet sich durch einen mutigen Einsatz von Formen und Farben aus – und schafft so ein wunderbares Benutzererlebnis.“ Die Verwendung kräftiger Farben und Formen ist ein wichtiger Bestandteil von Material Design 3 Expressive und zielt darauf ab, ansprechende und einprägsame Benutzererlebnisse zu schaffen.
Diese Designaspekte sind auch wichtig, um das Produkt benutzerfreundlicher zu gestalten, indem sie die Aufmerksamkeit auf wichtige Elemente der Benutzeroberfläche lenken, beispielsweise durch Hervorheben wichtiger Aktionen und Gruppieren ähnlicher Elemente. Dies verbessert das Benutzererlebnis und macht es reibungsloser und effizienter.
Die schwebende Symbolleiste ist eine von Material 3 Expressive generierte Komponente. In Konzeptdesigns sehen wir eine pillenförmige untere Leiste, die nicht die gesamte Bildschirmbreite einnimmt. Dadurch sehen wir nur einen kleinen Teil des Hintergrunds, wobei die randlosen Designs deutlicher hervortreten. Es ähnelt dem, was heute in Google Chat verfügbar ist.
Untersuchungen von Google zeigen, dass „ausdrucksstarke Designs einfacher zu verwenden sind“ und den Benutzern helfen, „die Hauptaktion auf jedem Bildschirm schnell zu entdecken und schneller zu navigieren“.
…Die Teilnehmer konnten wichtige UI-Elemente bis zu viermal schneller identifizieren, was zeigt, dass diese Designs die Aufmerksamkeit des Benutzers auf den wichtigsten Teil des Bildschirms lenken. Wir haben viele Apps gesehen, die dieses Verbesserungsniveau erreichen, und es geht über die bloße Fixierungsdauer der Augen hinaus. Wir haben außerdem bei den verschiedenen von uns getesteten Designs eine Verkürzung der zum Klicken auf wichtige Aktionen benötigten Zeit um mehrere Sekunden festgestellt.
Es ist noch einmal wichtig zu betonen, dass es sich hierbei lediglich um Konzeptentwürfe handelt und diese nicht die tatsächlichen Produkte widerspiegeln. (Um etwas Genaueres zu erfahren: Es ist durchgesickert. Neugestaltung der Google-Uhr Über das Wochenende.) Das „Vorher“-Beispiel unten ist jedoch eindeutig die aktuelle Gmail-Benutzeroberfläche.
Wenn wir uns konkrete Designs ansehen, wie etwa die Bildschirme für eine unten gezeigte Fallstudie zu einer E-Mail-App, können wir den Nutzen ausdrucksstarker Designprinzipien aus erster Hand erkennen. Beispielsweise ist die Schaltfläche „Senden“ im neuen Design größer, direkt über der Tastatur positioniert und verwendet eine Sekundärfarbe, um die Aufmerksamkeit darauf zu lenken. Wir können dies mit dem ausdruckslosen Design vergleichen, bei dem in der Symbolleiste oben auf dem Bildschirm eine kleine Schaltfläche „Senden“ zusammen mit anderen Steuerelementen wie dem Anhängen einer Datei platziert ist. Als die Teilnehmer in der App aufgefordert wurden, die E-Mail zu senden, sahen ihre Augen die Schaltfläche im Emoji-Design viermal schneller. Dies spiegelt die Bedeutung eines „ausdrucksstarken Designs“ für die Verbesserung des Benutzererlebnisses wider.
Andere Konzeptentwürfe zeigen eine Uhren-App, Spracheingabe, einen Fotoeditor, Zahlungen und eine Brieftasche:
Der Erfolg oder Misserfolg der Einführung der neuen Benutzeroberfläche hängt davon ab, wie einfach sie zu implementieren ist und wie nahtlos sie von M3 aktualisiert wird. Jetpack Compose scheint heutzutage in einer viel besseren Position zu sein, daher bin ich vorsichtig optimistisch.
Mittlerweile haben Untersuchungen und Benutzertests ergeben, dass „gut umgesetztes, ausdrucksstarkes Design von Menschen aller Altersgruppen einem nicht ausdrucksstarken Design, das den Human User Interface Guidelines von iOS folgt, deutlich vorgezogen wird.“
Google stellte fest, dass „ausdrucksstarke Designs großartig sind“, insbesondere für die Attraktivität einer Marke: „Unsere Untersuchungen haben gezeigt, dass die Verwendung des ausdrucksstarken M3-Designs die Coolness eines Produkts in den Augen der Menschen steigert.“
- …Wir stellten eine 32-prozentige Steigerung der Subkulturwahrnehmung fest, was darauf schließen lässt, dass ausdrucksstarkes Design eine Marke relevanter und „informierter“ erscheinen lässt.
- …34 % mehr Frische, wodurch die Marke frisch und innovativ wirkt.
- …ein Anstieg der Rebellion um 30 %, was darauf hindeutet, dass ausdrucksstarkes Design die Marke als mutigen, innovativen Marktführer positioniert, der bereit ist, mit der Norm zu brechen.
Kommentare sind geschlossen.