System projektowania to zbiór decyzji projektowych wielokrotnego użytku, które są wyrażone w postaci wskazówek, komponentów i wzorców. System można podzielić na najmniejsze elementy projektu, takie jak kolor, typ czy kształt, które składają się na większe, złożone komponenty. Na przykład ikona i etykieta tekstowa tworzą komponent przycisku, a wiele przycisków i powierzchnia tworzą kartę. Systemy projektowe zawierają też zestaw wskazówek, które składają się z tych istniejących decyzji projektowych dotyczących komponentów i wzorców.
Material Design to system projektowania typu open source opracowany przez Google, który pomaga tworzyć atrakcyjne produkty zorientowane na użytkownika. Material 3 to najnowsza wersja Material Design.
Komponenty Material Design
Material Design udostępnia szereg komponentów opartych na kodzie, które są interaktywnymi elementami składowymi służącymi do tworzenia interfejsu użytkownika. Te komponenty można podzielić na 5 kategorii według ich przeznaczenia: działanie, kontener, nawigacja, wybór i wpisywanie tekstu.
Komponenty działania
Komponenty działania pomagają użytkownikom osiągnąć cel.
Material Design ma kilka rodzajów przycisków, które pomagają określać priorytet działań i interakcji w różnych kontekstach. Od pływających przycisków czynności lub rozszerzonych pływających przycisków czynności w przypadku działań podstawowych po pomocnicze przyciski z ikonami i wybieranie opcji za pomocą przycisków segmentowych.
Komponenty komunikacyjne
Komponenty komunikacyjne dostarczają przydatnych informacji, powiadamiając użytkowników za pomocą plakietek, informując o stanie za pomocą wskaźników postępu i wyświetlając krótkie komunikaty o procesie za pomocą pasków powiadomień.
Komponenty lokalizacji firmy w siedzibie innej firmy
Komponenty kontenera zawierają informacje i działania, w tym inne komponenty, takie jak przyciski, menu czy elementy. Większość komponentów Material korzysta z jawnego ograniczenia, grupując powiązane treści i działania za pomocą obiektów wizualnych: kart, okien dialogowych, arkuszy dolnych, arkuszy bocznych, karuzel i dymków. Listy mogą być dostarczane z niejawnym lub jawnym ograniczeniem przez wyświetlanie widocznych separatorów. Te komponenty zapewniają typowe wzorce wyświetlania grup treści.
Komponenty nawigacji
Komponenty nawigacyjne ułatwiają użytkownikom poruszanie się po interfejsie. Na urządzeniach mobilnych pasek nawigacyjny lub menu nawigacyjne zawierają główne miejsca docelowe nawigacji. Karty, dolny pasek aplikacji i górny pasek aplikacji zapewniają różne sposoby poruszania się po informacjach pomocniczych i działaniach. Dowiedz się więcej o korzystaniu z nawigacji w układach.
Komponenty wyboru
Komponenty wyboru umożliwiają użytkownikom określanie opcji. Niezależnie od tego, czy tworzysz formularz z polami wyboru i przyciskami opcji, filtrujesz dane za pomocą elementów czy przełączasz ustawienia za pomocą przełączników i suwaków, komponenty wyboru umożliwiają użytkownikom kontrolowanie i wprowadzanie decyzji.
Komponenty wprowadzania tekstu
Komponenty do wpisywania tekstu umożliwiają użytkownikom wpisywanie i edytowanie tekstu. Pola tekstowe w interfejsie pozwalają użytkownikom wpisywać tekst.
Systemy projektowania w Compose
Więcej informacji o tym, jak za pomocą Compose płynniej wdrażać system projektowania i zapewnić aplikacji spójny wygląd dzięki motywom, komponentom i innym aspektom systemu projektowania, znajdziesz w artykule Systemy projektowania w Compose.