Pod tą nazwą kryją się dwie różne rzeczy. Zanim firma zamówi design system, dobrze jest ustalić, o którą chodzi.
System produktu i system marki
- Design system produktu cyfrowego obsługuje aplikację, sklep albo serwis. Składa się z elementów interfejsu: przycisków, pól formularzy, tabel, komunikatów. Kolory, odstępy i kroje zapisuje się jako zmienne, tzw. tokeny, a komponenty mają zwykle odpowiedniki w kodzie. Projektant i programista front-endu używają tych samych nazw i tych samych części. Znane publiczne przykłady to Material Design od Google i Carbon od IBM.
- System marki dla zespołu marketingu obsługuje materiały: posty, banery, prezentacje, komunikację wewnętrzną. Składa się z gotowych modułów i szablonów, z których zespół sam składa kolejne materiały. Dla działu marketingu dużego producenta robimy taki system postów i komunikacji wewnętrznej w Figmie. Graficy klienta zarządzają nim sami.
W obu przypadkach decyzję podejmuje się raz, a potem korzysta się z niej przy każdym kolejnym ekranie czy poście.
Co zawiera
- fundamenty: kolory, typografię, siatkę, odstępy i ikony,
- komponenty: przyciski, karty, nagłówki, moduły postów,
- wzorce, czyli gotowe układy, np. formularz kontaktowy albo post z cytatem,
- dokumentację: kiedy czego używać,
- zasady zmian: kto dodaje nowy element i jak trafia on do wszystkich.
Design system a brandbook
Brandbook opisuje, jak marka ma wyglądać i mówić. Design system daje gotowe części, z których trudno zbudować coś niezgodnego z marką. Brandbook się czyta, z design systemu korzysta się w programie.
Nie każda firma go potrzebuje. Przy jednej stronie i kilku postach w miesiącu wystarczy dobra księga i kilka szablonów. Design system zaczyna się opłacać, gdy materiały robi wiele osób w wielu miejscach naraz, np. gdy grupa ma kilka serwisów w różnych krajach. Tak jest w Grupie BEST, gdzie jeden system marki obsługuje serwisy spółek w pięciu krajach.
