Microsoft kündigt Updates für Fluent Design für Entwickler und Benutzer an

Symbol für die Lesezeit 4 Minute. lesen


Leser unterstützen MSpoweruser. Wir erhalten möglicherweise eine Provision, wenn Sie über unsere Links kaufen. Tooltip-Symbol

Lesen Sie unsere Offenlegungsseite, um herauszufinden, wie Sie MSPoweruser dabei helfen können, das Redaktionsteam zu unterstützen Lesen Sie weiter

In einem Blogbeitraghat Microsoft neue Verbesserungen der Fluent Design-Erfahrung für Entwickler und Benutzer angekündigt.

Das Design-Framework wird derzeit in Apps wie Outlook, Teams und OneDrive sowie Microsoft verwendet kürzlich angekündigte Fluent UI, die ihre Web- und mobilen UI-Bibliotheken unter einer gemeinsamen Charta vereinen.

Microsoft hat eine Weiterentwicklung seiner Entwickler-Frameworks angekündigt, mit Beiträgen von Designern, Entwicklern, Experten für Barrierefreiheit und Internationalisierung sowie Autoren. Sie haben Verbesserungsbereiche identifiziert und wollen dieses Jahr die Lücke zwischen Design und Code schließen, beginnend mit einem Design-Token-System.

Neue plattformübergreifende Bibliothek

Fluent UI ist eine Sammlung von UX-Frameworks zum Erstellen von Web- und mobilen Apps, die Code, Design und Interaktionsverhalten teilen.

Verwenden von Komponenten von Microsoft Fließende UI-Reaktion (Netz), Fließende Benutzeroberfläche von Apple (iOS und macOS) und Fließende UI-Android GitHub-Bibliotheken stellen sicher, dass ihre Microsoft 365-Apps und -Dienste leistungsstarke Tools bleiben, während sie sich plattformübergreifend intuitiver und kohärenter anfühlen. Mit der Hinzufügung ihrer neuen Fließende UI React Native -Bibliothek erstellt Microsoft plattformübergreifende Komponenten, die es JavaScript-Entwicklern erleichtern, Kundenerlebnisse auf allen Geräten schneller bereitzustellen.

Für Entwickler, die native Windows-Erlebnisse erstellen, WinUI verkörpert weiterhin das Fluent Design System.

Für jedes Gerät nativ, immer noch einzigartig fließend

Microsoft sagt, dass sie glauben, dass ihre Fluent Design-Elemente, wie die benutzerdefinierte Navigationsleiste, dafür sorgen, dass sich Apps plattformübergreifend einzigartig fließend und kohärent anfühlen und gleichzeitig in native iOS- und Android-Plattformen passen.

Bereitstellung einer kohärenteren, produktiveren Erfahrung

Die Verwendung der gleichen Designsprache für alle Microsoft 365-Apps ermöglicht es Benutzern auch, einfach von einer App zur anderen zu wechseln und eine ziemlich gute Vorstellung davon zu bekommen, wie man darin navigiert und Dinge erledigt. Gleiches gilt für Plattformen. Microsoft stellt fest, dass Menschen eine Aufgabe oft auf einem Gerät beginnen und auf einem anderen beenden, sodass die Schaffung kohärenter Erfahrungen über Plattformen hinweg die kognitive Überlastung für ihre Kunden reduziert.

Modernisierung der Themenarchitektur von Microsoft

Derzeit verwenden alle Microsoft-Produkte getrennte Designansätze.

Microsoft möchte seine Themenarchitektur modernisieren, um ein skalierbares, zukunftssicheres Designsystem zu schaffen. Zukünftige Designs werden es einfacher und schneller machen, Designwerte auf allen Plattformen zu aktualisieren, indem sie eine gemeinsame Designinfrastruktur, Taxonomie und einen zentralisierten Satz von plattformübergreifenden Stilbibliotheken über Microsoft-Frameworks hinweg verwenden.

Dazu bewegen sie sich weg von festen Werten und hin zu agnostischeren Variablen oder Design-Tokens. Design-Token definieren die visuellen Attribute einer UI-Oberfläche und verknüpfen Design mit Code unter Verwendung einer gemeinsamen Syntax. Zentralisierte Stilbibliotheken, auf die sowohl Design- als auch Entwicklungstools zugreifen können, dienen als Ort, an dem Aktualisierungen vorgenommen werden können, ohne dass codierte Komponenten überarbeitet werden müssen.

Um die Leistungsfähigkeit von Token aufzuzeigen und ihre Komplexität zu verringern, sucht Microsoft nach Möglichkeiten, Designer innerhalb ihrer bestehenden Designtools zu treffen. Da die meisten Designer bei Microsoft Figma verwenden, suchte Microsoft nach Möglichkeiten, die Fähigkeiten dieses Tools zu erweitern, um ihre Design-Token mit wenig bis gar keiner Reibung zu unterstützen.

Das Ergebnis war ein Figma-Plug-in, das das native Eigenschaftsfenster ersetzen wird. Anstatt Designs zu erstellen, indem sie Farben oder Strichstärken über das Eigenschaftsfenster zuweisen, weisen Designer ihren Ebenen Token zu. Sie können diese Token bei Bedarf einem anderen Wert zuordnen, sodass sich alle Änderungen im gesamten Design ausbreiten können. Microsoft baut auch die Entwicklungspipeline auf, die diese Designtoken in plattformspezifische Werte übersetzt.

Zusammen tragen diese Bemühungen dazu bei, Designwerte direkt in die Codebasis zu verteilen und Produktdesignern und Entwicklern einen vollständig integrierten Design-to-Code-Workflow zu bieten.

Dies hat einen Dominoeffekt für Endbenutzer. Benutzer können sich ganz einfach für Themenbibliotheken für von ihnen erstellte Apps anmelden. Sie könnten diese Bibliotheken dann anpassen, um die Marke oder den Service ihres Produkts besser widerzuspiegeln und sich im gesamten Ökosystem kohärenter zu fühlen.

https://vimeo.com/417688279

Entwickler, die nach einem Designsystem suchen, das das native Erscheinungsbild respektiert und UX-Komponenten enthält, die täglich von Hunderten von Entwicklern und Millionen von Verbrauchern verwendet werden, können dies tun Probieren Sie Fluent hier aus. Sowohl interne als auch externe Entwickler können in die eintauchen Fluent UI Microsoft GitHub-Organisation und anfangen zu erstellen.

Microsoft wird online mehr über Fluent UI und ihre zukünftigen Bestrebungen für das Fluent Design System sprechen Microsoft Build 2020-Konferenz am 19. und 20. Mai kostenlos und offen für alle.

Mehr zu den Themen: Entwickler, fließende Gestaltung