Jak wdrożyć design system? 10 ważnych kroków

Jakiś czas temu tłumaczyłam co to jest design system i dlaczego warto go rozważyć. Niespodziewanie okazało się, że nowa rzeczywistość dostarczyła wielu nowych argumentów. Skoro posiadanie tego typu biblioteki staje się oczywiste, podpowiadam jak wdrożyć design system – od czego zacząć pracę i jak przygotować na ten projekt całą organizację.

Nasze doświadczenia związane z tworzeniem design systemów dla różnych firm pokazują, że wdrożenie tego typu biblioteki przynosi oszczędność nawet do 80% czasu pracy programistów. Doceniane jest też znaczne skrócenie time to market oraz możliwość utrzymania spójności systemów, aplikacji i stron internetowych tworzonych przez różne działy. Czy to nie są wystarczające argumenty, aby przeforsować design system w organizacji?

Sprawdź Amethyst – Design System, który opracowaliśmy dla Grant Thornton International.

Jak wdrożyć design system - EDISONDA

Oczywiście, jak każdy duży projekt, który swoim zasięgiem obejmuje różne zespoły i działy, wdrożenie design systemu też potrzebuje dobrego przygotowania i odpowiedniej strategii. Jeśli więc zastanawiasz się, od czego zacząć, że ten tekst dostarczy Ci kilku konkretnych informacji i pomoże podjąć wstępne decyzje.

Jak wdrożyć design system – dlaczego pośpiech nie jest dobrym doradcą?

Powstało już bardzo wiele artykułów mówiących o tym, że budowa design systemu wnosi do firmy bezsprzeczną wartość i jest gwarancją oszczędności. Zanim jednak organizacja zacznie osiągać korzyści – musi zainwestować. Bywa, że kusząca wizja optymalizacji procesów projektowych i ujednolicenia interfejsów przesłania decydentom realne możliwości ich zespołów.

Chęć nadążania za trendami i samodzielnego zbudowania własnego repozytorium często wiąże się z narzuceniem dużego tempa pracy i redukcją czasu realizacji. Nawet jeśli „postawisz” swoją bibliotekę w zawrotnym tempie, zaniedbanie czynności przygotowawczych – analizy istniejącego ekosystemu, edukacji zespołu czy opracowania strategii budowy i rozwoju, zwiększa niestety ryzyko przepalenia firmowych zasobów.

O czym warto pomyśleć, zanim na serio zabierzesz się za wdrożenie design systemu?

Przygotowałam listę zagadnień, które warto rozważyć nim przystąpisz do budowy design systemu, większość to obserwacje z codziennej pracy zespołu EDISONDY. Mamy już sporo tego typu współprac za sobą, a niektórym organizacjom towarzyszymy na stałe przy tworzeniu, wdrażaniu i rozwijaniu DS. O czym więc warto pamiętać?

1. Design System czy biblioteka UI?

Zastanów się, czy twój produkt potrzebuje design systemu z prawdziwego zdarzenia, czy może wystarczy mu biblioteka UI. Biblioteka UI może być wystarczająca, jeśli zależy Ci na spójności, ale produkt, nad którym pracujesz nie jest bardzo złożony. Stworzenie systematyki komponentów oraz elementów graficznych może być punktem wyjścia do budowy pełnego DS, kiedy będziecie jako firma już na to gotowi.

2. Zadbaj o zdobycie wiedzy na temat tworzenia i funkcjonowaniu design systemów

Możesz zrobić to samodzielnie lub współpracując z ekspertem dziedzinowym. Kiedy zapoznasz się z zagadnieniem oraz aktualnymi trendami atomic design, o wiele łatwiej będzie Ci ocenić, czy potencjalny podwykonawca lub Twój zespół mają odpowiednie podejście i wiedzę, aby wdrożyć design system.

Potrzebujesz wsparcia w projektowaniu design systemu?

3. Sprawdź, czy Twoja organizacja dysponuje odpowiednimi zasobami

Gdy zapoznasz się z podstawową wiedzą, zobaczysz, że budowa design systemu to długotrwałe, iteracyjne przedsięwzięcie. Wymaga zaangażowania osób o różnych specjalizacjach. Jeśli Twoja organizacja jest duża, konieczne może być stworzenie dedykowanego zespołu, którego zadaniem będzie tworzenie oraz rozwijanie biblioteki. W zakresie jego obowiązków warto uwzględnić możliwość udzielania konsultacji innym zespołom czy organizację szkoleń. 

4. Wyznacz osobę odpowiedzialną za powołanie oraz rozwijanie design systemu w organizacji

Powodzenie tego przedsięwzięcia w dużym stopniu zależy od tego, czy osoba odpowiedzialna za DS jest w stanie dbać o jego budowę i rozwój. Często wiąże się to z koniecznością podejmowania strategicznych decyzji oraz dostępem do odpowiedniego budżetu.

Pamiętaj, że głównym wyróżnikiem design systemu powinna być dostępność i wdrażalność w całej organizacji (od działu design/UX, przez developerów, marketing i PR, komunikację wewnętrzną i hr, aż po administrację). Osoba, która przejmie odpowiedzialność za koordynację projektu powinna mieć możliwość rozmów i współpracy ponad podziałami organizacyjnych silosów.

5. Zbierz wszystkie konieczne materiały i przeanalizuj artefakty

