Czym jest Design System?

Bez względu na formę prezentacji (np. na dedykowanej stronie internetowej) Design System jest zbiorem: 

• opisów dobrych praktyk
• wytycznych
• reguł
• instrukcji
• definicji
• rekomendacji
• sposobów implementacji
• gotowych bibliotek.

Do najbardziej elementarnych składowych Design Systemu należą reguły dotyczące:

• kolorystyki (tonów, odcieni, gradientów)
• logotypów, trustmarków
• elementów graficznych (np. ikon)
• nawigacji
• reguł tworzenia menu, interfejsów, formularzy
• szablonów stron, podstron, ekranów (także w sensie programistycznym)
• systemów siatek
• typografii (rodziny czcionek i sposobów ich zastosowania w różnych rodzajach tekstu i w różnych kontekstach)
• wielkości elementów i ich relacji (np. proporcji, odległości).

Ma to niebagatelne znaczenie, bowiem wyklucza wszelką dowolność, osobiste preferencje.

Uodparnia projekt na zmiany wynikające z wprowadzenia nowego pracownika do zespołu, czy wzajemne niezrozumienie celów i potrzeb, jakimi kierują się specjaliści pracujący przy danym projekcie.

Zastosowanie Design Systemów

Poszczególne komponenty Design Systemu mogą być wykorzystywane w różnych kontekstach i w różnych konfiguracjach.

Zaawansowane, najbardziej szczegółowe Design Systemy, uwzględniają także dozwolone, akceptowalne i niedopuszczalne połączenia poszczególnych elementów.

W tym sensie Design System różni się od prostego Przewodnika Stylów (Style Guide), czy Biblioteki Szablonów (Pattern Library).

Design System tworzony jest zarówno na potrzeby wewnętrzne firmy (np. rozwój, optymalizacja, integracja produktu), jak i zewnętrzne.

Korzyści dla klientów

Klientom, użytkownikom dostarcza wiedzy pozwalającej w szybki, bezproblemy sposób rozpoznać markę.

Wpisuje się w ich oczekiwania i nawyki. Aktywizuje wiedzę o sposobach użytkowania nabytych w czasie korzystania z innych produktów marki. 

Spójność wizualna (branding produktu i marki), funkcjonalna (np. sposób działania) rodziny produktów zwiększa także satysfakcję userów.

Działa tutaj dobrze znana „zasada inżyniera Mamonia” - najbardziej lubimy te rzeczy, które już znamy. Nic dziwnego. 

Znane produkty są przewidywalne i odbierane jako bezpieczne. Co więcej, pozytywne reakcje emocjonalne wywołane w przeszłości przez inny produkt marki, sprawiają, że nowy produkt „na dzień dobry” otrzymuje duży kredyt zaufania i sympatii.

Design System wspiera takie nastawienia, stanowi czytelną dla mózgu sugestię. A nasz mózg bardzo lubi przyjemnie kojarzące się powtórzenia. 

Korzyści wewnętrzne organizacji

Dla firm oznacza duże oszczędności czasu, pracy i pieniędzy. Jednoznaczność, jaką zapewnia wdrożony Design System, redukuje niepewność i konieczność ciągłego informowania o zmianach i potwierdzania, konsultowania wprowadzanych zmian.

Zespół pracuje w ramach wspólnego punktu odniesienia, wspólnego zestawu reguł, obowiązujących wszystkich specjalistów.

W przypadku rozwoju produktów przez zewnętrzne organizacje Design System także przeciwdziała niepożądanym zmianom. 

Do najważniejszych zalet Design Systemu należą:

• efekty psychologiczne – poczucie ładu, kontroli, przewidywalności, sensu, celu
• możliwość testowania i ciągłej optymalizacji
• niższe koszty developmentu
• obniżenie kosztów optymalizacji i wdrożenia nowych produktów
• opanowanie chaosu - prostsze, efektywniejsze zarządzanie projektami
• spójność wizualna, funkcjonalna
• oszczędność czasu, pracy
• wzrost wydajności pracy
• poprawa komunikacji poprzez operowanie tymi samymi definicjami i wzorcami
• pozytywne user experience
• rozwój przez optymalizację (iteracja), zamiast przez rewolucję (praca od podstaw nad każdym elementem)
• skalowalność elementów
• szybsze wdrożenie nowych pracowników
• spójna, trwała, rozpoznawalna tożsamość marki (wspólny styl zapewniony przez style guide), jej rynkowy wyróżnik
• wielokrotność użycia poszczególnych elementów
• wspólna perspektywa, wspólny zasób wiedzy interesariuszy.

Iteracyjny sposób rozwoju jest jednocześnie o wiele mniej kosztowny i o wiele bardziej elastyczny.

Design System tworzony taką metodą o wiele szybciej można zaadaptować do zmieniających się warunków rynkowych i potrzeb użytkowników. 

Tworzenie Design Systems

Stworzenie wyczerpującego Design Systemu wymaga bardzo dużej skrupulatności. Z drugiej zaś strony nie może się ono obejść bez systematycznego aktualizowania.

Prace nad Design Systemem należy zacząć od przygotowania listy wszystkich komponentów najbardziej typowych i najczęściej powtarzanych.

Na tym etapie należy także dokonać ich przeglądu, sprawdzić spójność, opisać reguły oraz wskazać dopuszczalne wyjątki od nich.

Dążenie do kompletności i ciągła jej weryfikacja jest podstawową metodą pracy nad Design Systemem. 

Równie istotne są kwestie nazewnictwa, jasności i jednoznaczności używanych pojęć. Stąd bardzo ważne jest podawanie definicji w każdym budzącym wątpliwości przypadku.

Warto także zwrócić szczególną uwagę na zależności, jakie zachodzą między poszczególnymi elementami (np. między skalą typograficzną a interfejsem).

Czytelność ich roli i informacji, instrukcji, jakie niosą, powinna być taka sama bez względu na kontekst ich użycia.

Przykładowo, ta sama ikona użyta na stronie internetowej i w aplikacji mobilnej może mieć różny stopień czytelności. 

Pamiętaj, a najlepiej nie zapomnij!

Tworzenie Design Systemu jest procesem, jest typowym „work in progress”. Tym samym, nie jest możliwe stworzenie jego ostatecznej wersji.

W określonym czasie może powstać wersja bliska kompletności, ale wciąż możliwa do modyfikacji. Dlatego każdy Design System musi być regularnie, cyklicznie aktualizowany.