Jetpack Compose Glimmer

Przejrzysty, czytelny design do wyświetlaczy optycznych.

Jetpack Compose Glimmer to system projektowania i zestaw narzędzi interfejsu Google do optycznych wyświetlaczy przezroczystych (OST), takich jak przewodowe okulary XR. System projektowania udostępnia decyzje, które można wykorzystywać wielokrotnie – od podstawowych elementów, takich jak kolor, typ i kształt, po komponenty i wskazówki.

Zasady

Jetpack Compose Glimmer to jedna z pierwszych platform interfejsu, która została zoptymalizowana pod kątem przezroczystych wyświetlaczy i okularów. OST wyświetla światło projektu bezpośrednio na świecie fizycznym, a nie za pomocą nieprzezroczystych ekranów. Glimmer pomaga programistom tworzyć kontrastowe interfejsy, które można szybko przejrzeć i które zachowują obecność w rzeczywistym świecie.

Najpierw przezroczysty wyświetlacz

Zoptymalizowane i oparte na badaniach oraz nauce o kolorach pod kątem przezroczystych wyświetlaczy i okularów, aby zapewnić przemyślane, piękne i przejrzyste wrażenia optyczne.

Najpierw przezroczysty wyświetlacz

Wejście sprzętowe

Dane wejściowe interakcji są dostosowane do możliwości przewodowych okularów XR.

Zaprojektowane z myślą o konkretnym celu

Style i komponenty są specjalnie zaprojektowane do używania na okularach. Biblioteka Jetpack Compose Glimmer jest zoptymalizowana pod kątem przezroczystych wyświetlaczy i wygody użytkownika. Chociaż jest to rozwiązanie specjalnie zaprojektowane, nie jest ono sztywne. Umożliwia dostosowanie podświetlenia ostrości, a także jego typu i koloru.

Zaprojektowane z myślą o konkretnym celu

Style

Język projektowania Glimmer w Jetpack Compose ma uproszczony motyw, który zapewnia optymalną widoczność na okularach. Kolor i typ można dostosować do wyrażeń semantycznych i spójności aplikacji. Zasady projektowania wizualnego kładą nacisk na przejrzystość, czytelność i minimalizowanie elementów rozpraszających uwagę. Okulary przewodowe mają szersze pole widzenia i mogą być mniej podatne na zakłócenia w „rzeczywistym świecie”, ale mimo to warto zadbać o to, aby interfejs nie przeszkadzał.

Glimmer ma motyw podstawowy zoptymalizowany pod kątem okularów OST. Kolor i rodzaj czcionki można dostosować do wyrażania znaczeń i spójności aplikacji. Na wyświetlaczu optycznym kolor czarny jest przezroczysty. Pamiętaj o tym podczas projektowania, ponieważ ciemniejsze kolory będą wyglądać na matowe lub przezroczyste, ale można to też wykorzystać do stworzenia efektu głębi.

Schemat kolorów

Schemat kolorów okularów (zbiór tokenów lub ról kolorów do motywu kolorystycznego aplikacji) składa się z 3 ról akcentujących, 6 ról powierzchniowych (lub neutralnych) i ich odpowiedników w kolorze.

Schemat kolorów

Dostosowywanie koloru

Kolor podstawowy można dostosować, aby używać koloru marki lub głównego koloru interakcji. Zwróć uwagę na kontrast, nasycenie i zużycie energii wybranego koloru.

Dowiedz się więcej o systemie kolorów Glimmer i sprawdzonych metodach.

Typografia

Biblioteka Jetpack Compose Glimmer ma zoptymalizowaną domyślną skalę typograficzną. Role typu składają się z 2 ról, z których każda ma 3 style. Są one oparte na ich przeznaczeniu i hierarchii. Więcej informacji znajdziesz w artykule Typografia Glimmer.

Powierzchnia i głębokość

Platformy zawierają treści. Zapewniają one wyraźne punkty centralne w polu widzenia użytkownika, które mogą zawierać treści lub działania. W Glimmer używane są informacje o powierzchni i głębokości.

Komponenty

Komponenty to specjalnie zaprojektowane elementy składowe do tworzenia interfejsu. W przypadku komponentów aplikacja powinna używać Glimmer z Jetpack Compose, ponieważ jest on zoptymalizowany pod kątem unikalnych przypadków użycia okularów OST. Więcej informacji znajdziesz w artykule Komponenty Glimmer.

Chcesz wdrożyć komponenty? Zapoznaj się z dokumentacją Glimmer w Jetpack Compose.

Komponenty Glimmer mają wiele zastosowań w zakresie UX. Niektóre komponenty obejmują przyciski działań, wskaźniki postępu komunikacji, stosy do przechowywania, nawigację i wskaźniki głosowe do wprowadzania danych.