5 принципов создания иконки мобильного приложения

Успех мобильного приложения складывается из разных факторов: внешний вид, качество, польза, уникальность… И один из основных факторов в этом списке — иконка. Именно она произведёт первое впечатление на пользователя, когда он увидит ваш продукт в магазине — и от того, каким будет это впечатление, зависят его дальнейшие действия: узнать о приложении побольше, или пролистать дальше. В условиях огромной современной конкуренции за внимание пользователя, приложению просто необходимо иметь привлекательную, запоминающуюся и цепляющую взгляд иконку, которая сможет отобразить идею продукта и имидж вашего бренда. Как создать такую иконку? Для этого нужно придерживаться нескольких важных принципов.
  • Лаконичность
  Главное правило качественной иконки приложения — отсутствие визуального беспорядка. Стоит избегать обилия пестрых цветов, большого количества графических элементов и мелких деталей. Цветовая палитра иконки должна соответствовать палитре приложения — лучше всего сочетать не более 2-3 цветов. Также лучше отказаться от использования на иконке анимированных элементов, фотографий или скриншотов. Лучший вариант иконки — однотонный значок с лаконичным логотипом.
  • Наличие узнаваемого элемента
  Чтобы приложение визуально выделялось среди десятков других на странице в аппсторах, на его иконке должен быть четкий узнаваемый элемент, ассоциирующийся только с конкретным продуктом. Например, все сразу узнают значок “М” на иконке Gmail, “птичку” — на Twitter или “бумажный самолетик” — на Telegram. Такой элемент должен отображать суть и цель приложения, придавать ему индивидуальность и сочетаться с фоном иконки. 
  • Минимум надписей 
  Для названия приложения, его описания и ключевых слов для его поиска есть соответствующие графы в аппсторах. А вот на иконку лучше не помещать никаких надписей и слов. С учетом крошечных размеров иконок, надписи будут лишь создавать визуальный беспорядок и выглядеть размыто и нечитабельно. Исключение в данном случае составляют лишь очень короткие надписи — например, буква G и иероглиф на иконке Google Translate, или временные обновления иконок по поводу акций и распродаж — в таком случае на иконку можно нанести надпись вроде “Sale”, но она должна смотреться органично и не перекрывать основной элемент.
  • Соответствующая рамка
  Касательно рамки для обрамления иконки не существует конкретных правил — нужно ориентироваться на конкретный случай. Некоторые иконки хорошо выглядят с четко обрамленными краями, для некоторых подходит тонкое обрамление, а иногда оно и вовсе не нужно. Чтобы понять, какой вариант лучше подходит для вашей иконки, нарисуйте несколько версий — с рамкой и без рамки — и сравните их между собой. Края не должны утяжелять иконку, а их отсутствие не должно делать её размытой. В данном случае большое значение имеет цвет иконки, форма и дизайн. 
  • A/B тестирование 
  При создании иконки дизайнерам часто бывает сложно выбрать наиболее подходящий вариант из двух в разных аспектах. Например, между круглой или квадратной формой, наличием или отсутствием рамки, цветным или прозрачным элементом и т.д. Для решения таких вопросов лучше провести А/В тестирование. Один из вариантов такого тестирования — запуск бета-версии продукта с двумя вариантами иконок для двух равных групп пользователей. Инструменты тестирования помогут собрать данные о том, какой вариант иконки привлек больше внимания и лучше соответствует приложению.