Быть самим собой — вот что важно!

Типичный пейзаж южной части Гренландии

Спросите у любого человека, знакомого с английским языком, но не имеющего представления о реальном географическом положении дел на Земле, с чем у него ассоциируется Гренландия. Готов поспорить, что рассказ пойдет о зеленых равнинах, ярком солнце и ветерке, колышущем целые поляны красивых цветов в лесах и на склонах гор. Если сообщить, что эта страна омывается океаном, то многие из опрошенных захотели бы взять легкую одежду и отправиться туда позагорать, а может и оседлать волну, занимаясь серфингом. Следует не забыть рассказать им о том, что Гренландией страну прозвали, скорее всего, в шутку. Единственная зеленая часть Гренландии — это, пожалуй, северное сияние.

Северное сияние в Гренландии. Фото nickrussil

Все дело в том, что мы можем судить о незнакомых объектах, только исходя из проекции накопленного нами опыта на их очевидные для наблюдателя характеристики. Будь названа описанная выше северная страна Вайсландией или даже Исландией (такая, кажется, уже есть), то опрашиваемый нами человек вспомнил бы и красивые белые айсберги, и холодный ветер, а может даже и северное сияние, но он точно не захотел бы заниматься там серфингом или лежать на пляже в одних плавках.

По тем же принципам формируется представление о любом интерфейсе, с которым приходится взаимодействовать пользователю на разных этапах жизни.

В USB-порт, равно как и в любой другой, пользователь будет пытаться вставить соответствующий штеккер, на кнопку нажать, тумблер переключить, а круговую ручку регулирования, например, громкости, крутить. Кстати, эта ручка в моей машине нажимается, что включает или выключает всю аудио-систему. Таким образом, она выполняет еще и роль кнопки, но это, как мне кажется, замечательное решение мы пока опустим.

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

Такое поведение пользователя в отношении элементов интерфейса делает их состоятельными. Не в том смысле, что они богатеют, а в том, что они справляются со своими функциями, и пользователь взаимодействует с ними на ура, понимая как обращаться с тем или иным элементом. Быть состоятельным для любого элемента интерфейса значит быть самим собой, а не каким-то хиппи с расплывчатой функциональностью и любовью ко всему окружающему ;)

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

GUI и реальность

При создании графических элементов GUI приложений следует особенно настороженно относиться к их состоятельности. Со всеми объектами на экране пользователь общается при помощи мыши, клавиатуры или сенсорных технологий. В любом случае, если не обращать внимания на клавиатуру, он может лишь нажимать и отпускать кнопку манипулятора (палец или стилус на экран), двигать курсором (пальцем или стилусом) и отпускать кнопку (поднимать палец или стилус от экрана). Все элементы интерфейса находятся на двухмерном экране, и совсем не очевидно, что каждый из них представляет.

В ежедневной работе пользователь сталкивается с надписями, меню, кнопками, пиктограммами (иконками) и другими элементами интерфейса.

Кнопки и иконки

Попадая в удивительный мир Windows или Mac OS X (мир всяких Убунт настолько удивителен, что подразумевается по-умолчанию), пользователь, если ему дорога его информация, первым делом осознает, что файлы обозначаются иконками. Будем считать, что пользователь знает, что такое файлы и директории, которые он привык называть папками. Итак, для обозначения файлов есть иконки, для взаимодействия с ними есть всякие магические движения курсором с нажатой и ненажатой кнопкой мыши, а вот для вызова действия или его подтверждения есть кнопки. Кнопки отличаются от иконок прежде всего тем, что зачастую выглядят объемными.

Несмотря на то, что в разных операционных системах и даже программах кнопки выглядят по-разному, пользователь без труда идентифицирует любую из них как элемент, который можно нажать

При нажатии на кнопку она визуально нажимается, а иконка — выделяется.

Нажатая кнопка и выделенная иконка

Мало того, кнопка может находиться только внутри окна, она никак не может болтаться посреди документа или на рабочем столе. Речь идет о добропорядочной кнопке, разумеется. При этом она всегда остается кнопкой, независимо от своего положения. Максимум на что она способна — стать неактивной. Иконка же меняет свою функциональность в зависимости от того, где она находится. Способ взаимодейтвия с пиктограммами так же зависит от того, что они олицетворяют.

Иконки приложений Adobe CS3 в файловом менеджере Finder

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

Те же иконки в доке (Dock) Mac OS X. Dock — аналог панели задач Windows

При использовании пиктограммы в информационных целях щелкать по ней бесполезно — она просто дает нам лучше понять, что за программа копируется.

Иконки приложений Adobe CS3 используются для большей наглядности процесса копирования

Если же пиктограммы затесались в панель инструментов, значит их тоже можно нажать один раз. Не будем вдаваться в подробности почему пиктограммы имеют право находиться в панелях инструментов в Mac OS X на тех же правах, что и кнопки. Это тема отдельного поста.

Потеснив кнопки, пиктограммы расположились в панели инструментов

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

С появлением Windows 98 родились так называемые flat buttons. Они позволяли прятать границы кнопки до тех пор, пока пользователь не наведет на нее курсор. Отображалась лишь пиктограмма или подпись, или они вместе. При нажатии кнопка нажималась как обычно, но стоило убрать курсор, как она вновь становилась пиктограммой, подписью или их союзом. Если я не ошибаюсь, то эти кнопки сумели дожить до Windows Vista, но теперь обозначают практически все-на-свете-что-тут-можно-нажать-дружище.

Эволюционировав визуально, flat buttons все равно остаются пиктограммой пока на них не наведешь курсор

На заре общения с компьютером и Windows 2000 моя мама не могла приноровиться к тому сколько раз кликать по кнопке в панели задач, сколько раз на строку в меню быстрого запуска и сколько раз на иконку. Я уверен, что смутили ее именно flat buttons в броузере, которые сводили на нет все мои рассказы о кнопках и иконках ;)

У каждой задачи образ особый

Благодаря навыкам и тому, как показаны элементы интерфейса, мы понимаем что с ними делать. В поля ввода надо вводить текст, из выпадающего или обычного списка выбирать одну из опций, а интерактивного подсказчика в Word’е — отключать. Наращивая навыки работы с ОС или приложением, пользователь начинает замечать и считать значимыми больше деталей, чем вначале. Это относится и к закруглениям углов поисковых полей, и к подчеркиванию ссылок на сайтах, а сейчас уже и в PDF’ах, и в электронных книгах, и вообще везде, где встречается гипер-текст.

Несколько способов спросить одно и то же. Несмотря на разный внешний вид, каждый элемент состоятелен. Список опций и выпадающий список избыточны для этой настройки, но все равно понятны пользователю

Даже если внезапно появилась идея модифицировать привычный вид какого-либо элемента управления, надо сразу оценить, насколько новый образ будет состоятельным. Не вызовет ли он у пользователя замешательства, и не понадобится ли тому переучиваться или тратить время на обдумывание дальнейших действий. Несмотря ни на что, элемент интерфейса должен оставаться самим собой и всем видом подкреплять свою функциональность, в противном случае он просто станет невидимым — пропадет из информационного поля пользователя. Как минимум это помешает посетителю заказать товар, а как максимум — посадить космический корабль на Марс или предотвратить взрыв атомной бомбы.

Возвращаясь к заголовку поста: для элемента любого интерфейса важно быть самим собой и ни в коем случае не походить на кого-то из соседней деревни, а то будет скандал ;)