Основные принципы проектирования интерфейсов

Следующие принципы являются фундаментальными при разработке и реализации эффективных интерфейсов, как для традиционных графических, так и для Web-интерфейсов. В последнее время многие Web-приложения отражают недостаток понимания многих из этих принципов. Из-за того, что приложение появляется в Интернете, принципы не меняются. Более того, применение этих принципов становится еще более важным.

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

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

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

Предположение

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

Автономность

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

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

- Делайте информацию о статусе актуальной и легкодоступной. Пользователи не должны искать информацию о статусе. Они должны иметь возможность, одним взглядом окинув свою рабочую среду, получить хотя бы приближенное понятие о ходе работы и состоянии системы. Информация о статусе может быть, например, такой: иконка папки "Входящие" может иметь три состояния - пустая, наполненная и забитая. Однако здесь нельзя переусердствовать. Иконка "мусорной корзины" на Макинтоше долгие годы изображала неминуемую опасность взрыва, когда хотя бы один документ находился внутри, так что люди старались очищать корзину сразу же после каждого документа. Это не только превратило одношаговую операцию в двухшаговую (перетащить в корзину, очистить корзину), но и лишило смысла саму идею мусорной корзины - возможность отмены удаления.

Целостность

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

1) Интерпретация поведения пользователя;

2) Невидимые структуры;

3) Небольшие видимые структуры;

4) Общий вид приложения - экран-заставка, элементы дизайна;

5) Набор продуктов;

6) Целостность продуктов в фирме;

7) Платформенная целостность.

"Невидимые структуры" - относится, например, к таким объектам, как маленькая правая граница в MS Word, которая имеет много свойств, если вы только обнаружите ее. Она может быть или не быть в Вашей версии Word. И если ее нет, вы никогда точно не будете знать, есть она или просто невидима. Вот что действительно неправильно в невидимых объектах, вот почему так важна целостность. Другие объекты видимы, но на самом деле не кажутся элементами управления, так что пользователи могут никогда и не обнаружить их манипулируемость. Секрет, если Вы действительно настаиваете на его существовании, должен быть четким и ясным, например "вы можете щелкать и перемещать края окна Макинтоша для изменения его размеров", но не "вы можете щелкать мышью и перемещать разные иногда некоторые объекты, но другие в другом случае не можете".

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

Очень важно не соблюдать визуальную целостность, когда действия различны, и соблюдать ее, когда действия одинаковы. Избегайте однообразия. Пускай объекты соответствуют своему поведению. Пусть объекты, которые действуют по-разному, выглядят по-разному.

Самая важная целостность - это совместимость с ожиданиями пользователя. Единственный путь установить предпочтения пользователя - это тестирование, и никакой анализ или рассуждение его не заменит.

Умолчания

- Не используйте слов "по-умолчанию" в приложениях. Замените их на "Стандартный", "Использовать Принятые Установки", "Восстановить начальные установки" или другие более конкретные термины, описывающие то, что действительно произойдет.

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

- Установки по умолчанию должны быть "интеллектуальными".

Эффективность работы пользователя

- Стремитесь к производительности пользователя, а не компьютера. Человеческое время стоит гораздо больше, чем машинное, и хотя может показаться, что увеличение производительности машины должно привести к увеличению производительности человека, часто происходит наоборот.

Например, что займет меньше времени - нагрев воды в микроволновке в течение 1 минуты и 10 секунд или в течение 1 минуты и 11 секунд? С точки зрения микроволновки, 1 минута и 10 секунд - единственно верный ответ. Однако с точки зрения пользователя этой микроволновки 1 минута и 11 секунд быстрее. Почему? Потому что в первом случае пользователь должен нажать кнопку "1" дважды, затем найти взглядом кнопку "0", переместить палец на нее, и нажать ее один раз. Во втором случае пользователь просто жмет одну и ту же кнопку - копку "1" - три раза подряд. Обычно, для нахождения кнопки "0" требуется более одной секунды. Таким образом, вода нагревается быстрее, но "готовится" дольше.

Другие факторы, кроме скорости, делают решение "111" более эффективным. Для поиска другой кнопки требуется не только время, но и довольно высокий уровень познавательной работы мозга. Пока эта работа происходит, главная задача пользователя - приготовить еду - остается в стороне. Чем дольше она остается в стороне, тем больше времени потребуется, чтобы к ней вернуться.

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

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

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

- Тщательно продумывайте вспомогательные сообщения и делайте их соответствующими проблеме.

- В пунктах меню и надписях на кнопках ключевое слово должно быть первым.

Исследуемые интерфейсы

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

