Seit 2017 arbeiten Microsofts Design-Teams an einer neuen Gestaltungssprache, dem Fluent Design. Dieses neue Gestaltungssystem soll unter anderem alle Apps, Dienste und Anwendungen des Herstellers mit einer homogenen Ikonografie versehen. Dabei kommt es nicht darauf an, auf welcher Plattform und unter welchem Betriebssystem gearbeitet wird. Microsoft will eine wiedererkennbare, in jeder Hinsicht agnostische Designsprache umgesetzt sehen.
Fluent Design: Seit 3 Jahren arbeitet Microsoft am neuen Gestaltungssystem
In den letzten Jahren haben die Gestalter das Fluent-Design zunächst in engen begrenzten und damit leichter handhabbaren Szenarien, etwa bei der Änderung der Office-Piktogramme, eingesetzt. Hier handelt es sich um relativ wenige Programme mit einem gemeinsamen Thema. Da fällt das Finden eines übergreifenden Design-Konzepts weniger schwer.
Eine Auswahl der neuen Icons. (Grafik: Microsoft)
In den letzten Monaten hingegen hatten sich alle Design-Teams des Redmonder Unternehmens zusammengesetzt und nach Möglichkeiten gesucht, optische Homogenität über alle Produkte des Hauses herzustellen. Als besonders anspruchsvoll galt dabei die Einführung eines homogenen Icon-Satzes für Windows 10. Denn hier gibt es keine klare Themenklammer, aber ein klares Urbild.
Windows-Beta-Nutzer sollten neue Icons bereits sehen
Nun teilt Microsofts Windows-Design-Chefin Christina Koehn die Verfügbarkeit der Windows-10-Symbole mit. In einem ausführlichen Beitrag auf Medium stellt sie Grundannahmen, Vorgehensweisen und Herausforderungen dar, die den Teams bei der Umsetzung begegnet sind.
Microsoft denkt Design neu. (Grafik: Microsoft)
Registrierte Beta-Nutzer, die sogenannten Windows-Insider, sollen nach Koehns Aussage bereits Teile der neuen Piktogramme sehen. Weitere werden nun laufend ausgerollt. Zur allgemeinen Verfügbarkeit äußert sich Koehn nicht. Schon zuvor war indes spekuliert worden, dass die neuen Windows-10-Icons über das nächste große Windows-Update im Frühjahr 2020 verteilt werden würden. Diese Vermutung scheint sich zu bestätigen.
Fluent Design: Redmond hört auf die Kunden
Für das neue Design-System habe Microsoft intensiv auf seine Kunden gehört, so Office-Chefdesigner Jon Friedman. Dabei hätten sie erkennen können, was Kunden nicht mögen, darunter Flat Design und schwache Farben. Auf der anderen Seite zeigte sich indes auch, was Kunden stattdessen bevorzugen, nämlich den Eindruck von Tiefe, Verläufe, starke Farben und Bewegung.
Microsoft hat die Logos aus 3D-Modellen abgeleitet. (Quelle: Microsoft)
In der Tat zeichnet sich Fluent Design durch die Verwendung kräftiger Farben aus. Dabei hat Microsoft immer ein konkretes Farbspektrum, maximal ergänzt um eine benachbarte Farbe, einer App oder Gruppe von Apps zugeordnet, sodass schon aus der Icon-Farbe zu erkennen ist, zu welcher App das Icon wohl gehören wird.
Zudem sollten die Piktogramme nicht im klassischen Flat-Look erscheinen. Microsoft entschied sich für eine isometrische Darstellung, die die Anmutung von Tiefe und Plastizität begünstigt.
Fluent Design: Isometrische Icons erwecken Eindruck von Tiefe
Um den Symbolen den prägnanten 3D-Look zu verleihen, haben die Designer die Icons tatsächlich zunächst in 3D konstruiert und sie dann schrittweise vereinfacht. Dabei durfte das Ziel, die Piktogramme konsistent über Smartphones, Computer und VR-Equipment nutzen zu können, ohne dabei optische Brüche zu zeigen, nicht aus den Augen verloren werden.
Das Mail-Icon im Laufe der Jahre. (Grafik: Microsoft)
Für die Betriebssystem-Icons musste zusätzlich das Urbild von Windows im Auge behalten werden. Hier konnte es keine radikalen Lösungen geben. Immerhin sollten die Symbole als Evolution integrierend wirken und keine Fremdkörper im bekannten Design darstellen.
Neumorphismus hält Einzug in Windows 10
Für die Windows-10-Icons ergab sich daraus laut Koehn eine Mischung aus realen und abstrakten Elementen, denen dennoch eine gemeinsame Gestaltungs-DNA unterliegen sollte. Dabei zeigt sich eine graduelle Rückkehr zum Skeuomorphismus der 2010er Jahre, der allerdings weniger nah an der Realität orientiert wird. Der Begriff Neumorphismus hat sich für diese Art real-abstrakter Gestaltung im UX-Design zwischenzeitlich durchgesetzt und bezeichnet einen der Mega-Trends im Webdesign des Jahres 2020.
Passend dazu:
- Fluent-Design-System: Das steckt hinter der neuen Microsoft-Designsprache für Windows 10
- Fluent Design: Video zeigt Microsofts neue Designsprache in Aktion
- Yammer: Microsoft hübscht das Kollaborations-Tool im Fluent Design auf
- Neues Logo für den Edge-Browser von Microsoft amüsiert Twitter
- Neues Windows-Logo: Microsoft setzt Fluent Design konsequent um
Neumorphismus finde ich persönlich sehr interessant. Habe zu dem UI-Trend auch nen Blogartikel geschrieben.
Spoiler: Hat gewisse Schwachstellen, ist aber dennoch sehr innovativ.