Rozpoczynając wdrożenie design systemu zaczynasz budować single source of truth, a Twoim celem jest poprawienie jakości oraz wydajności pracy wielu różnych zespołów w firmie. Zastanów się, jaką wiedzę powinien mieć na starcie zespół projektowy. Jeśli dysponujesz danymi na temat użytkowników, brandbookiem, styleguide’m, dokumentacją projektową, wykazem wszystkich produktów i usług, na które wpłynie design system, zadbaj o to by zostały one dobrze przeanalizowane i wykorzystane podczas tworzenia strategii. Pamiętaj, aby porozmawiać z osobami, które pracują na co dzień z produktami. Jeśli ich potrzeby zostaną dobrze zaadresowane, design system będzie wykorzystywany, a projekt opłacalny. To istotne KPI!

Według raportu Research State of Design Systems 2020 trzy najpopularniejsze artefakty, od których organizacje zaczynają budowę design systemów to:

  1. Biblioteka ikon (84%)
  2. UI Kit (83%)
  3. Style Guide (75%)
  4. Biblioteka zakodowanych komponentów (74%)

Warto uwzględnić audyt funkcjonalny produktu i stworzenie wstępnej listy komponentów, które powinny pojawić się w bibliotece. Pamiętaj, aby wyniki inwentaryzacji zaprezentować zespołowi oraz osobom decyzyjnym.

6. Zastanów się, czy wykorzystać istniejący design system, czy raczej zbudować go od zera

Według raportu Research State of Design Systems 2020 80% organizacji decyduje się na budowę własnych design systemów. Głównymi przyczynami są chęć zachowania spójności z marką, specyficzne use-case’y czy fakt, że organizacja wykorzystuje określone technologie.

Na tym etapie warto też m.in. przedyskutować wybór podejścia z developerami, którzy tworzą produkty cyfrowe w Twojej organizacji i będą znaczącymi beneficjentami efektów tych prac. Pamiętaj, że DS będzie wykorzystywany podczas tworzenia stron internetowych, systemów wewnętrznych oraz aplikacji dostępnych dla klientów.

7. Komunikuj zmianę i edukuj swój zespół

Wprowadzenie nowego rozwiązania w dużej organizacji, w której równolegle rozwija się wiele projektów cyfrowych, wymaga opracowania odpowiedniej strategii. Podobnie jak w przypadku rebrandingu – wdrożenie design systemu powinno być szeroko komunikowane. Zrozumienie wartości płynących z jego wykorzystywania może być dobrym punktem wyjścia do budowania dojrzałości projektowej organizacji. Jednym z najważniejszych komunikatów, jaki na pewno zostanie wzięty pod uwagę przez stakeholderów jest znaczna oszczędność czasu, a co za tym idzie też budżetów. Pamiętaj, żeby to wykorzystać.

Jeśli masz na pokładzie odpowiednich ekspertów, możesz ich zaangażować. Jeśli nie – w edukacji może Cię wesprzeć zewnętrzna firma. Czasem nasi klienci, którym zależy na skutecznym rozwijaniu design systemu zamawiają dodatkowe konsultacje i szkolenia UX dla swoich zespołów.

Potrzebujesz szkolenia UX dla swojego zespołu?

8. Zadbaj o przejrzystą dokumentację

Odpowiednie przygotowanie oraz opisanie plików w design systemie jest gwarancją jego reużywalności. Dokumentacja pozwala zrozumieć strukturę oraz zastosowanie elementów systemu osobie, która dopiero dołączyła do zespołu. 

9. Wybierz oprogramowanie, które zaspokoi potrzeby

Dla wielu organizacji budowa design systemu to okazja do przełączenia się na nowe aplikacje graficzne umożliwiające pracę zespołową. Pandemia wymogła na organizacjach przyspieszenie transformacji cyfrowej i sięgnięcie po narzędzia wspierające zdalną współpracę oraz zespołowe tworzenie oprogramowania. 

W ostatnim czasie sporo zmieniło się w świecie projektowym – na czoło listy najczęściej używanych aplikacji niespodziewanie wysunęła się Figma. W roku 2020 23% zespołów tworzących produkty cyfrowe, sięgnęło po Figmę, a 19% po Sketcha. Jeśli stoisz przed wyborem narzędzia, możliwość zdalnej współpracy nad projektem powinna być dla Ciebie obecnie najważniejszym argumentem.

design system wdrożenie EDISONDA

10.  Zbierz drużynę i zaproś do stołu ważnych interesariuszy

W podstawowym zespole projektowo-wdrożeniowym powinni się pojawić eksperci dziedzinowi – projektant UX, projektant graficzny oraz deweloperzy. Warto rozważyć też konsultacje z innymi specjalistami – na przykład z działu marketingu czy odpowiedzialnymi za branding. Sukces przedsięwzięcia zależy w dużej mierze od klarownej komunikacji i porozumienia w kwestii metod budowania design systemu. Będziecie wspólnie dbać o jego aktualizacje oraz odpowiednio go rozwijać.

Jeśli nie masz na pokładzie odpowiednich specjalistów, rozważ pozyskanie wsparcia z zewnątrz lub zatrudnienie osób, które mają odpowiednie kompetencje i wiedzą, jak wdrożyć design system. Dbając o odpowiednią edukację – zarówno siebie, jak i zespołu, będziesz mieć pewność, że biblioteka będzie odpowiednio wykorzystywana w całej organizacji, a jej wdrożenie przyniesie realne korzyści, w tym oczekiwane oszczędności.

Chcesz wdrożyć design system w Twojej firmie?