Twórz bardziej dostępne schematy kolorów, które ułatwiają zrozumienie hierarchii, stanu i marki produktu. W przypadku projektowania aplikacji na urządzenia noszące kolor odgrywa kluczową rolę w polepszeniu czytelności, użyteczności, atrakcyjności wizualnej i wyrazu, zwłaszcza na mniejszych ekranach.
W następujących zasadach znajdziesz informacje o tym, jak używać kolorów w różnych motywach.
Budowanie z czarnego
Zamiast tła zastosowanego w telefonach zegarki mają czarne tło. Chociaż motywy ciemny są przeznaczone do ciemnych pomieszczeń, a jasne do jasnych, interfejsy zegarków muszą działać płynnie zarówno w dzień, jak i w nocy. Dlatego kolorowe tokeny dla zegarków muszą być odpowiednio dopasowane.
Nowe role kolorów
System kolorów Material 3 zachowuje strukturę 3 kolorów akcentów i 2 neutralnych kolorów powierzchni, ale wprowadza kolory kontenerów w rolach akcentów. Te nowe role umożliwiają większą ekspresję bez zakłócania hierarchii wizualnej, zapewniając w podstawie odmiany kolorów powierzchni ze zwiększoną chromatycznością. Role kontenera są szczególnie przydatne do wyróżniania stanów, takich jak przełączniki, lub do uzupełniania stylizacji, gdy akcent główny jest już używany.
znaczenie semantyczne,
W interfejsach zegarków kolory muszą jasno i intuicyjnie przekazywać znaczenie. Na przykład kolor czerwony oznacza błędy, a zielony – powodzenie. Dzięki temu użytkownicy mogą szybko zrozumieć działania lub stany bez konieczności podawania dodatkowych wyjaśnień. Takie semantyczne użycie kolorów pomaga użytkownikom poruszać się po interfejsie i bez obaw podejmować działania.
Dostępność kolorów (zgodność z wymaganiami dotyczącymi kontrastu)
W interfejsach zegarków kolory muszą jasno i intuicyjnie przekazywać znaczenie. Na przykład kolor czerwony oznacza błędy, a zielony – powodzenie. Dzięki temu użytkownicy mogą szybko zrozumieć działania lub stany bez konieczności podawania dodatkowych wyjaśnień. Takie semantyczne użycie kolorów pomaga użytkownikom poruszać się po interfejsie i bez obaw podejmować działania.
Nowości
Wprowadziliśmy istotne zmiany w systemie projektowania wizualnego oraz w sposobie, w jaki ulepszamy możliwości wyrażania siebie poprzez aktualizacje naszych bibliotek stylów, komponentów i kafelków.
System kolorów Material 3 Expressive obejmuje te funkcje:
- Wbudowany zestaw dostępnych relacji kolorów
- Ponad 28 ról kolorów zmapowanych na komponenty Material Design
- Wbudowane kolory ciemnego motywu do tworzenia na podstawie czerni
- Ulepszone wartości kolorów wyłączonych
- Dodatkowe kolory błędów
- Statyczny kolor bazowy z domyślnymi kolorami przypisanymi do poszczególnych ról kolorów
- dynamiczne funkcje kolorów, w tym system/tarcza zegarka i motywy kolorystyczne oparte na obrazach;
Materiały
Aby dowiedzieć się więcej, zapoznaj się z tymi materiałami.
Wskazówki dotyczące kolorów w Material Design
Poznaj najnowsze sprawdzone metody tworzenia schematów kolorów za pomocą Material 3 Expressive.