Hierarchie
Spaceship Design System je postaven ve vrstvách, z nichž každá přidává jasnost, strukturu a účel. Tyto vrstvy tvoří hierarchii, která určuje, jak navrhujeme, vytváříme a škálujeme produkty — od nejmenšího vizuálního rozhodnutí až po nejširší uživatelskou cestu.
Dodržováním principů Atomic Design jsme naše hlavní zdroje strukturovali do následujících kategorií, což je činí snadněji použitelnými pro všechny týmy.
Základy
Definují základní pravidla našeho vizuálního jazyka — barvy, písmo, rozestupy, mřížky, pohyb a tokeny. Poskytují nám konzistentní základ, ze kterého vycházíme.
Komponenty
Oživují základní pravidla ve znovupoužitelných prvcích rozhraní, které řeší každodenní designové problémy.
Šablony
Ukazují, jak komponenty a vzory spolupracují v kontextu a poskytují připravené struktury pro celé stránky a zážitky.
Vzory
Zachycují osvědčená řešení a osvědčené postupy, díky nimž je naše práce konzistentní, přístupná a zaměřená na uživatele v každém kontaktu.
Základy
Základní atomy Spaceship Design Systemu. Definují vizuální a strukturální pravidla, na kterých je postavena každá komponenta a vzor.
Barva
Definuje značkové a funkční palety, které zajišťují harmonii, přístupnost a flexibilitu napříč produkty.
Typografie
Stanovuje hierarchii a přehlednost pomocí typografické škály, která usnadňuje čtení a orientaci v obsahu.
Rozestupy
Poskytují systematickou škálu pro okraje, vnitřní odsazení a rytmus rozvržení, aby rozhraní zůstala konzistentní.
Mřížky
Vytvářejí responzivní rozvržení, která se přizpůsobují různým zařízením a zároveň zachovávají strukturu a zarovnání.
Pohyb
Využívá přechody a animace k upoutání pozornosti, sdělení stavu a zajištění přirozeného pocitu z interakcí.
Designové tokeny
Převádějí základní hodnoty do kódu a slouží jako jediný zdroj pravdy, který umožňuje rychlé a snadné aktualizace.
Jasné základy znamenají méně překážek, větší inkluzivitu a více času věnovaného řešení skutečných problémů místo začínání od nuly.
Komponenty
Toto jsou znovupoužitelné prvky Spaceship Design Systemu. Každý řeší konkrétní problém rozhraní — od tlačítek a vstupů po navigaci a zpětnou vazbu. Každá komponenta je přístupná, responzivní a snadno přizpůsobitelná různým kontextům nebo zařízením.
Znovupoužitelné komponenty zajišťují, že každý produkt, který vytváříme, je rychleji dodán a působí jako součást většího celku.
Šablony
Šablony jsou mostem mezi stavebními bloky a uživatelskou zkušeností. Kombinují základy a komponenty do celostránkových kontextů a ukazují, jak systém funguje v praxi.
Šablony produktových stránek
Struktury stránek na vysoké úrovni pro vstupní a produktové stránky, kde designéři převážně aktualizují obsah a upravují moduly podle konkrétního kontextu.
Sdílené komponenty
Složitější, znovupoužitelné struktury, jako jsou srovnávací tabulky nebo cenové karty, jsou navrženy tak, aby konzistentně řešily specifické scénáře napříč produkty.
Díky připraveným strukturám mohou týmy věnovat méně času rozhodování o rozvržení a více se zaměřit na skutečné potřeby uživatelů.
Vzory
Vzory zachycují poznatky z testování, zpětné vazby a reálného použití a mění je ve znovupoužitelné, standardizované řešení. Každý vzor vychází ze záměru uživatele, ať už jde o zjednodušení procesu platby, řešení chyb nebo vedení uživatelů formuláři.
Definováním osvědčených řešení dávají vzory naší práci smysl a zajišťují, že každá zkušenost je nejen funkční, ale i promyšleně navržená.