AuraPura - design system
- UX / UI Design
- Design system
- E-commerse
Project overview
Wstęp
AuraPura to projekt stworzony w ramach kursu Design system intro. Punktem wyjścia był brief marki, zapis wywiadu z klientem i zestaw assetów. Na tej podstawie miałam samodzielnie zbudować kompletny design system i doprowadzić go do finalnych widoków na trzech wielkościach ekranu.
Cel
Przejście przez cały proces tworzenia design systemu od podstaw. Od zdefiniowania tokenów (kolory, typografia, spacing) przez budowę komponentów, aż po ich zastosowanie w konkretnych layoutach. Projekt miał być podsumowaniem i praktycznym wykorzystaniem wiedzy z kursu.
Proces
Pracę zaczęłam od analizy briefu i assetów marki, z których wyciągnęłam paletę kolorów, styl typografii i ogólny kierunek wizualny. Następnie zbudowałam system od fundamentów, opierając go na podziale między core tokenami (surowe wartości, np. konkretne odcienie kolorów) a alias tokenami (znaczenie w kontekście interfejsu, np. background-primary, text-error). Ten podział pozwala zmieniać wartości na poziomie core, nie ruszając logiki komponentów, które odwołują się tylko do aliasów. Na tokenach zbudowałam komponenty wielokrotnego użytku.
Kluczowym elementem projektu było wykorzystanie Figma variables w dwóch rolach:
- Do obsługi themingu (np. warianty kolorystyczne),
- Do dostosowania komponentów do różnych breakpointów.
Dzięki temu komponenty automatycznie adaptowały się do widoku mobile, tablet i desktop bez konieczności tworzenia osobnych wersji.
Czego się nauczyłam?
Przede wszystkim tego, jak dużo pracy kryje się za „prostym" design systemem. Samodzielne przejście przez cały proces, od tokenów do gotowych ekranów, uświadomiło mi, jak ważna jest spójność na każdym poziomie i jak decyzje podjęte na etapie tokenów wpływają na wszystko powyżej. Cały projekt pozwolił mi lepiej zrozumieć podstawy budowania systemów projektowych i ich wartość dla całego zespołu.
Praktyczne zastosowanie Figma variables do zarządzania zarówno motywem, jak i responsywnością komponentów, było dla mnie najcenniejszą lekcją. To podejście pozwala budować systemy, które skalują się bez chaosu, a ewentualne zmiany mozna wprowadzać globalnie bez potrzeby kontrolowania poszczególnych komponentów.