- Предлагайте пользователям постоянные наглядные подсказки, чтобы он чувствовал себя "как дома". Стабильные визуальные элементы не только позволяют людям быстро перемещаться, но и работают как указатели, давая пользователю чувство "дома".

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

- Всегда предоставляйте отмену (undo). Если Ваша программа не предоставляет возможности отмены, Вам неизбежно придется создавать кучу диалогов с вопросами типа "Вы действительно уверены?". Не нужно и говорить, что это замедляет работу. Отсутствие таких диалогов замедляет работу еще больше. Несколько лет назад исследование показало, что люди в опасной среде делают не больше ошибок, чем в отзывчивой и более ясной среде, но они работают гораздо медленнее и осторожнее, чтобы избежать ошибок.

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

- Однако, делайте так, чтобы остаться было легче. Первые программы создавались так, чтобы их трудно было покинуть. С приходом Интернета мы видим программы, в которых трудно остаться. Браузеры напоминают гирлянды объектов и опций, у которых нет ничего общего с самой программой. Иметь на экране выбор из 49 элементов, которые ведут напрямую к разрушению работы, вместе с одним-двумя способными реально помочь - это не исследуемый интерфейс, это черти-что.

Закон Фиттса

Время, необходимое для достижения цели, является функцией расстояния до объекта и его размера. Хотя на первый взгляд закон может показаться понятным, это один из самых часто игнорируемых принципов в дизайне. По этому закону выпадающие меню на Макинтоше приблизительно в 5 раз быстрее, чем Windows-меню. Этот закон показывает, что самые быстродостижимые цели на любом экране это его четыре угла, однако дизайнеры почему-то избегают любой ценой использовать это свойство.

- Используйте большие объекты для важных функций (большие кнопки быстрее).

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

Объекты человеческого интерфейса

Объекты человеческого интерфейса необязательно соответствуют объектам в объектно-ориентированных системах. Эти объекты включают в себя папки, документы и корзину. В действительности, многие ранние интерфейсы были построены целиком в не-объектно-ориентированных средах.

- Объекты человеческого интерфейса могут быть увидены, услышаны, потроганы или восприняты любым другим способом.

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

- Объекты, воспринимаемые другим способом, пока мало знакомы.

- Объекты человеческого интерфейса имеют стандартные способы взаимодействия.

- Объекты человеческого интерфейса имеют стандартное поведение.

- Объекты человеческого интерфейса должны быть понимаемыми, целостными и стабильными.

Уменьшение задержки

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

Для уменьшения видимости задержки:

- Сопровождайте щелчки на всех кнопках визуальной или звуковой обратной связью в пределах 50 миллисекунд.

- Меняйте форму курсора на песочные часы везде, где действие занимает от 1/2 до 2 секунд.

- Анимируйте курсор, чтобы пользователи знали, что система не умерла.

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

- Показывайте действительную длительность с помощью анимированного индикатора.

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

- Делайте так, чтобы после завершения длительных (более 10 секунд) процессов система давала звуковой сигнал или заметную визуальную индикацию.

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

Обучаемость

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

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

Использование метафор

- Выбирайте метафоры правильно, только тогда они позволят пользователям быстро ухватить все детали концептуальной модели. Хорошие метафоры это рассказы, создающие картины в голове.

- Воплощайте метафоры, взывая к человеческому восприятию - зрение, слух, прикосновение - и заставляя работать память.

- Метафоры обычно являются чем-то знакомым, но частенько добавляют новые свойства. Например, в Windows95 есть объект "Портфель". Как и настоящий портфель, его цель помочь нам сделать электронные документы более переносимыми. Он так и делает, действуя, однако, не как транспортировщик, а как синхронизатор: документы в портфеле на рабочем столе и в портфеле на дискете обновляются автоматически при вставке дискеты в дисковод.

Защищайте работу пользователя

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

Удобочитаемость

Текст для чтения должен иметь высокий контраст. Хорошо смотрится черный текст на белом или бледно-желтом фоне. Избегайте серого фона. Уделяйте особое внимание старым людям. В возрасте 45 лет практически у всех людей зрачок становится менее гибким и пропускает меньше света в глаз. Не доверяйте своим молодым глазам делать решения касательно размера и контраста.

Отслеживайте состояние системы

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

Нам нужно знать:

1) Находится ли пользователь в системе первый раз;

2) Где находится пользователь;

3) Куда он направляется;

4) Где он был во время этой сессии;

и множество других деталей.

Видимые интерфейсы

Избегайте невидимой навигации. Большинство пользователей не могут и не будут строить в уме карты и могут потеряться в этом случае.

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

Перевел и подготовил Андрей Седельников


Компьютерная газета. Статья была опубликована в номере 31 за 1999 год в рубрике hard :: технологии

©1997-2024 Компьютерная газета