System projektowy — część 1

Co to jest system projektowy?

System projektowy to zbiór wytycznych, standardów i zasad dotyczących projektowania. System projektowania zapewnia jednolitość całego produktu.

Dzięki scentralizowanemu systemowi projektowania organizacje mogą zapewnić spójny wygląd i styl wszystkich swoich produktów i platform, co pomaga budować rozpoznawalność marki i zaufanie wśród użytkowników. Ponadto system projektowania może pomóc skrócić czas projektowania i rozwoju, obniżyć koszty i poprawić skalowalność produktów w czasie.

System projektowy zawiera poniższe elementy

Opis elementu wizualnego: kolory, typografia, kształty, cienie, tabele, modale itp.

Wytyczna: margines i odstępy (świetne, jeśli zdefiniujesz system siatki).

Komponenty: Zbiór zasobów wielokrotnego użytku, takich jak przyciski, łącza, znaczniki, zakładki, pola wprowadzania, wyszukiwanie, listy rozwijane, selektor dat, podpowiedzi.

Znaczenie systemu projektowego

Jedno źródło: Jednym z najważniejszych aspektów systemu projektowego jest dokumentacja. Zapewnia szczegółową wiedzę projektową projektantom, programistom i innym interesariuszom.

Szybkość i jakość: systemy projektowe pomagają zespołom pracować szybciej, zachować spójność i poprawiać jakość produktu w miarę upływu czasu. Projektanci nie muszą tworzyć niczego od zera. Zapewnia również jednolitość całego produktu.

Współpraca: Systemy projektowe mogą również ułatwiać współpracę między projektantami i programistami. Zapewniając wspólną platformę projektowania, projektanci i programiści mogą współpracować wydajniej i skuteczniej, zmniejszając ryzyko nieporozumień lub nieporozumień.

Wydajność: Zwiększa wydajność zespołu. Projektanci wykorzystują istniejące wcześniej elementy/komponenty projektu z systemu projektowania. Dzięki temu projektanci mogą skupić się na ważniejszych rzeczach niż na tym, jak powinien wyglądać dany przycisk.

Różnica między systemem projektowania a przewodnikiem po stylu

Przewodnik stylistyczny jest „podklasą” w systemie projektowym. Style Guide koncentruje się głównie na stylu, gdzie Design system to coś więcej niż tylko prezentacja wizualna; koncentruje się na ekosystemie.

Planowanie systemu projektowania

Mapa drogowa nowego systemu może obejmować tylko podstawy, takie jak projekt wizualny (taki jak kolor i typografia), ważne elementy interfejsu użytkownika (takie jak przyciski i formularze) oraz elementy wymagane do przygotowania typowych prezentacji (takie jak rozpoczęcie pracy i system układu/siatki).

Projekt systemu możemy zaplanować w 3 etapach.

1. Zbadaj: sporządź listę każdego pojedynczego elementu projektu i zobacz, co masz. Możesz znaleźć różne typy pól wejściowych, przyciski z różnymi typami wariacji kolorów, ikony i inne różne rzeczy. Wszystkie informacje związane z projektem można podzielić na trzy kategorie.
   A. Elementy wizualne: kolory, typografia, siatki, odstępy i marginesy itp.
   B. Zasoby wielokrotnego użytku: przyciski, łącza, pola wprowadzania, moduły, tabele, znaczniki, zakładki, podpowiedzi, panel nawigacyjny, wyszukiwanie, przycisk radiowy, pole wyboru, data selektor itp.
   C. Efekty: mikroanimacja, cienie, karty i obramowania.

3. Utrzymaj system: Zarządzaj modyfikacjami w systemie w miarę upływu czasu. Od czasu do czasu aktualizuj każdą pojedynczą zmianę w zasobach lub dodawaj nowy zasób w systemie projektowania.

Mam nadzieję, że spodobają Ci się te informacje. W następnym blogu zobaczymy „Jak zbudować system projektowania”. W takim razie zajrzyj na blog „Building Design Systems: Part 2”!