Иконки v2
Рекомендуемые иконки (значки) для визуализации разделов и категорий.
Иконки следует использовать целенаправленно, чтобы обеспечить максимальное понимание и снизить когнитивную нагрузку, когда вам нужно привлечь внимание к определенному действию, команде или разделу. Используйте их редко - если вы сомневаетесь в целесообразности использования иконки, скорее всего, ее вообще не нужно использовать.
Как правило, иконки следует использовать в сочетании с осмысленным текстом, чтобы помочь пользователям в доступной манере продвигаться по продукту.
Сочетание незнакомых значков с текстом может запутать пользователей в зависимости от того, как они распознают вспомогательный значок, поэтому убедитесь, что значок и текстовая метка сочетаются друг с другом. Чтобы еще больше повысить удобство использования, убедитесь, что цвет иконки соответствует руководству по доступности веб-контента (WCAG) 2.1 AA стандартный коэффициент цветовой контрастности.
Иконки категорий
Иконки категорий выполнены по сетке 24px с толщиной базовых линий в 1px. Стиль выбран линейный, в виду его универсальности использования на разных фоновых поверхностях. Подобный вид иконок можно стилизовать разными способами, включая различное сочетание цветов и изменение толщины линии от 0.1px до 2px.
Каждая иконка имеет три формата: svg, png и сжатый svg для web. Этот список периодически заполняется, если есть необходимость в других иконках - можно использовать:
- Opensource каталог от iconsvg.xyz.
- Премиум каталог от Myicons: скачать из облака.
В предоставленных выше ресурсах, достаточно отредактировать толщину и цвет линий (белый 1px/1pt), чтобы получить утвержденный стиль.
Корневые разделы
Мобильные устройства
mobile-devices
Смартфон
smartphone
Смарт часы
smart-watch
Ноутбук
laptop
Фотоаппарат
camera
IP камера
ip-camera
Рюкзак
backpack
Микрочип
microchip
Устройства
iPhone
iphone
iPad
ipad
EarPods
earpods
Аксессуары
MicroSD
sd-card
USB
usb
Флеш карта
flash-card
Кабель синхронизации
sync-cable
VR
vr
Компьютерная мышь
pc-mouse
Для ремонта
Инструменты
tools
Плоскогубцы
pliers
Логистика
Упаковочная коробка
package-box
Куб
cube
Вращение
rotate
Инвентарь
inventory
Сфера
sphere
Шрифтовые иконки
Для улучшения воприятия текстовых строк, в цифровом интерфейсе и печатной продукции мы используем шрифтовые иконки от коллекции "Material Design Icons". Подобный формат иконок позволяет не только гармонично улучшить читаемость текстовой строки но и упрощает разметку, то есть не обязательно использовать отдельные слои для иконок в графических редакторах, аналогично и в вебе - достаточно на html тег задать два шрифта (текст и иконки), а затем вставлять иконку как юникод-символ прямо в текст.
Мы выбрали opensource решение, под названием "Material Design Icons", или сокращенно - MDI. Эта коллекция иконок построена на сетке 24px и отлично сочетается с текстом при общем заданном размере шрифта.
Ссылка на проект: materialdesignicons.com.