Заливка или обводка?

Какой из этих стилей лучше подходит для пользователей? Бытует мнение, что разница между ними — просто вопрос предпочтений. Однако исследования показывают, что дело не только в этом — один стиль распознается быстрее, чем другой.

Характерные подсказки

Рассмотрим два примера:
— замочная скважина, без которой иконку замка легко принять за сумку;
— зубцы, без которых шестеренка стала бы похожа на пончик.

Именно на такие характерные черты пользователи полагаются при распознавании значков. Поэтому лишний раз убедитесь, что ваши иконки включают все характерные подсказки для их идентификации. В случае сомнений добавьте дополнительные.

Контурные иконки

Если в иконке характерные подсказки находятся по краям, то у вас есть два возможных способа сделать ее быстро считываемой:
— перевести иконку в контур;
— сделать подсказку более выраженной.

В случае с контурными иконками важно, чтобы очертания значков не оказались слишком близки друг к другу.

Залитые иконки

Все люди воспринимают объекты как силуэты, именно поэтому залитые иконки распознаются быстрее.

Подводим итоги

Обычная практика — использование залитой иконки для выделения активной кнопки на панели меню, в то время как другие кнопки остаются в форме контура. Но этот принцип уже безнадежно устарел — должно быть ровно наоборот.

Пользователям необходима более высокая скорость распознавания тех пунктов меню, которые они еще не обнаружили, а не той части, которую уже выбрали. Если следовать этой логике, то залитая иконка должна быть для неактивных кнопок, контурная — для активных.

Chulakov Design