Введение
Идеограмма, используемая в вычислительной технике
В вычислительной технике иконка — это пиктограмма или идеограмма, отображаемая на экране компьютера для помощи пользователю в навигации по компьютерной системе. Сама иконка представляет собой быстро воспринимаемый символ программного инструмента, функции или файла данных, доступного в системе, и больше похожа на дорожный знак, чем на детальную иллюстрацию реального объекта, который она обозначает. Она может служить электронной гиперссылкой или ярлыком для доступа к программе или данным. Пользователь может активировать иконку с помощью мыши, курсора, пальца или голосовых команд. Расположение иконок на экране, в том числе относительно друг друга, может предоставлять пользователю дополнительную информацию об их назначении.
Иконки наложения
В некоторых системах графического интерфейса пользователя (например, Windows) на иконке, представляющей объект (например, файл), определённая дополнительная подсистема может добавить небольшую вторичную иконку, наложенную на основную и обычно расположенную в одном из её углов, для индикации статуса объекта, представленного основной иконкой. Например, подсистема блокировки файлов может добавить иконку-накладку в виде "замка" на иконку файла, чтобы указать, что файл заблокирован.
Размещение и расстояние
Для отображения количества значков, отражающих растущую сложность функционала, предлагаемого устройством, различные системы разработали различные решения для управления экранным пространством. На компьютерном мониторе по-прежнему отображаются основные значки на главной странице или рабочем столе, обеспечивая пользователю легкий и быстрый доступ к наиболее часто используемым функциям. Это экранное пространство также предоставляет пользователю возможность почти мгновенной настройки, позволяя добавлять любимые значки на экран и группировать связанные значки вместе. Вторичные значки системных программ также отображаются на панели задач или в системном доке. В отличие от основных значков, эти вторичные значки не являются ссылками, а используются для индикации доступности инструмента или файла в системе. Методы управления пространством играют более важную роль на мобильных устройствах с их значительно меньшей площадью экрана. В ответ на это мобильные устройства внедрили, среди прочего, прокручиваемые экраны и выбираемые вкладки, отображающие группы связанных значков. Даже с развитием этих систем отображения, сами значки остаются относительно неизменными как по внешнему виду, так и по функциональности. Прежде всего, значок должен оставаться четко идентифицируемым на экране независимо от его положения и размера. Программы могут отображать свой значок не только в виде гиперссылки на рабочем столе, но и в строке заголовка программы, в меню "Пуск", в системном трее Microsoft или в Dock Apple. Во всех этих случаях основная цель – идентифицировать и представить программу и доступные функции. Эта потребность в узнаваемости, в свою очередь, накладывает определенные ограничения на дизайн эффективных компьютерных значков.
Дизайн
Для поддержания единообразия внешнего вида устройства производители операционных систем предоставляют подробные рекомендации по разработке и использованию значков в своих системах. Это относится как к стандартным системным значкам, так и к значкам сторонних приложений, предназначенным для включения в систему. Действующие системные значки, как правило, прошли широкое международное тестирование на предмет узнаваемости и понятности. Факторы, влияющие на дизайн значков, также были предметом масштабных исследований в области юзабилити. Сам процесс разработки требует высокого мастерства в сочетании привлекательного графического оформления с необходимыми функциями удобства использования.
Форма
Иконка должна быть четкой и легко узнаваемой, способной отображаться на мониторах различных размеров и разрешений. Ее форма должна быть простой, с четкими линиями, без излишней детализации в дизайне. Вместе с другими элементами дизайна, форма также должна обеспечивать ее уникальность на экране и четкое отличие от других иконок.
Цвет
Иконка должна быть достаточно яркой, чтобы её было легко заметить на экране, и хорошо контрастировать с любым фоном. В связи с растущими возможностями настройки рабочего стола, важно, чтобы сама иконка отображалась в стандартном цвете, который нельзя изменить, сохраняя свой узнаваемый внешний вид для быстрой идентификации пользователем. Цвет также должен служить визуальным индикатором состояния иконки: активного, доступного или недоступного ("затемненного").
Размер и масштабируемость
Стандартный значок обычно имеет размер, сопоставимый с размером большого пальца взрослого человека, что обеспечивает как легкое визуальное распознавание, так и удобство использования на сенсорных экранах. Для каждого устройства размер дисплея напрямую зависит от площади экрана и его разрешения. Поскольку значки используются в различных частях экрана, их дизайн должен оставаться узнаваемым даже в минимальном размере, например, в древовидной структуре или панели заголовка, при этом сохраняя привлекательный вид в больших размерах. Помимо масштабирования, может потребоваться удаление мелких деталей или упрощение изображения при переходе между разными размерами. Значки большего размера также служат элементом специальных возможностей для людей с нарушениями зрения во многих компьютерных системах. Ширина и высота значка обычно одинаковы (соотношение сторон 1:1) в большинстве областей традиционного использования.
Предложение
Иконки также могут быть дополнены иконографическим движением – геометрическими манипуляциями, применяемыми к графическому элементу во времени, например, масштабированием, вращением или другой деформацией. Примером может служить покачивание иконок приложений в iOS, сигнализирующее пользователю о возможности их перемещения перетаскиванием. Это отличается от иконки с анимированной графикой, такой как индикатор загрузки (Throbber). В отличие от статических иконок и иконок с анимированной графикой, кинетическое поведение не изменяет визуальное содержимое элемента (в то время как затемнения, размытия, тонировки и добавление новых графических элементов, например, бейджей, изменяют исключительно пиксели иконки). Иными словами, пиксели в иконке могут быть перемещены, повернуты, растянуты и т.д., но не изменены или добавлены. Исследования показали, что иконографическое движение может служить мощным и надежным визуальным сигналом – критически важным свойством для иконок.
Локализация
В своей основной функции как символического образа, дизайн иконки в идеале должен быть независим от какого-либо конкретного языка. Для продуктов, предназначенных для международного рынка, ключевым требованием к дизайну является невербальность иконки; локализация текста в иконках обходится дорого и требует много времени.
Культурный контекст
Помимо текста, существуют и другие элементы дизайна, интерпретация которых может зависеть от культурного контекста. К ним относятся цвет, числа, символы, части тела и жесты руками. Каждый из этих элементов необходимо оценивать с точки зрения его значения и уместности для всех целевых рынков продукта.
Связанные визуальные инструменты
Другие графические элементы, используемые в пользовательском интерфейсе компьютера, выполняют функции графического пользовательского интерфейса в системе, схожие с функциями компьютерных значков, описанных выше. Однако каждый из этих связанных графических элементов в чём-то отличается от стандартного компьютерного значка.
Окна
Графические окна на экране компьютера разделяют некоторые визуальные и функциональные характеристики компьютерной иконки. Окна могут быть свернуты до формата иконки, чтобы служить гиперссылкой на само окно. На экране могут быть открыты несколько окон, которые могут даже перекрываться. Однако, в то время как иконка предоставляет одну кнопку для запуска определенной функции, основная функция окна – это рабочее пространство, которое можно свернуть в иконку-гиперссылку, когда оно не используется.
Контрольные виджеты
Со временем появились определенные виджеты графического интерфейса, которые оказались полезными во многих ситуациях. Это графические элементы управления, используемые в различных компьютерных системах, и пользователь может интуитивно с ними взаимодействовать даже в незнакомом контексте, поскольку он узнает их по опыту использования в более привычной среде. Примеры таких элементов управления – полосы прокрутки, ползунки, списки и кнопки, которые широко используются в различных программах. С помощью этих виджетов пользователь может определять и изменять данные и отображение в программном обеспечении, с которым он работает. Первоначальный набор компьютерных виджетов был разработан для Xerox Alto. В настоящее время они обычно поставляются в составе наборов инструментов виджетов и распространяются как часть пакета разработки. Эти элементы управления являются стандартизированными пиктограммами графического интерфейса, предлагающими расширенный набор пользовательских функций по сравнению с функцией гиперссылки компьютерных значков.
Эмотики
Другой графический значок иллюстрируется смайликом – пиктограммой, встроенной в текстовое сообщение. Смайлики, и, шире, другие эмотиконы, используются в компьютерном тексте для передачи информации в невербальной, лаконичной форме, часто отражающей эмоциональный контекст сообщения. Эти значки впервые появились в компьютерах в 1980-х годах как реакция на ограниченные объемы памяти и пропускную способность каналов связи, используемые в электронных сообщениях. С тех пор они стали многочисленными и более сложными в плане клавиатурного представления различных эмоций. Они эволюционировали от комбинаций символов клавиатуры до полноценных значков. Они широко используются во всех формах электронного общения, всегда с целью добавления контекста к текстовому содержанию сообщения. Добавляя эмоциональную окраску тексту, они также позволили электронным сообщениям заменять и часто вытеснять голосовую связь. Эти эмотиконы существенно отличаются от иконок-гиперссылок, описанных выше. Они не служат ссылками и не являются частью системной функциональности или компьютерного программного обеспечения. Вместо этого они являются частью языка общения пользователей между различными системами. В отношении этих компьютерных значков, настройка и модификация не только возможны, но и ожидаются от пользователя.
Гиперссылки
Текстовая гиперссылка выполняет практически ту же функцию, что и функциональный значок компьютера: она предоставляет прямой доступ к определенной функции или данным, доступным в системе. Хотя их можно настроить, текстовые гиперссылки обычно имеют стандартизированный и легко узнаваемый формат – синий текст с подчеркиванием. Гиперссылки отличаются от функциональных значков компьютера тем, что обычно встраиваются в текст, в то время как значки отображаются как отдельные элементы на экране. Они также отображаются в тексте, либо в виде самой ссылки, либо в виде удобного названия, тогда как значки по определению являются преимущественно нетекстовыми.
Создание икон
Из-за требований к дизайну, создание иконок может быть длительным и затратным процессом. В Интернете представлено огромное количество инструментов для создания иконок – от профессиональных пакетов до утилит, поставляемых вместе с программами для разработки, и отдельных бесплатных программ. При такой широкой доступности инструментов и наборов иконок, возникает проблема с пользовательскими иконками, стиль которых не соответствует другим иконкам в системе.
Инструменты
Иконки претерпели изменения во внешнем виде, эволюционировав от раннего 8-битного пиксельного арта, использовавшегося до 2000 года, до более фотореалистичного вида с эффектами, такими как смягчение, повышение резкости, улучшение границ, глянцевый или стеклянный вид, а также тени, отрисовываемые с использованием альфа-канала. Редакторы иконок, применявшиеся на этих ранних платформах, обычно включали в себя примитивный растровый графический редактор, способный изменять изображения иконок пиксель за пикселем с помощью простых инструментов рисования или применяя простые фильтры. Профессиональные дизайнеры иконок редко вносят изменения непосредственно в редакторе иконок, предпочитая использовать более продвинутые приложения для рисования или 3D-моделирования. Основная функция редактора иконок – генерация иконок из изображений. Редактор иконок изменяет разрешение исходного изображения и глубину цвета в соответствии с требованиями для иконки. Другие функции редакторов иконок включают извлечение иконок из исполняемых файлов (exe, dll), создание библиотек иконок или сохранение отдельных изображений иконок. Все редакторы иконок позволяют создавать иконки для системных файлов (папки, текстовые файлы и т.д.) и для веб-страниц. Они имеют расширение ICO для Windows и веб-страниц или ICNS для Macintosh. Если редактор также поддерживает создание курсоров, изображение можно сохранить с расширением CUR или ANI для Windows и Macintosh. Использование новой иконки – это просто перемещение изображения в соответствующую папку и выбор иконки с помощью системных инструментов. В Windows XP можно было перейти в "Мой компьютер", открыть "Сервис" в окне проводника, выбрать "Параметры папок", затем "Типы файлов", выбрать тип файла, нажать "Дополнительно" и выбрать иконку, которая будет ассоциироваться с этим типом файла. Разработчики также используют редакторы иконок для создания иконок для конкретных программных файлов. Назначение иконки вновь созданной программе обычно выполняется в интегрированной среде разработки (IDE), используемой для разработки этой программы. Однако, если приложение создается с использованием Windows API, можно просто добавить строку в скрипт ресурсов программы перед компиляцией. Многие редакторы иконок могут копировать уникальную иконку из файла программы для редактирования. Лишь немногие могут присвоить иконку файлу программы – задача значительно более сложная. Простые редакторы иконок и конвертеры изображений в иконки также доступны онлайн в виде веб-приложений.