Как правильно разрабатывать иконки
Теперь, когда вы знаете, какие бывают иконки-значки, давайте поговорим о том, как ими правильно пользоваться.
Все изображения должны быть в одном стиле. Например, если используются черно-белые пиктограммы, то они все должны быть одного типа.
Картинка не должна быть слишком сложной. Ее главная задача — быстро и просто донести до человека мысль, а не заставлять его задумываться, что изображение означает.
Много значков на веб-ресурсе портят его, добавляют пестроту.
Если изображение куда-то ведет — помогите посетителю это понять. Например, оно может менять цвет при наведении курсора.
Анимационные изображения привлекают, но утомляют людей. Поэтому их не должно быть много.
Значок не должен восприниматься двусмысленно. Он должен явно указывать на действие или понятие, помогать восприятию.
Где брать иконки
Заказать в дизайн-студии. Создание значков — процесс очень творческий, так как в одну картину нужно уложить ясно и понятно текстовый материал.
Например, один из порталов по страхованию заказал подобную разработку.
Получились очень интересные изображения. Щит на заднем фоне привлекает внимание и указывает на функцию защиты, символы на фоне щитов, выполненные в едином стиле, говорят о сфере (тематике) вышеуказанной защиты (юрлица, ОСАГО, недвижимость, путешествия и т.д.).
Эксклюзивные значки указывают на высокое качество веб-ресурса. Цена на разработку одного изображения зависит от его вида (контур дешевле, чем 3D или анимация). Также смысл картинки имеет значение. Изобразить домик проще, чем выразить понятие “государство”, потому что дизайнер тратит много времени на обдумывание сложной идеограммы и избавления от двусмысленности. Цена на разработку значка составляет от 500-600 руб. в регионах (это минимум на 2018 год). Если у специалиста предполагается большой объем работы, то цену можно обсудить.
2. Сделать самостоятельно.
Предлагаем рассмотреть сервисы, которые позволяют без знаний графических редакторов создавать онлайн подобные значки. Например, Iconsflow, Icons8, Flaticons, Launcher icon generator, Simunity и другие. Кстати, последний способен генерировать html-код для вставки значка на сайт.
Отталкиваясь от готовых контуров или закачивая в сервис или рисуя свои, можно накладывать фон, тень, работать с размером и скачивать готовый результат.
3. Приобрести готовые за плату или скачать бесплатно.
В Сети существует много сервисов, которые предлагают скачать значки, как статические в разных стилях, так и анимированные. Чтобы с ними работать (менять, дополнять), необходимо знание графического редакторами типа Фотошоп или Индизайн. При скачивании вы также можете размещать значки на своем сайте без изменений. Для этого необходимо искать иконки для сайта в формате SVG (векторные), ICO, PNG. Если вы находите AI и PSD — то добро пожаловать в графические редакторы для внесения изменений.
Все такие сервисы работают по одной системе. В поисковой строке необходимо ввести запрос на английском языке (для иностранных сервисов) или на русском (для российских), затем выбрать и скачать либо набор иконок для сайта, либо одну пиктограммку.
Бесплатные зарубежные онлайн-сервисы: Behance, Flaticon, Iconmonstr, Graphicsbay, Pixelsmarket, Graphicsfuel, Fribly, Dryicons, All-free-download, Cssauthor.
И российские: Icons8, Icon-icons, Freepik, Iconbird и др.
Условно-бесплатные: PixelLove (стиль изображений — iOS 7), Pixeden (разные стили, также условно-бесплатно предоставляет изображения на скачивание, тебует ссылку на автора иконок при бесплатном применении), IconFinder (есть варианты векторных значков, часть бесплатно, остальные — за плату), IconSetc (контурные и одноцветные, платно), IconSweets (стиль iOS 7, платно).
Если у веб-проекта или приложения хорошая навигация и приятный дизайн — значит, больше посетителей и скачиваний они будут получать. А для человека, перегруженного информационным шумом, важна каждая мелочь. И именно этой мелочью зачастую являются иконки, которые необходимо правильно применять. Удачи!
Поисковая строка
Поисковая строка - это поле в поисковой системе (ПС) или веб-браузере, позволяющее пользователю ввести запрос, после которого выдается список наиболее соответствующих данному запросу документов.