Пиктограми
Малки, прости графични елементи, които подобряват основните уеб компоненти и предават идеи бързо и ефективно.
Буквални, функционални и геометрични — нашите пиктограми свеждат идеите до най-чистата им форма, предавайки ясна цел и непреходна простота.
Тип
Пиктограмите на Spaceship се предлагат в два типа: regular и comp. Типът comp комбинира обикновена пиктограма с икона от Iconography Library на Spaceship, което ни позволява да предаваме по-сложни и специфични концепции.
Версии
Всички пиктограми на Spaceship са налични в две версии: filled (основна) и outlined (вторична). Контурната версия трябва да се използва само когато е необходимо пиктограмата да има по-малка визуална тежест от близките пиктограми, текст или UI компоненти. Това помага за установяване на визуална йерархия в сложни оформления.
Конструкция
Пиктограмите се основават на набор от правила — от базова мрежа до параметри за градиент и контур — за да се гарантират последователни и балансирани резултати.
Размер
Пиктограмите на Spaceship са проектирани да бъдат мащабируеми, като запазват визуална последователност и осигуряват възможно най-добра четливост. В нашата дизайн система има пет размера пиктограми.
Цветове
Пиктограмите обикновено използват един-единствен цвят. Единственото изключение е типът comp, който може да включва брандови или цветове за известия, за които ще намерите повече информация по-долу. За да се гарантира последователност в UI контекстите, пиктограмите следват цветовите референции на Spaceship Design System.
Цвят по подразбиране
Сивото е цветът по подразбиране за пиктограмите и трябва да се използва за представяне на съобщения, действия или функции. В изключителни случаи може да се използва и за продукти. Контурните пиктограми са налични само в цвета по подразбиране.
Брандови цветове
SPS Blue, SPS Dark Gray или бяло също могат да се използват вместо цвета по подразбиране, когато е необходимо по-силно визуално въздействие или за да се подсили идентичността на Spaceship. Вижте страницата за цветовете за допълнителни подробности.
Цветове на продуктите
Основният цвят на продукта трябва да се използва за пиктограми в контексти, посветени на продукта (продуктови страници, продуктови карти и т.н.), за всички настоящи и предстоящи продукти.
Цветове за известия
Тези цветове трябва да се използват за подсилване на съобщение за известие. Версията comp трябва да се използва само в общи системни съобщения, а не в предупредителни състояния.
Насоки
Ето няколко примера какво да избягвате при създаването и използването на пиктограми.
Не допускайте ключови елементи на обикновената пиктограма да попадат в долния десен ъгъл.
Не използвайте сложни или многоцветни градиенти в запълнените версии.
Не смесвайте запълнени и контурни елементи в типа comp.
Не използвайте други цветове в запълнените версии освен посочените по-горе.
Не използвайте никакъв друг цвят в контурните версии освен цвета по подразбиране.
Не комбинирайте цвета по подразбиране с какъвто и да е цвят, различен от основния брандов цвят на Spaceship и цветовете за известия.