Иконки (Icons) - это особый случай в мире дизайна. Сложность их построения заключается в их размере и большой функциональности. Иконка должна отражать суть и этой сутью может быть не просто один объект, а целый перечень или свойство или действие. Сегодня Мы рассмотрим 10 принципов, которые помогут Вам сделать отличную иконку.
1. Выделите главную особенность объекта:
Самый важный аспект при построении иконки - это сделать иконку узнаваемой, то есть необходимо изображенный на иконке объект сделать таким, чтобы зритель сразу узнавал его и именно его, ни с чем не перепутав.
Рассмотрим на примере:
Карандаш. Если рассмотреть карандаш, то его уникальность заключается не только в форме. Ведь в небольшом формате карандаш можно перепутать с ручкой или фломастером. Основные черты карандаша – это, прежде всего, его форма. Он шестигранный. Во-вторых, только у карандаша может быть стиральная резинка на конце и жестяное колечко. Ну и конечно треугольная форма его конца, которым пишут. Получается то, что сразу узнается. Любой, кто посмотрит, незамедлительно узнает карандаш.
2. Иконка должна быть простой и универсальной:
Один из основных принципов фрилансера при создании иконки - это ее простота и универсальность. Посмотрите сами: простая иконка подойдет к разным проектам и впишется в их общий дизайн.
3. Стандартизация иконок:
Строя иконку за иконкой не забывайте, что набор иконок должен быть гармоничным, а это значит что освещение, тени, размеры изображения и цвета должны быть в одном стиле. За примером далеко ходить не надо: в Windows 95 освещение на иконки всегда падает с верхнего левого угла и объекты на иконках повернуты против часовой стрелки. Вы замечали это раньше? Не должны были замечать! Потому что это смотрится целостно, и было бы заметно, если иконки были бы разными.
4. Аргумент в пользу векторных изображений для иконок:
Чаще всего в проекте есть необходимость в силу возможности настройки или других факторов иметь несколько различных изображений одной и той же иконки. Тут и получается, что легче всего для этого подходит векторное изображение, которое, не смотря на свой первоначальный размер, не имеет ограничений по увеличению и уменьшению. В любом случае оно не потеряет свое первоначальное качество. К тому же при работе с такой иконкой очень просто поменять ее основные цвета, сделав пару щелчков мыши, в то время как для растрового изображения приходится изменять чуть ли не каждый пиксель.
5. Аргумент в пользу растровых иконок:
Существует обоснованное мнение, что при работе с растровыми иконками мы получаем существенное преимущество. Так как иконки по определению изображения маленького формата, то делая скажем иконку в различных форматах размера мы столкнемся с тем, что при уменьшении/увеличении иконки в векторном формате некоторые детали могут потеряться, или наоборот появятся пятна при уменьшении иконки. Так при увеличении тонкая линия в 1 пиксель может стать толще, чем надо. Поэтому следует выполнить ряд иконок в астре, где каждый пиксель на своем месте.
6. Учитывайте культурные различия:
У каждого объекта, который Вы хотите отразить на иконке могут быть свои различия в разных культурах. Рассмотрим на примере почтового ящика: в каждой стране и местности у него свои размеры, формы и даже цвет. Поэтому стоит использовать универсальные и самые узнаваемые объекты для отражения того или иного пункта. Тот же почтовый ящик будет благоразумно заменить на почтовую марку, которая более узнаваема в разных странах.
7. Используйте оригинальные цвета, и их сочетание:
Суть данного пункта в том, что иконки должны выделяться на общем фоне по двум причинам. Во-первых: в силу своей функциональности, во-вторых: потому что чаще всего фоном у иконки может быть тоже картинка, а следовательно они не должны сливаться. Из это всего вытекает, что иконки должны выделяться и на фоне и общей картинки, а как можно привлечь внимание пользователя, как не оригинальным сочетанием цветов и интересной формой.
8. Иконки как для маленького, так и для большого формата изображения:
Мы уже говорили, что свои особенности при работе с иконками, когда надо представить их в разных форматах, но напомним еще раз, что если Вы хотите сделать качественные иконки, то не забывайте, что у различных пользователей могут быть разные настройки изображения и возможности экрана. Ваша иконка будет выглядеть хорошо только, когда она будет представлена в различных размерах для разных форматов, как для маленьких, так и для крупных. Вспомним опять Windows, только на сей раз Windows Vista. Иконки в этой ОС могут быть размером 256*256 пикселей, при этом они выглядят также приятно для Вашего глаза.
9. Стоит ли делать наброски на бумаге:
Наброски на бумаге нужно делать ОБЯЗАЕТЛЬНО! На первый взгляд разработка маленьких иконок проста, но на самом деле сложность именно в их маленьком размере. Во-первых: Вы можете обмануть самого себя, думая, что Ваша метафора для иконки будет узнаваема и именно в том виде что у Вас в голове, но бумага не обманет и Вы увидите так ли это на самом деле. Тут стоит проработать несколько вариантов того, как может выглядеть иконка. И самое главное в подготовке к работе определить размеры всех элементов. Ведь весьма сложно выделить детали должным образом, когда у вас есть всего лишь 16*16 пикселей.
10. Хорошая метафора:
Самое главное в хорошей иконке - это выделить наилучшую метафору. Иконка может обозначать объект, но чаще она означает действие или свойство. Так это может быть действие "сохранить файл" - иконка в виде дискеты, действие "распечатать" - икокна в виде принтера, свойство цвет текста - заглавная буква "А" и цветовая палитра. Хорошая метафора - залог отличной иконки.
Дизайнеры Macinstruct при подготовке нового проекта задумались, как отразить свойство "сложность урока" в красивой иконке. В мозговом штурме родилось несколько идей: "термометр", который повышал свою температуру в зависимости от сложности, "светофор", мигавший зеленым для не сложных примеров и красным для сложных, пояса карате и другие метафоры. В итоге идею им подсказал один из будущих пользователей, предложивший использовать защитные кармашки с инструментами для отображения сложности. Так как программа несет инженерный характер, то данная метафора подходит как нельзя лучше.
#1Гость сказал:
Познавательно
#2Гость сказал:
Спасибо
#3Гость сказал:
мда.. прикольно про кармашки
Оставить свое мнение