Ikonok

A Spaceship ikonok összetett műveleteket és ötleteket fordítanak le azonnal felismerhető szimbólumokká, megkönnyítve a felhasználók számára a navigációt és az interakciót.

Hero Image

Univerzálisak, mégis jellegzetesek, ikonjaik a márka legkisebb építőelemei, amelyeket az azonnali felismerhetőségre terveztek, miközben egyértelműen megőrzik a Spaceship identitását.



Verziók

Minden Spaceship ikon két verzióban érhető el: körvonalas (elsődleges) és kitöltött (másodlagos).









Felépítés

Az ikonok meghatározott szabályok szerint készülnek — az alapráccsal kezdve a vonalparaméterekig —, így biztosítva az egységes és kiegyensúlyozott eredményt.









Méret

A skálázhatóságot szem előtt tartva tervezett ikonokat öt méretben kell használni, hogy a rendszer egészében megmaradjon az egyértelműség és a vizuális harmónia.









Színek

A szín alapvető elem, amely segít a felhasználóknak könnyebben azonosítani termékeiket egy adott felületen belül. Az egységesség biztosítása érdekében ezekben a UI-környezetekben az ikonok a  Spaceship Design System színeit használják.






Márkaszínek

A Spaceship alapvető színeiként ezek legyenek az ikonok elsődleges választásai — akár funkcionális környezetben, például a platform felhasználói felületén, akár illusztratívabb felhasználásnál, például funkciók megjelenítésénél a termékoldalakon. További részletekért tekintsd meg a színek oldalát.






Termékszínek

Egy termék fő színeit a hozzá tartozó ikonokon kell alkalmazni. Ez kulcsfontosságú a termék felismerhetősége és ismertsége szempontjából a Spaceship ökoszisztémájában.






Értesítési színek

Használd az értesítési színeket a figyelmeztető üzenetek megerősítésére. Ezeket csak a figyelmeztető ikonokra szabad alkalmazni, alkalmankénti kivételekkel, amikor egy másik ikon is sikeres, hibás vagy figyelmeztető állapotot jelöl.







Útmutatás

Íme néhány példa arra, mit érdemes elkerülni az ikonok használatakor.




Ne torzítsd, forgasd el vagy tükrözd az ikonokat. Mindig arányosan méretezd őket.


Ne használj 40x40px-nél nagyobb ikonokat. Törekedj az elemek közötti egyensúlyra.


Ne használj árnyalatokat vagy tónusokat.