Создание иконок, разрушающих языковой барьер

08.12.2016

Иконки нужны, чтобы передать идею, действие или объект за долю секунды. Иконки так хорошо работают в интернете, потому что они идеальны для невербального общения: они разрушают языковой барьер.

Вот почему в музыкальных плеерах есть перемотка назад, вперед, и иконка “play”; вот почему таможенный контроль аэропорта включает иконку c офицером; и почему три линии известны как “гамбургер меню”.

3 простых совета по улучшению иконки приложения

Создание иконок

Создание иконок – это процесс, в котором вид линий, форм и пространства определяет, насколько хорошо покажут себя иконки по отдельности и в составе группы. Линии должны быть одинаковыми по толщине, одинаково соединены (с одинаковыми углами, скруглением и так далее). Когда это возможно, повторяйте одинаковые формы, углы и негативное пространство. Например, если комплект иконок включает скругление всех углов в 4px, сохраните это правило для всех остальных иконок – используете вы Illustrator или Sketch, или выбираете иконки на The Noun Project.

Иконки в коде

SVG и CSS анимации позволяют создавать хорошие иконки для любого сайта, и не мешают работе файлов шрифтов. Вы можете пойти несколькими путями: использовать SVG, чтобы создать динамичные, игривые анимации, или менять цвета через CSS с помощью hover. Самое лучшее в SVG то, что вам не нужно постоянно экспортировать пиксельные картинки для адаптивных сайтов, что улучшит их интерактивность.