Kolor

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.