Piktogramy
Malé, jednoduché grafické prvky, které vylepšují klíčové webové komponenty a rychle a efektivně sdělují myšlenky.
Doslovné, funkční a geometrické — naše piktogramy destilují myšlenky do jejich nejčistší podoby, vyjadřují jasný účel a nadčasovou jednoduchost.
Typ
Piktogramy Spaceship jsou ve dvou typech: regular a comp. Typ comp kombinuje běžný piktogram s ikonou z knihovny Spaceship Iconography, což nám umožňuje vyjádřit složitější a konkrétnější koncepty.
Verze
Všechny piktogramy Spaceship jsou dostupné ve dvou verzích: vyplněné (primární) a obrysové (sekundární). Obrysová verze by měla být použita pouze tehdy, když piktogram potřebuje menší vizuální váhu než okolní piktogramy, text nebo komponenty rozhraní. To pomáhá vytvořit vizuální hierarchii ve složitých rozvrženích.
Konstrukce
Piktogramy jsou založeny na souboru pravidel, od základní mřížky po parametry přechodu a tahu, aby byly výsledky konzistentní a vyvážené.
Velikost
Piktogramy Spaceship jsou navrženy tak, aby byly škálovatelné, zachovávaly vizuální konzistenci a zajišťovaly nejlepší čitelnost. V našem designovém systému je pět velikostí piktogramů.
Barvy
Piktogramy obecně používají jeden odstín. Jedinou výjimkou je typ comp, který může obsahovat značkové nebo notifikační barvy, o kterých najdete více informací níže. Pro zajištění konzistence v uživatelském rozhraní piktogramy vycházejí z barevných referencí Spaceship Design Systemu.
Výchozí barva
Šedá je výchozí barvou pro piktogramy a měla by být použita k reprezentaci zpráv, akcí nebo funkcí. Ve výjimečných případech může být použita i pro produkty. Obrysové piktogramy jsou dostupné pouze ve výchozí barvě.
Značkové barvy
SPS Blue, SPS Dark Gray nebo bílá mohou být také použity místo výchozí barvy, pokud je potřeba větší vizuální dopad nebo pro posílení identity Spaceship. Další podrobnosti najdete na stránce s barvami.
Produktové barvy
Hlavní produktová barva by měla být použita pro piktogramy v kontextech věnovaných produktům (produktové stránky, produktové karty atd.) pro všechny současné i budoucí produkty.
Notifikační barvy
Tyto barvy by měly být použity k posílení notifikační zprávy. Verze comp by měla být použita pouze v obecných systémových zprávách a ne ve varovných stavech.
Pokyny
Zde je několik příkladů toho, čemu se vyhnout při vytváření a používání piktogramů.
Nedovolte, aby klíčové prvky běžného piktogramu zasahovaly do pravého dolního rohu.
Nepoužívejte složité nebo vícebarevné přechody ve vyplněných verzích.
Nemíchejte vyplněné a obrysové prvky v typu comp.
Nepoužívejte jiné barvy ve vyplněných verzích než ty, které jsou uvedeny výše.
Nepoužívejte žádnou barvu na obrysových verzích kromě výchozí barvy.
Nekombinujte výchozí barvu s žádnou jinou barvou kromě hlavní značkové Spaceship a notifikačních barev.