Назначение иконки состоит в том, чтобы посредством графики объяснить пользователю, что произойдёт в результате его взаимодействия с элементом интерфейса, обозначенным этой иконкой. Например, если человек кликает по иконке с изображением принтера, то страница должна быть распечатана. Смысл в том, чтобы одной маленькой картинкой заменить несколько длинных предложений с пояснительным текстом. Иконка – это логическое развитие кнопки с текстом. Поэтому идеальная иконка не должна сопровождаться подписью, она должна пониматься безошибочно без дополнительных пояснений.
Заменить текст графикой, не утратив при этом ясность послания, довольно непросто. Текст воспринимается практически буквально, а графика должна быть ещё и интерпретирована. Интерпретация (истолкование) — процесс крайне субъективный, то есть зависящий от субъекта интерпретации. Поэтому задача дизайнера состоит в том, чтобы подобрать такую картинку, которая будет безошибочно интерпретироваться максимально большим количеством пользователей. Для того чтобы избежать ошибочного интерпретирования, нужно помнить о некоторых особенностях иконок. Речь о них пойдёт ниже.
Для того чтобы создать понятную иконку, дизайнер должен подобрать такое изображение, которое будет вызывать у пользователя ассоциации, максимально соответствующие смыслу этого изображения. Лучше всего если это будут прямые ассоциации, как в случае с принтером (принтер → печать). Однако далеко не всегда удаётся подобрать прямые ассоциации.
Например, всё чаще можно увидеть изображение жёсткого диска в качестве иконки для скачивания чего-либо из интернета. С одной стороны ассоциация прямая, так как именно на жёстком диске хранится информация в компьютере. Однако задайте себе вопрос: как много пользователей, работающих в интернете, видят жесткий диск, чтобы безошибочно ассоциировать его с хранением информации? Жёсткий диск находится внутри системного блока, и рядовому пользователю он редко попадается на глаза. Кроме того, эти иконки сильно распространены на Западе, а там люди вообще крайне редко заглядывают внутрь системного блока. Если нужно отремонтировать или увеличить производительность компьютера там пользуются услугами сервисов. Поэтому данная иконка представляется малоэффективной. Возникает вопрос: чем заменить? Практически всё время, в течение которого люди работают на компьютере, они видят перед собой монитор. Именно он у простого пользователя ассоциируется со всем, что касается компьютера, в том числе и с информацией, которую он содержит. Поэтому гораздо логичнее заменить изображение жёсткого диска изображением монитора.
Из приведенного выше примера становится ясно, что основной проблемой, с которой сталкивается дизайнер, создающий иконку, это выбор правильной ассоциации для изображения. Именно точная ассоциация — это 90% эффективности любой иконки.
Если иконка проста, значит, она легче воспринимается пользователем. Кроме того, простые иконки с минимумом графики меньше «весят» и, следовательно, быстрее грузятся, а это существенный плюс для дизайна сайта. По этой причине дизайнеры стремятся максимально упростить изображение. Однако чрезмерное упрощение может привести к тому, что картинка потеряет смысл, и иконка станет попросту бесполезной. Ниже представлен пример хоть и не из области веб-дизайна, но зато очень хорошо иллюстрирующий идею упрощения графического символа. На фотографиях изображены фрагменты мобильных телефонов с кнопками «вызов» и «сброс вызова».
Современные технологии развиваются быстро, многие вещи морально устаревают и выходят из обращения всего за несколько лет. Поэтому использование изображений каких-либо устройств в иконках нежелательно, а существующие иконки с уже устаревшей техникой следует обновить.
Вывод
Исходя из всего вышесказанного, можно сформулировать несколько правил создания качественных иконок для веб-интерфейсов. Во-первых, изображение должно быть основано на чёткой и понятной большинству пользователей ассоциации. Во-вторых, иконка должна быть простой, не теряя при этом смысл. И последнее, следует избегать использование технических средств в изображении, а при невозможности этого, заменять на более современные аналоги. Соблюдая эти нехитрые правила, вы облегчите жизнь многим пользователям всемирной паутины.
http://shelkovnikov.pro
Комментарии (0)