Используйте последовательный визуальный язык
Названия значков должны описывать фигуру; Эксплуатационный смысл заключается в контрольной метке.
Значок Система дизайна
Сохраняйте значок узнаваемым и значимым в любом размере.
Содержание чек-листа
Прогресс проверки
01
Структура и значение
Сравните информацию и представление в контексте использования.
02
Взаимодействие и удобство использования
Попробуйте выполнить операцию, измените статус и продолжайте работу.
03
Завершите опыт
Проверьте детали, которые легко упустить при вводе проекта в эксплуатацию.
Прогресс автоматически сохраняется в этом браузере.
РЕКОМЕНДАЦИИ
Как проверять
ПРИМЕРЫ
Примеры использования
Используйте последовательный визуальный язык
Одно и то же «мусорное» изображение помечается как «Удалить черновик» или «Удалить участника» в зависимости от контекста.
Варианты и сценарии использования
Стиль значков
Используйте единую систему контурных или заполненных значков для одной роли на одном экране.
Сравните новый и старый значки одного размера: толщина линий и внутренние отступы должны совпадать.
Пример Кнопки почты, видео и документации используют один набор SVG с линией 1.6px.
Размер и область взаимодействия
Отделяйте размер рисунка от области нажатия: небольшому значку тоже нужна удобная зона касания.
Проверьте значок 16px в мобильной кнопке: пользователь не должен попадать точно в его линии.
Пример Значок 18px расположен по центру области нажатия 44px.
Название по смыслу
Давайте понятное название функции, не заставляя угадывать её смысл по рисунку.
Программа экранного доступа должна читать название действия; декоративные значки не повторяют подпись.
Пример Кнопка с колокольчиком называется «Открыть уведомления», а значок рядом с текстом скрыт из дерева доступности.
Уведомления
Аккаунт
Поиск