Design system: co to jest i kiedy się opłaca. Czego uczą GOV.UK, REA i Allegro

Co to jest design system

Nielsen Norman Group, jedna z najbardziej znanych firm badających użyteczność, opisuje design system jako komplet standardów, które pozwalają zarządzać projektowaniem na dużą skalę dzięki komponentom i wzorcom używanym wielokrotnie („Design Systems 101”). Taki system ma zwykle trzy warstwy. Pierwsza to wytyczne wizualne: kolory, typografia, logo. Druga to biblioteka komponentów, czyli przyciski, pola formularzy czy karty zaprojektowane i zakodowane raz. Trzecia to wzorce, które mówią, jak z tych klocków składać większe całości, na przykład nawigację albo formularz zamówienia.

Jest też czwarty, mniej widoczny element: ludzie. Design system ktoś musi utrzymywać, poprawiać i rozwijać. Bez tego po roku opisuje produkt, którego już nie ma.

Design system, brandbook i UI kit

Te trzy rzeczy łatwo pomylić. Brandbook, czyli księga identyfikacji wizualnej, mówi, jak wygląda marka: jakie ma logo, kolory i fonty. UI kit to plik z elementami interfejsu w programie do projektowania. Design system łączy jedno i drugie z kodem i zasadami użycia, a do tego ma właściciela. Figma w swoim wprowadzeniu do design systemów nazywa style guide jego podzbiorem, skupionym na warstwie wizualnej. Cały system obejmuje także standardy kodu i użyteczności.

Dla firmy ta różnica jest bardzo praktyczna. Z brandbooka korzysta drukarnia i agencja. Z design systemu korzystają zespoły, które co tydzień budują nowe ekrany, podstrony i materiały.

Ile oszczędzają firmy, które go mają

Najdokładniej policzyła to australijska REA Group, właściciel portali z nieruchomościami. Chris Stonestreet, który odpowiada tam za design systemy, pokazał na konferencji Web Directions w 2023 roku, jak firma mierzy wartość systemu Construct Kit. Korzysta z niego około 58 projektantów i 319 programistów pracujących dla czterech marek. Według wyliczeń firmy od 2018 roku system zaoszczędził około 300 tysięcy godzin projektowania i programowania. Praca nad nową stroną główną skurczyła się z około 240 do 60 dni pracy programistów.

Podobne liczby podaje Headspace, firma od aplikacji do medytacji, w studium przypadku opublikowanym przez Figmę. Przeciętny plik projektowy składa się tam w 85 procentach z tokenów i komponentów design systemu. Proste zadania zajmują o 20 do 30 procent mniej czasu, a przy złożonych czas spada nawet o połowę. Przygotowanie trybu jasnego i ciemnego zajmowało godzinę, teraz trwa minutę. Jeden z inżynierów szacuje, że wydawanie nowych wersji przyspieszyło o 30 procent.

Te liczby podają same firmy, więc warto czytać je z zapasem. Bardziej kontrolowane są dwa starsze eksperymenty. W teście zespołu Figmy z 2019 roku projektanci z dostępem do design systemu kończyli zadanie o 34 procent szybciej, choć sama Figma zaznacza, że to górna granica, bo system idealnie pasował do zadań. Agencja Sparkbox poprosiła ośmiu programistów, żeby dwa razy zakodowali ten sam formularz, raz od zera, raz z systemem IBM Carbon. Z systemem poszło o 47 procent szybciej. Próba była mała, ale wszystkie wyniki wskazują ten sam kierunek.

Rebranding bez przerabiania każdej strony

Dobrze widać to w brytyjskiej administracji. GOV.UK Design System to wspólne komponenty dla rządowych serwisów internetowych. Już w 2020 roku działał w ponad 300 serwisach, a Government Digital Service szacowało, że oszczędza państwu 17 milionów funtów rocznie.

W czerwcu 2025 roku GOV.UK zaczęło odświeżać markę we wszystkich swoich produktach. Zespoły, które korzystały z aktualnej wersji systemu, nie musiały robić nic, bo nowa identyfikacja przyszła razem z aktualizacją. Instrukcja dla nich mieści się w jednym zdaniu.

“You do not need to take any action.”

„Nie musicie nic robić” (tłum. CAASUAL).

