Design System
dla Orange Polska
Styczeń 2023 r. - teraz
Opis projektu
Soller - multiplatformowy Design System. Powstał w odpowiedzi na potrzebę szybkiego projektowania oraz wdrażania projektów, uspójnienia wizualnego portalu i aplikacji Orange, możliwości łatwego zarządzania zmianą warstwy wizualnej oraz chęci odświeżenia wyglądu stron.
Moja rola w zespole
- inicjatywa stworzenia multiplatformowego Design Systemu oraz organizacja zespołu projektowo - deweloperskiego
- tworzenie kluczowych idei i założeń dla nowego Design Systemu
- udział w procesie projektowania koncepcji UI/UX opartych o nowy Design System
- tworzenie tokenów, komponentów oraz szablonów
- współpraca z zespołem deweloperskim w zakresie testowania wdrażanych komponentów oraz tworzenia dokumentacji Design Systemu
- testowanie użyteczności projektów opartych o nowy Design System
- ścisła współpraca z zespołem deweloperskim
Design Tokens
Jednym z głównych założeń było stworzenie design tokenów spójnych pomiędy Figmą i kodem, umożliwiających szybsze tworzenie spójnych wizualnie komponentów oraz, w razie potrzeb szybką zmianę wyglądu komponentów bez ingerecji wnie. Tokeny kolorystyczne zostały przemyślane pod kątem moliwości szybkiego wprowadzenia ciemnego motywu na stronie i w aplikacjach.
Komponenty
Kolejną ważną częścią Design Systemu są komponenty zbudowane na podstawie wcześniej zdefiniowanych tokenów.
Dla każdego komponentu jest tworzona specyfikacja ułatwiająca komunikację z deweloperami oraz prezentująca wszystkie możliwe stany oraz konfiguracje danego komponentu.
Dodatkowo dla każdego komponentu tworzone są scenariusze, będące jednocześnie wytycznymi dla sposobu korzystania z danego komponentu.
Szablony
Z komponentów tworzymy większe struktury - szablony, które umożliwiają nam szybkie tworzenie widoków - np. karty produktu w koszyku.
Szablony są również wykorzystywane do szybkiego tworzenia modali. Prezentują ogólną strukturę widoku, do której możemy wstawić dowolną zawartość.
