Google veröffentlicht die Material Color Utilities-Bibliothek, um auf Hintergrundbildern basierende dynamische Themen auf mehr Plattformen verfügbar zu machen.
Google meint es ernst mit dem dynamischen Themensystem von Material You. Das will das Unternehmen offenbar Weitere Android-OEMs bieten eine Theme-Engine an (Monet oder so ähnlich) An Android 12 Geräte, aber das scheint nicht das Ausmaß von Googles Plänen für sein hintergrundbasiertes Themensystem zu sein. Das Unternehmen hat nun die Codebibliothek Material Color Utilities als Open-Source-Lösung bereitgestellt, um das neue Designsystem auf mehr Plattformen zu bringen.
In einem aktuellen Blogbeitrag (via 9to5Google), enthüllt James O'Leary von Google, dass es sich bei Material Color Utilities um eine plattformübergreifende Codebibliothek für Farben handelt Enthält alles, was Entwickler benötigen, um das dynamische Designsystem von Material You auf verschiedenen Plattformen zu implementieren. Derzeit ist die Bibliothek in Dart, Java und Typescript verfügbar, Google plant jedoch, sie auf iOS, CSS über SASS und GLSL-Shader zu bringen. Da es sich um Open Source handelt, kann jeder zur Bibliothek beitragen.
Darüber hinaus beleuchtet der Blogbeitrag genau, wie das dynamische Theming-System unter Android 12 funktioniert. Wie im Beitrag erläutert, geschieht jedes Mal, wenn Sie das Hintergrundbild auf einem Android 12-Gerät ändern:
„Zuerst wird das Hintergrundbild quantisiert, indem die tausenden darin enthaltenen Farben auf eine kleinere Zahl reduziert werden, indem sie im Farbraum zusammengeführt werden. Der reduzierte Farbsatz ist klein genug, um statistische Algorithmen effizient auszuführen. Diese Algorithmen werden zum Bewerten und Filtern von Farben verwendet. Android 12 bietet Farboptionen für die Farbigkeit und die Darstellung des Bildes und filtert Farben heraus, die nahezu monochrom sind.
Eine Farbe, die vom Algorithmus standardmäßig auf die oberste Farbe gesetzt oder vom Benutzer in der Hintergrundauswahl ausgewählt wird, wird zur Quellfarbe. Sein Farbton und seine Farbsättigung beeinflussen das gesamte Farbschema und ermöglichen je nach Farbwahl des Benutzers ein leuchtendes Blau oder ein gedämpftes Grün.
Mithilfe der Quellfarbe erstellen wir die Kernpalette, die aus fünf Tonpaletten besteht. Eine Tonpalette wird durch einen Farbton und ein Chroma definiert; Die Farben in der Palette stammen aus unterschiedlichen Tönen. Diese Tonpaletten reduzieren die kognitive Belastung für Designer bei der Erstellung eines Designsystems: Anstatt Farbton und Chroma für jede Rolle anzugeben, kann eine Tonpalette ersetzt werden.
Schließlich füllen wir die Tabelle aus, die den Farbton, die Chroma und den Ton jeder Farbrolle definiert, und verwenden dann diese Werte und HCT, um die im Thema verwendeten Farben zu erstellen.“
Darüber hinaus beleuchtet der Blogbeitrag, wie Google eine neue HCT-Farbe (Hue, Chroma, Tone) entwickelt hat System, das das bestehende HSL-System (Farbton, Sättigung, Helligkeit) ersetzt und das Entwerfen mit Farben ermöglicht Einfacher. Weitere Informationen zu diesem neuen Farbsystem finden Sie im ursprünglicher Blogbeitrag.