Dla firmy, która myśli o rebrandingu, to chyba najważniejsza lekcja. Bez design systemu nowe kolory i fonty trzeba ręcznie wprowadzać na każdej podstronie, w każdej aplikacji i w każdym szablonie. Z systemem większość zmian robi się w jednym miejscu.

Kiedy design system się nie opłaca

Nielsen Norman Group pisze wprost, że design system ma sens, gdy firma ma przed sobą lata powtarzalnej pracy projektowej. Przy prototypie albo produkcie z kilkoma ekranami na szybki zwrot raczej nie ma co liczyć. System wymaga też stałego zespołu, bo nie kończy się w dniu oddania.

Największym kłopotem bywa jednak to, że ludzie z niego nie korzystają. W raporcie zeroheight za 2026 rok, opartym na ankiecie wśród 147 osób pracujących z design systemami, adopcja i świadomość systemu w firmie od pięciu lat z rzędu zajmują pierwsze miejsce na liście wyzwań. Trzy na pięć zespołów ma za mało ludzi, a zwrot z inwestycji mierzy tylko około 5 procent z nich.

Spotify przekonało się, co się dzieje, gdy system nie pasuje do organizacji. Centralny zespół pierwszego systemu stał się wąskim gardłem dla niezależnych zespołów produktowych. Kiedy go rozwiązano, zespoły zaczęły budować własne rozwiązania i w pewnym momencie firma naliczyła ich 22. Wyjściem okazała się rodzina systemów ze wspólną podstawą, czyli kolorami, typografią i tokenami, do której zespoły dobudowują swoje części. Koszt utrzymania zna też Allegro. Jego zespół opisywał na blogu technicznym, że wspólne style systemu Metrum przyspieszyły ładowanie stron, ale aktualizowanie zależności stało się przez to dużo trudniejsze.

Dlaczego w erze AI design system waży więcej

Do niedawna z design systemu korzystali projektanci i programiści. Dziś coraz częściej korzystają z niego agenci AI, którzy na prośbę marketingu, sprzedaży czy product managera budują ekrany i materiały. Bez systemu każdy agent zgaduje kolory, odstępy i przyciski. Opisywaliśmy to na przykładzie BILL w tekście o design systemie dla agentów AI.

Allegro modernizuje swój system właśnie z tą myślą. Marcin Łasica, który odpowiada tam za jakość projektowania, mówi w rozmowie opisanej przez Netguru, że firma od początku traktuje AI jako pełnoprawnego użytkownika design systemu. Nazwy, struktura i ograniczenia mają być zapisane tak, żeby modele składały interfejsy zgodne z marką. Uber wykorzystał AI z drugiej strony i kazał mu dokumentować swój system Base. Agent połączony z Figmą przygotowuje specyfikacje komponentów w kilka minut zamiast tygodni.

Ciekawy jest też wynik badania zaprezentowanego w 2026 roku na konferencji CHI. Naukowcy z Seulu porównali trzy sposoby przekazania modelowi językowemu design systemu. Najlepiej wypadł rejestr gotowych komponentów, ze zgodnością na poziomie 95 procent, a nie sam opis zasad. Duże firmy już to wykorzystują: Atlassian i GitHub udostępniają publicznie serwery MCP, przez które agenci sięgają po komponenty i tokeny ich systemów (Atlassian Design System, Primer).

Jak ocenić, czy Twoja firma go potrzebuje

Dobrze zacząć od policzenia, ile ekranów, podstron i szablonów powstaje w ciągu roku i ile zespołów przy nich pracuje. Jeśli to jedna strona zmieniana dwa razy w roku, wystarczy porządna identyfikacja wizualna i kilka szablonów. Kiedy produkt rośnie z każdym sprintem, marketing co tydzień potrzebuje nowych landing page’y, a z AI korzysta kilka działów, system zwraca się znacznie szybciej.

Na start wystarczą tokeny, czyli kolory, typografia i odstępy zapisane jako nazwane wartości, oraz najczęściej używane komponenty. Do tego osoba, która odpowiada za system, i prosta miara, na przykład jaka część nowych ekranów powstaje z gotowych elementów. Takie systemy projektujemy razem z interfejsem w ramach projektowania UX/UI, a w usłudze AI design workflows dbamy o to, żeby korzystały z nich też narzędzia AI. To obszar spójność bez pilnowania.