Содержание
10 правил юзабилити на все времена
Десять правил выведены гуру юзабилити Якобом Нильсеном — одним из основателей компании “Nielsen Norman Group”, оказывающей консультационные услуги в области юзабилити. Свои правила Нильсен назвал “эвристиками”.
Эвристика — это не имеющий строгого обоснования, но полезный на практике алгоритм. Эвристики дают приемлемое решение задачи в большинстве практически значимых случаев.
Якоб Нильсен сформулировал 10 эвристик в 1990 году, но, несмотря на прошедшие годы, они не теряют своей актуальности. В этой статье я приведу их перевод, дополню содержание своим опытом, а также проиллюстрирую примерами с современных сайтов.
Когда можно использовать эвристики?
Эвристики, как и любые другие чек-листы, используются экспертами по юзабилити при оценке и анализе сайтов или мобильных приложений, которые соотносят их интерфейс с определенными принципами и лучшими известными решениями. Метод экспертной оценки очень популярен, а также дешев и быстр по сравнению с юзабилити-тестированием.
10 эвристик Якоба Нильсена
1. Информированность о состоянии системы
Пользователь всегда должен ориентироваться и хорошо понимать, что происходит в системе. Взаимодействие между пользователем и системой должно быть как можно более логичным и быстрым.
Одна из частых ошибок многих интернет-магазинов — после оформления и отправки формы заказа пользователем оставлять его наедине с самим собой. Сразу возникает много сомнений — а работает ли магазин? Все ли верно я сделал? Может быть, ошибся в контактных данных? Когда я получу свой заказ? Особенно страшно, когда заказ был оплачен, например, банковской картой.
Пример хорошего взаимодействия с клиентом: интернет-магазин сообщает, что с покупателем свяжутся в течение 10 минут, а также указывают номер заказа и телефон службы поддержки:
2. Схожесть системы с реальным миром
Система должна общаться с пользователем на понятном ему языке. Использование слов, фраз и понятий, знакомых пользователю в реальном мире, намного предпочтительнее, чем использование специализированных терминов.
Очень часто использованием терминов “грешат” сайты банков, но и в более простых тематиках, где, казалось бы, проблем связи с реальным миром быть не должно, эвристика грубо нарушается.
В качестве примера — сайт по продаже книг. Сначала в меню слева я выбрала категорию — “Книги на бумаге” (первый шаг обведен в зеленый прямоугольник). На следующем уровне навигации я ожидала увидеть тематики, категории книг, но вместо этого сайт стал общаться со мной на своем, только ему понятном языке:
3. Свобода действий
Дайте пользователям возможность отмены действий, а также возврата к ранее отмененным действиям.
Пользователи часто ошибаются, поэтому система всегда должна предоставлять очевидный шанс клиенту “вернуть, как было”, приложив при этом минимум усилий.
Например, при удалении страницы система дает возможность ее восстановить:
4. Единообразие и стандарты
Не путайте пользователя, описывая одни и те же вещи разными словами и терминами. Придерживайтесь единообразия и следуйте стандартам.
Однажды поняв принцип работы вашего ресурса, пользователь должен быть уверен, что вне зависимости от его перемещений по сайту, это понимание его не покинет. Всегда следуйте одним и тем же правилам внутри ресурса.
Если вы используете кнопку “Добавить в корзину” на карточках товара, то она не должна смениться на изображение тележки на других страницах сайта, где встречается этот товар.
Если же все товары у вас находятся в “Каталоге товаров”, то при переходе со страницы на страницу пользователь не должен вдруг обнаружить раздел “Наша продукция”.
5. Предотвращение ошибок
Сведите к минимуму количество условий, в которых могут быть допущены ошибки.
Даже самые понятные сообщения об ошибках не смогут сделать сайт настолько дружелюбным, насколько это сделает продуманная логика работы, позволяющая их предотвращать. Например, можно давать пользователям подсказки, поясняющие, какую информацию надо вводить:
Или еще лучше — с примерами данных:
Следует заранее продумать, где могут быть ошибки, и предусмотреть варианты преобразования неверных данных от пользователя, например, чтобы поисковая строка на сайте исправляла орфографические ошибки и выдавала релевантные результаты поиска.
6. На виду, а не в памяти
Не заставляйте пользователя запоминать большое количество объектов, действий и опций. Посетитель не должен держать в голове информацию, перемещаясь из одной части системы в другую.
Например, хорошим тоном в современных интернет-магазинах является указание на карточках товаров информации о том, как его купить и получить. Посетителю не нужно уходить с выбранного товара в раздел “Доставка” — вся информация есть на этой же странице.
7. Гибкость и эффективность
Не нагружайте опытных пользователей лишней информацией, предоставьте им возможность совершать часто повторяющиеся действия как можно быстрее и проще.
Упрощайте функции, которыми посетители вашего сайта пользуются чаще всего:
В приведенном примере пояснения к уже привычной для многих пользователей интернет-опции “Заказать звонок” явно избыточны и содержат ненужную информацию.
Еще один пример гибкости на сайте — использование выпадающих списков в формах регистрации/заказа вместо полей свободного ввода с клавиатуры. Исследования подтверждают: выбирать из вариантов гораздо проще, чем вписывать данные. Особенно странно выглядят формы, в поля которых требуется ВПИСАТЬ город проживания или дату доставки.
8. Эстетичный и минималистичный дизайн
Тексты не должны содержать бесполезной или устаревшей информации. Каждое лишнее слово делает восприятие все более трудным и лишает посетителя возможности найти то, за чем он пришел на сайт.
Хороший совет для владельцев неинформационных сайтов: прочтите текст на продвигаемой вами странице и сократите его в два раза. В большинстве случаев это получится даже без искажения смысла той информации, которую вы хотели рассказать посетителю.
К сожалению, избыточность — это свойство не только текстов на современных ресурсах, но и свойство дизайна, количества полей в формах и т. п.
И хотя про избавление от лишних полей в формах не говорил только ленивый, но сайтов, где для оформления заказа требуется заполнить аж 10—15 пунктов, меньше не становится. Замечу, что это только первый шаг оформления заказа, впереди еще оплата!
9. Понимание проблем и их решение
Сообщения об ошибках должны быть выражены на понятном пользователю языке, как можно более точно описывать проблему и предоставлять возможные варианты ее решения.
Рассмотрим пример: пользователь в поиске на сайте ввел некорректный запрос. Хороший ресурс не пугает его пустой страницей без результатов или строками кода с ошибкой, а предлагает варианты решения проблемы:
10. Справочные материалы и документация
Даже если система может использоваться без документации, в процессе работы с ней все же может потребоваться справочная информация. Подобные документы должны составляться таким образом, чтобы в них легко было найти необходимое.
Справочные материалы должны быть лаконичными и содержать только четкие руководства к действиям.
Наиболее часто используемыми справочными материалами являются всевозможные подсказки о формате вводимых данных или объяснения, зачем требуется указать телефон, почту и другую контактную информацию. Такие подсказки не только помогают заполнить форму без ошибок, но и нивелируют опасения и возникающие страхи пользователей:
В последнее время на ресурсах активно стали использоваться интерфейсные подсказки, которые обучают пользователей возможностям сайта, показывают все его функции и помогают сориентироваться.
Например, так:
И так:
Являются ли эвристики панацеей?
Эвристики Нильсена являются общепризнанными и наиболее часто используемыми правилами при проектировании дизайна взаимодействия. Поэтому необходимо обязательно провести по ним проверку вашего ресурса. По сути, это минимальные критерии, которым должен отвечать интерфейс сайта, программы или приложения.
Для более эффективного результата рекомендуется проводить оценку по чек-листу из эвристик несколькими разными экспертами, так как один человек не всегда может обнаружить все проблемы на сайте.
Как любой чек-лист, даже от самого именитого юзабилиста, эвристики субъективны, так как не основаны на тщательных исследованиях. Несмотря на это, они несут действительно практическую пользу и работают в большинстве случаев.
Якоб Нильсен — правила юзабилити
Якоб Нильсен (Jakob Nielsen) — основатель компании «Nielsen Norman Group», является также её руководителем. Компания создана им совместно с Дональдом Норманом, который до этого являлся вице-президентом «Apple Computer». Сам же Якоб Нильсен до 1998 года занимал должность ведущего инженера в компании «Sun Microsystems», где был специалистом по юзабилити.
Большинство экспертов юзабилити используют набор эвристик, разработанный 17 лет назад Рольфом Моличем и Якобом Нильсеном. До них многие также пытались выводить принципы юзабилити, но в них было так много аспектов, что оценка заняла бы несколько дней. (Например, принципы дизайна пользовательского интерфейса в программах Смита и Мойзера состояли из 944 пунктов и до сих пор являются крупнейшим собранием руководств по пользовательскому интерфейсу.)
Ниже рассмотрим десять принципов Молича и Нильсена.
1. Информированность о состоянии системы
Пользователь всегда должен ориентироваться и хорошо понимать, что происходит в системе. Взаимодействие между пользователем и системой должно быть как можно более логичным и быстрым.
2. Схожесть системы с реальным миром
Система должна общаться с пользователем на понятном ему языке. Использование слов, фраз и понятий, знакомых пользователю в реальном мире, намного предпочтительнее, чем использование специализированных терминов.
3. Свобода действий
Дайте пользователям возможность отмены действий, а также возврата к ранее отмененным действиям.
4. Единообразие и стандарты
Не путайте пользователя, описывая одни и те же вещи разными словами и терминами. Придерживайтесь единообразия и следуйте стандартам.
5. Предотвращение ошибок
Сведите к минимуму количество условий, в которых могут быть допущены ошибки.
6. На виду, а не в памяти
Не заставляйте пользователя запоминать большое количество объектов, действий и опций. Посетитель не должен держать в голове информацию, перемещаясь из одной части системы в другую.
7. Гибкость и эффективность
Не нагружайте опытных пользователей лишней информацией, предоставьте им возможность совершать часто повторяющиеся действия как можно быстрее и проще.
8. Эстетичный и минималистичный дизайн
Тексты не должны содержать бесполезной или устаревшей информации. Каждое лишнее слово делает восприятие все более трудным и лишает посетителя возможности найти то, за чем он пришел на сайт.
9. Понимание проблем и их решение
Сообщения об ошибках должны быть выражены на понятном пользователю языке, как можно более точно описывать проблему и предоставлять возможные варианты ее решения.
10. Справочные материалы и документация
Даже если система может использоваться без документации, в процессе работы с ней все же может потребоваться справочная информация. Подобные документы должны составляться таким образом, чтобы в них легко было найти необходимое.
Что упущено в краткости принципов Молича и Нильсена, так это точность. Принципы Молича и Нильсена были рассмотрены множеством специалистов на основе оценки научных работ. Их принципы были выведены из 249 проблем юзабилити 11 интерактивных систем. Как заметил Боб Бэйли:
«Эти эвристики, которыми многие пользуются, не были подтверждены. Нет никаких доказательств, что их использование в области проектирования и разработки пользовательских интерфейсов позволит улучшить интерфейс».
Какие существуют альтернативы? Большинство юзабилити специалистов имеют собственный список принципов или чек-лист, но это приводит к той же проблеме: они не являются научно обоснованными. Как следствие, они становятся лишь плодом пристрастий и капризов рецензента.
10 Эвристика юзабилити для дизайна пользовательского интерфейса
Резюме: 10 общих принципов дизайна взаимодействия Якоба Нильсена. Их называют «эвристиками», потому что они представляют собой общие эмпирические правила, а не конкретные рекомендации по удобству использования.
Автор Якоб Нильсен
- Якоб Нильсен
на
2020-11-15
24, 19 апр.94; Обновлено 15 ноября 2020 г.
Темы:
десять эвристик, эвристическая оценка, стандарты и соглашения, взаимодействие человека с компьютером, удобство использования в Интернете, 10 лучших
- Эвристическая оценка
Эвристическая оценка, - Взаимодействие человека с компьютером,
- Веб-юзабилити
Поделиться этой статьей:
Загрузите бесплатный плакат Джейкоба «10 эвристик юзабилити» внизу этой статьи.
#1: Видимость состояния системы
Дизайн должен всегда информировать пользователей о том, что происходит, посредством соответствующей обратной связи в разумные сроки.
Когда пользователи знают текущее состояние системы, они узнают о результатах своих предыдущих взаимодействий и определяют следующие шаги. Предсказуемое взаимодействие создает доверие как к продукту, так и к бренду.
Пример эвристики юзабилити №1:
Индикаторы «Вы здесь» на картах торговых центров должны показывать людям, где они сейчас находятся, чтобы помочь им понять, куда идти дальше.
#2: Соответствие между системой и реальным миром
Дизайн должен говорить на языке пользователя. Используйте слова, фразы и понятия, знакомые пользователю, а не внутренний жаргон. Следуйте принятым в реальном мире правилам, чтобы информация отображалась в естественном и логичном порядке.
То, как вы должны проектировать, во многом зависит от ваших конкретных пользователей. Термины, концепции, значки и изображения, которые кажутся совершенно понятными вам и вашим коллегам, могут быть незнакомы или сбивать с толку ваших пользователей.
Когда элементы управления дизайна соответствуют реальным соглашениям и соответствуют желаемым результатам (так называемое естественное сопоставление), пользователям легче изучить и запомнить, как работает интерфейс. Это помогает создать интуитивно понятный опыт.
Пример эвристики удобства использования № 2:
Когда элементы управления плиты соответствуют расположению нагревательных элементов, пользователи могут быстро понять, какой элемент управления соответствует какому нагревательному элементу.
#3: Пользовательский контроль и свобода
Пользователи часто выполняют действия по ошибке. Им нужен четко обозначенный «аварийный выход», чтобы выйти из нежелательного действия без необходимости проходить расширенный процесс.
Когда людям легко отказаться от процесса или отменить действие, это способствует чувству свободы и уверенности. Выходы позволяют пользователям сохранить контроль над системой и избежать застревания и чувства разочарования.
Пример эвристики юзабилити № 3:
Цифровым пространствам нужны быстрые «аварийные выходы», как и физическим пространствам.
#4: Согласованность и стандарты
Пользователи не должны задаваться вопросом, означают ли разные слова, ситуации или действия одно и то же. Следуйте платформенным и отраслевым соглашениям.
Закон Джейкоба гласит, что люди проводят большую часть своего времени, используя цифровые продукты , отличные от ваших . Опыт пользователей с этими другими продуктами формирует их ожидания. Несоблюдение согласованности может увеличить когнитивную нагрузку пользователей, заставив их узнавать что-то новое.
Пример эвристики юзабилити № 4:
Стойки регистрации обычно располагаются в передней части отелей. Эта последовательность соответствует ожиданиям клиентов.
№5: предотвращение ошибок
Хорошие сообщения об ошибках важны, но лучший дизайн в первую очередь тщательно предотвращает возникновение проблем. Либо устраните подверженные ошибкам условия, либо проверьте их и предоставьте пользователям возможность подтверждения, прежде чем они совершат действие.
Есть два типа ошибок: промахи и ошибки. Промахи — это неосознанные ошибки, вызванные невнимательностью. Ошибки — это сознательные ошибки, основанные на несоответствии между ментальной моделью пользователя и дизайном.
Пример эвристики удобства использования № 5:
Ограждения на извилистых горных дорогах предотвращают падение водителей со скал.
#6: Узнавание, а не отзыв
Минимизируйте нагрузку на память пользователя, сделав видимыми элементы, действия и параметры. Пользователь не должен запоминать информацию из одной части интерфейса в другую. Информация, необходимая для использования дизайна (например, метки полей или пункты меню), должна быть видна или легкодоступна при необходимости.
Люди обладают ограниченной кратковременной памятью. Интерфейсы, которые способствуют распознаванию, сокращают количество когнитивных усилий, требуемых от пользователей.
Пример эвристики юзабилити №6:
Большинству людей легче узнавать столицы стран, чем запоминать их. Люди с большей вероятностью правильно ответят на вопрос Является ли Лиссабон столицей Португалии? вместо Какая столица Португалии?
#7: Гибкость и эффективность использования
Ярлыки — скрытые от пользователей-новичков — могут ускорить взаимодействие для опытного пользователя, так что дизайн будет удобен как для неопытных, так и для опытных пользователей. Разрешить пользователям настраивать частые действия.
Гибкие процессы могут выполняться различными способами, чтобы люди могли выбрать тот метод, который им подходит.
Пример эвристики юзабилити №7:
Обычные маршруты указаны на картах, но местные жители, лучше знающие местность, могут сократить путь.
#8: Эстетичный и минималистичный дизайн
Интерфейсы не должны содержать неактуальную или редко используемую информацию. Каждая дополнительная единица информации в интерфейсе конкурирует с соответствующими единицами информации и уменьшает их относительную видимость.
Эта эвристика не означает, что вы должны использовать плоский дизайн — она направлена на то, чтобы контент и визуальный дизайн были сфокусированы на главном. Убедитесь, что визуальные элементы интерфейса поддерживают основные цели пользователя.
Пример эвристики удобства использования № 8:
У богато украшенного чайника могут быть чрезмерные декоративные элементы, которые могут мешать удобству использования, например, неудобная ручка или трудно моющееся сопло.
№ 9: помогите пользователям распознавать, диагностировать и устранять ошибки
Сообщения об ошибках должны быть изложены простым языком (без кодов ошибок), точно указывать на проблему и конструктивно предлагать решение.
Эти сообщения об ошибках также должны быть представлены с визуальным оформлением, которое поможет пользователям заметить и распознать их.
Пример эвристики юзабилити #9:
Знаки неправильного пути на дороге напоминают водителям, что они движутся в неправильном направлении, и просят их остановиться.
#10: Справка и документация
Лучше, если система не потребует дополнительных пояснений. Однако может потребоваться предоставить документацию, чтобы помочь пользователям понять, как выполнять свои задачи.
Содержимое справки и документации должно быть удобным для поиска и сосредоточено на задаче пользователя. Будьте кратки и перечислите конкретные шаги, которые необходимо выполнить.
Пример эвристики юзабилити №10:
Информационные киоски в аэропортах легко узнаваемы и решают проблемы клиентов в контексте и немедленно.
Записка от Якоба
Первоначально я разработал эвристику для эвристической оценки в сотрудничестве с Рольфом Моличем в 1990 году [Молич и Нильсен, 1990; Нильсен и Молич, 1990]. Четыре года спустя я усовершенствовал эвристику на основе факторного анализа 249 проблем юзабилити [Nielsen 19].94a] для получения набора эвристик с максимальной объяснительной силой, в результате чего получается этот пересмотренный набор эвристик [Nielsen 1994b].
В 2020 году мы обновили эту статью, добавив больше объяснений, примеров и связанных ссылок. Хотя мы немного усовершенствовали язык определений, сами эвристики 10 остались актуальными и неизменными с 1994 года. Если что-то остается верным в течение 26 лет, это, вероятно, будет применяться и к будущим поколениям пользовательских интерфейсов.
Бесплатный плакат «10 эвристик»
Загрузите бесплатный постер «10 эвристик юзабилити» Якоба внизу этой статьи в разделе Downloads . Вы можете скачать итоговый постер в 3-х размерах: полный постер, A4 и Letter. Вы также можете скачать полный набор из 11 постеров (10 эвристик юзабилити и итоговый плакат).
Загрузите и распечатайте наши бесплатные постеры с эвристикой юзабилити. Повесьте их дома, в офисе или подарите коллеге.
См. также
Примеры
- 10 Эвристики удобства использования, применяемые к C сложные приложения — примеры эвристик, применяемых к сложным и специфичным для предметной области программным приложениям.
- 10 Эвристики удобства использования, применяемые к виртуальной реальности — см. эвристики, применяемые к 3D-виртуальным средам.
- 10 эвристик юзабилити в применении к видеоиграм — Отличные примеры 10 эвристик в интерактивных и визуальных пользовательских интерфейсах с развлекательной целью.
- 10 Эвристики удобства использования в повседневной жизни (просто для развлечения)
Контрольные списки и рекомендации
- Полный набор из 2397 руководств по дизайну UX (в нескольких отчетах).
- Список основных принципов дизайна интерфейса Брюса «Тог» Тоньяццини.
Список немного слишком длинный для эвристической оценки, но служит полезным контрольным списком.
Ссылки
- Молич Р. и Нильсен Дж. (1990). Улучшение диалога человека с компьютером, Сообщения ACM 33, 3 (март), 338-348.
- Нильсен, Дж., и Молич, Р. (1990). Эвристическая оценка пользовательских интерфейсов, Proc. Конф. ACM CHI’90. (Сиэтл, Вашингтон, 1–5 апреля), 249–256.
- Нильсен, Дж. (1994а). Повышение объяснительной силы эвристики юзабилити. проц. Конф. ACM CHI’94. (Бостон, Массачусетс, 24-28 апреля), 152-158.
- Нильсен, Дж. (1994b). Эвристическая оценка. В Nielsen, J. и Mack, R.L. (Eds.), Usability Inspection Methods, John Wiley & Sons, New York, NY.
Многие люди спрашивают, могут ли они использовать эти эвристики в своей работе. Да, но, пожалуйста, укажите имя Якоба Нильсена и укажите адрес этой страницы [nngroup.com/articles/ten-usability-heuristics] или процитируйте приведенную выше статью [Nielsen 1994a]. Однако, если вы хотите распечатать копии этой страницы или воспроизвести содержимое в Интернете, см. подробности в нашей информации об авторских правах. Copyright © by Jakob Nielsen.ISSN 1548-5552
Загрузки
- Jakob’s 10 Эвристика юзабилити Все постеры (ZIP)
- Краткий плакат Джейкоба «10 эвристик юзабилити» (PDF)
- Краткий плакат Якоба «10 эвристик юзабилити», размер A4 (PDF)
- Краткий постер «10 эвристик юзабилити» Якоба, формат Letter (PDF)
- Поделиться:
10 Эвристика удобства использования, применяемая к сложным приложениям
10 эвристик юзабилити Якоба Нильсена для проектирования пользовательского интерфейса широко использовались в качестве основных практических правил для принятия проектных решений с момента их первоначального представления в 1994 году. точно так же, как они применяются к большинству других форм взаимодействия, от видеоигр до приложений виртуальной реальности. (Причина в том, что эвристика юзабилити носит очень общий характер, что подразумевается самим словом «эвристика».)
Ранее мы определили сложное приложение как любое приложение, поддерживающее широкие, неструктурированные цели или нелинейные рабочие процессы высококвалифицированных пользователей в специализированных областях. В эту категорию попадают корпоративные приложения, приложения, поддерживающие сложный анализ данных и моделирование, а также системы, поддерживающие принятие высокоэффективных или важных решений. В этой статье мы приводим примеры того, как каждая эвристика применяется к таким сложным приложениям.
#1: Видимость состояния системы
Дизайн должен всегда информировать пользователей о том, что происходит, посредством соответствующей обратной связи в течение разумного периода времени.
Соответствующая обратная связь для действия пользователя, возможно, является самым основным принципом проектирования пользовательского интерфейса. Без надлежащей и своевременной обратной связи пользователи могут не понять, правильно ли интерпретировано их действие и что система пытается выполнить их запрос. Они могут оказаться сбитыми с толку и недоверчивыми.
Одним из наиболее распространенных примеров обратной связи является индикатор прогресса. Индикаторы выполнения информируют пользователей о текущем рабочем состоянии системы и уменьшают неопределенность, пока пользователь ожидает завершения процесса. Поскольку длительное ожидание является обычной реальностью в сложных приложениях, пользователи получают подробную информацию о том, что происходит, например, прошедшее время (или выполненные шаги) и оставшееся время или шаги.
ArcMap, географическая информационная система (ГИС), поддерживает эту эвристику, предоставляя подробные сведения о выполненных и оставшихся шагах, когда пользователи выполняют сложные запросы данных и соединения.
ArcMap: индикатор выполнения содержит список выполненных и выполняемых шагов. Этот подход полезен, когда работа или время, оставшееся до завершения, не могут быть точно оценены.
Относительное указание того, сколько времени система ожидает от процесса, позволяет пользователям решить, ждать ли завершения процесса или начать другую задачу в это время. Когда время ожидания превышает 10 секунд — распространенный сценарий в сложных приложениях — общие циклические анимации не помогают пользователям принять это решение.
Индикаторы выполнения, которые предоставляют только общие сообщения Please wait и циклическую анимацию, недостаточны для ожидания, превышающего 10 секунд (как правило, в сложных приложениях). Предоставьте дополнительную информацию о том, что происходит и сколько времени займет процесс.
#2: Соответствие между системой и реальным миром
Дизайн должен говорить на языке пользователей. Используйте слова, фразы и понятия, знакомые пользователю, а не внутренний жаргон. Следуйте принятым в реальном мире правилам, чтобы информация отображалась в естественном и логичном порядке. (Читайте нашу полную статью на соответствие между системой и реальным миром .)
Частью поддержки этой эвристики является использование знакомства пользователей с реальным миром, чтобы помочь им понять элементы управления и концепции в приложении. Дизайнеры могут воспользоваться уже устоявшимися культурными метафорами и нормами для создания естественных отображений, соответствующих ожиданиям пользователей и упрощающих выполнение задач без необходимости вспоминать какую-либо дополнительную информацию. Когда эти культурные метафоры разрушаются, возникает путаница.
Например, в американской культуре устоялось понятие «кофе-брейк», когда работник на несколько минут отвлекает от своей работы, чтобы насладиться чашечкой кофе. Одно программное обеспечение для управления колл-центром и мониторинга нарушает это установленное правило, помещая изображение дымящейся кофейной чашки рядом с именами тех представителей колл-центра, которые доступны , чтобы ответить на звонок.
В этом программном обеспечении для управления колл-центром и мониторинга доступные операторы отмечены значком кофейной чашки рядом с их именами. Этот дизайн игнорирует общепринятое правило перерыва на кофе.
Менеджер колл-центра, участвовавший в нашем исследовании, пожаловался: «По какой-то причине [это программное обеспечение] помещает кого-то, кто свободен, с небольшой чашкой кофе. Я не знаю почему. Вы могли бы подумать, что это означало бы, что [у них] был перерыв». Даже для частых пользователей (этот конкретный менеджер колл-центра использовал это приложение каждый день в течение многих лет) эти типы несоответствий между концепцией системы и реальным миром со временем приводят к неэффективности компиляции, поскольку пользователям приходится останавливаться, чтобы вспомнить специфичные для системы данные. значит снова и снова.
#3: Пользовательский контроль и свобода
Пользователи часто выполняют действия по ошибке. Им нужен четко обозначенный «аварийный выход», чтобы выйти из нежелательного действия без необходимости проходить расширенный процесс. (Прочитайте нашу полную статью о пользовательском контроле и свободе .)
Все пользователи, безусловно, выигрывают от элементов управления пользовательского интерфейса, которые позволяют им вернуться к предыдущему состоянию системы (например, кнопок «Назад» для возврата к предыдущим экранам, Отменить опций, чтобы вернуться к прежним состояниям, или Отменить ссылок, чтобы выйти из многошаговых процессов) независимо от поставленной задачи. Однако пользователи сложной работы часто вкладывают высокий уровень знаний и времени в свои рабочие процессы. Им нужна возможность быстро исправить ошибки или отказаться от сделанного выбора, чтобы их инвестиции не были потеряны из-за промаха (правильное намерение, неправильное действие) или ошибки (неправильное намерение) при изучении системы.
Jitterbit Cloud Studio, приложение для подключения облачного и локального программного обеспечения и развертывания API, поддерживает эту эвристику, предоставляя пользователям возможность восстановить свою работу до более ранней версии, которую система автоматически сохраняет. Пользователи могут получить доступ к временной шкале истории проекта, просмотреть изменения и развертывания в рамках своего проекта и восстановить предыдущую версию. Особенно для новых или нечастых пользователей такие функции бесценны для поддержки обучения на практике (т. е. позволяя пользователям разбираться во всем, не страдая от ужасных последствий в процессе обучения).
Jitterbit Cloud Studio: возможность для пользователей восстанавливать свои проекты до более ранних версий экономит время и нервы при совершении ошибок.
#4: Соответствие и стандарты
Пользователи не должны задаваться вопросом, означают ли разные слова, ситуации или действия одно и то же. Следуйте платформенным и отраслевым соглашениям. (Прочитайте нашу полную статью о согласованности и стандартах .)
Сложные приложения обычно поддерживают уникальные рабочие процессы, зависящие от предметной области. Несмотря на высокий уровень специализации, существует множество возможностей для создания согласованности, как внешней, так и внутренней. Согласованность помогает пользователям понять, чего ожидать, и повышает обучаемость.
Внутренняя согласованность относится к согласованности внутри продукта или семейства продуктов. Этот тип согласованности поддерживается, когда интерактивные компоненты используют одно и то же визуальное представление и язык повсюду.
Например, Microsoft Power BI поддерживает внутреннюю согласованность, резервируя знак «плюс» для обозначения действия по добавлению чего-то нового в различные рабочие области в приложении. Более того, основной призыв к действию для создания нового элемента находится в одном и том же месте (в правом верхнем углу) в каждой рабочей области, и визуальный дизайн этих действий согласован.
Microsoft Power BI: знак «плюс» постоянно используется для обозначения добавления чего-то нового в рабочих областях и окнах. Кроме того, визуальный дизайн и место действия соответствуют друг другу.
Внешняя согласованность относится к установленным соглашениям в отрасли или в Интернете в целом. Закон Якоба все еще действует: даже пользователи сложных приложений, которые изо дня в день используют одно и то же приложение для своей работы, проводят большую часть своего времени на других сайтах и в других приложениях, и это время в другом месте формирует их ожидания от каждого взаимодействия, независимо от платформы.
Как мы видели в примере с Microsoft Power BI, относительно хорошо принято, что знак плюс указывает на добавление или создание элемента, элемента или объекта. Однако в одном приложении для управления проектами, ориентированном на DevOps, знак «плюс» использовался для обозначения возможности открытия панели с дополнительными сведениями об отдельных задачах.
Внутренняя согласованность не поддерживается в этом приложении, так как знак плюса используется в качестве значка для представления как добавления элементов (верхний снимок экрана, правое поле), так и расширения содержимого (верхний снимок экрана, левое поле). (На нижнем снимке экрана показано описание при наведении знака плюс, используемого для расширения содержимого. )
Такой подход нарушает не только внешнюю согласованность, но в данном случае и внутреннюю согласованность: знак «плюс» используется в другом месте в том же приложении для обозначения добавления чего-то нового. Один ежедневный пользователь этого приложения спросил: «Можно добавить сюда задачу?» как заметил плюсик в таблице. «О, это просто расширяется», — добавил он, когда появилось описание зависания. И здесь мы снова видим доказательства того, что постоянных пользователей, а не только новых пользователей, изучающих систему, смущает отсутствие согласованности.
№ 5: предотвращение ошибок
Хорошие сообщения об ошибках важны, но лучший дизайн в первую очередь тщательно предотвращает возникновение проблем. Либо устраните подверженные ошибкам условия, либо проверьте их и предоставьте пользователям возможность подтверждения, прежде чем они совершат действие. (Прочитайте наши полные статьи о предотвращении ошибок для промахов и ошибок . )
Это хорошо изученное явление, когда пользователи склонны начинать использовать вещи, а не тратить время на то, чтобы сначала понять их. Эта концепция известна как «парадокс активного пользователя». Это парадокс, потому что мы знаем, что если пользователи если бы потратил время на изучение системы или чтение документации, это сэкономило бы им время в долгосрочной перспективе, но, увы, они сосредоточены на том, чтобы как можно скорее начать работу. Мы можем поддерживать это распространенное поведение пользователей, разрабатывая рабочие процессы для предотвращения проблем, когда пользователи исследуют и изучают систему или пробуют новые вещи.
Например, когда пользователи создают компоненты информационной панели в Salesforce, они могут видеть предварительный просмотр виджета в реальном времени по мере добавления и настройки параметров. Отображение изменений в виджете по мере принятия этих дополнительных решений помогает пользователям понять последствия своих действий и быстро исправить любые неожиданные результаты.
Salesforce: когда пользователи создают компонент панели мониторинга, они видят предварительный просмотр процесса (справа) по мере добавления и изменения параметров и настроек (слева).
#6: Распознавание вместо отзыва
Минимизируйте нагрузку на память пользователя, сделав видимыми элементы, действия и параметры. Пользователь не должен запоминать информацию из одной части интерфейса в другую. Информация, необходимая для использования дизайна (например, метки полей или пункты меню), должна быть видна или легкодоступна при необходимости. (Читайте нашу полную статью на признание против отзыва .)
Распознавание относится к нашей способности «распознавать» событие или часть информации как знакомое, а припоминание обозначает извлечение связанных деталей из памяти. Конечно, узнавание снижает когнитивную нагрузку; пользователям гораздо проще распознать видимый помеченный значок или действие, чем вспомнить сочетание клавиш или жестовую команду (хотя некоторые опытные пользователи предпочитают использовать эти ускорители).
Часто в сложных приложениях так много данных, опций и информации, конкурирующих за пространство и внимание, что полезно предоставлять подсказки для распознавания в интерфейсе. Revit, программное обеспечение для моделирования зданий, поддерживает распознавание вместо воспроизведения, предоставляя визуальные 3D-напоминания о том, как выглядят различные части здания, когда пользователи наводят курсор на номера деталей на левой боковой панели. В этом примере вместо того, чтобы вспоминать номер детали «ML-38», пользователь-специалист в предметной области может легко распознать деталь по ее изображению (а также обратиться к подробному названию, отображаемому в том же окне).
Revit: когда пользователь наводит указатель мыши на номер детали, появляется визуальный элемент здания, что позволяет распознавать его, а не вспоминать.
#7: Гибкость и эффективность использования
Ярлыки — скрытые от пользователей-новичков — могут ускорить взаимодействие для опытных пользователей, так что дизайн будет удобен как для неопытных, так и для опытных пользователей. Разрешить пользователям настраивать частые действия. (Прочитайте нашу полную статью о гибкости и эффективности использования .)
Эффективность дороже золота для пользователей сложных приложений. Тем не менее, все пользователи, независимо от их уровня знаний и обучения работе с системой, в конечном итоге достигают плато эффективности, когда дальнейшее использование больше не повышает эффективность. Другими словами, как только пользователи полностью изучат интерфейс, они «максимально используют» свою способность продолжать повышать эффективность за счет повторения задач.
Ускорители
— функции пользовательского интерфейса, которые ускоряют взаимодействие или процесс — помогают опытным пользователям преодолеть это плато, предоставляя более быстрые методы (например, ярлыки) для выполнения тех же задач. Общие ускорители — это сочетания клавиш, макросы, сенсорные жесты и жестовые команды, управляемые мышью. Эксперты могут использовать эти ярлыки, чтобы стать более эффективными; в то же время начинающие пользователи по-прежнему могут использовать основные методы выполнения задачи, такие как пошаговые мастера или четко обозначенные пункты меню.
Solidworks, программа для моделирования мехатронных систем, поддерживает гибкость и эффективность использования жестовых команд. Перемещая мышь с определенной скоростью в определенном направлении, пользователь может открывать ярлыки для общих команд. Кроме того, пользователи могут настроить эти команды, чтобы определить свои собственные ярлыки, чтобы соответствовать их общим рабочим процессам и предпочтениям.
Solidworks: ярлыки для общих действий отображаются, когда пользователь перемещает мышь с определенной скоростью в определенном направлении.
#8: Эстетичный и минималистичный дизайн
Интерфейсы не должны содержать неактуальную или редко используемую информацию. Каждая дополнительная единица информации в интерфейсе конкурирует с соответствующими единицами информации и уменьшает их относительную видимость. (Посмотрите наше видео об эстетическом и минималистском дизайне .)
Эстетический и минималистичный дизайн заключается в том, чтобы контент и визуальный дизайн были сосредоточены на том, что важно для пользователей. Каждый элемент интерфейса — каждая метка, значок, кнопка и точка данных — конкурируют за внимание и нагружают когнитивные способности пользователей. Особенно в сложном интерфейсе, где много конкурирующей информации и элементов управления, некритические элементы усложняют задачи визуального поиска.
Если в интерфейсе есть элементы, которые редко используются или используются только небольшим числом пользователей, можно использовать поэтапное раскрытие, чтобы отложить эти элементы на вторичный уровень. Например, Mastercard Test and Learn использует поэтапное раскрытие для раскрытия дополнительных настроек только после проверки соответствующего поля в динамической форме. В этом случае поле Дать разрешения до отображается только после Отметить это установка как частная проверяется.
Mastercard Test and Learn: поэтапное раскрытие раскрывает расширенные настройки (предоставить разрешения на втором снимке экрана) только после проверки соответствующего поля (отметить этот параметр как частный).
Эту эвристику также можно поддерживать, полностью удаляя из интерфейса ненужные элементы. Многие сложные приложения виновны в излишней графике — визуальных элементах, которые не служат реальной цели и уменьшают визуальную значимость важной информации. Например, приведенное ниже программное обеспечение для управления проектами использует значок для обозначения типа элемента (здесь — задач) в списке, содержащем только элементы этого типа. Эти значки не помогают визуальному поиску; они только добавляют беспорядок в интерфейс и тратят драгоценное пространство.
Избыточные значки создают беспорядок и занимают драгоценное место в интерфейсе.
№ 9: помогите пользователям распознавать, диагностировать и устранять ошибки
Сообщения об ошибках должны быть изложены простым языком (без кодов ошибок), точно указывать на проблему и конструктивно предлагать решение. (Прочитайте нашу полную статью о рекомендациях по сообщениям об ошибках . )
Сообщения об ошибках должны быть понятными, описательными и помогать пользователю понять, как исправить ошибку. Эта эвристика обычно не поддерживается в сложных приложениях. Предполагается, что пользователи должны быть обучены работе с системой или иным образом набраться опыта в результате длительного воздействия и понять нюансы и коды системной модели. Это слишком много, чтобы просить.
Чаще всего эта эвристика не поддерживается, когда сообщения об ошибках не предлагают прямого руководства по устранению неполадок. Неспособность дать конструктивный совет о том, как исправить ошибку, является двойным промахом. Мало того, что пользователи остаются без пути к восстановлению, но ценная возможность для повышения обучаемости упускается впустую, поскольку пользователи особенно мотивированы и с большей вероятностью будут читать инструкции, когда им нужно восстановиться после ошибки. Краткие, но описательные сообщения об ошибках рассказывают пользователям о системе.
На одной из платформ планирования ресурсов предприятия (ERP) пользователь столкнулся с сообщением об ошибке, показанным ниже: Может не отображать данные . Свяжитесь с вашим системным администратором . Это фактически тупик для этого рабочего процесса. Контакт ваш система администратор недостаточное разрешение руководства и может не дисплей данные не сообщает, что пошло не так.
Сообщения об ошибках без прямых указаний по устранению, подобные этому, не помогают пользователям восстановиться и упускают ценную возможность помочь пользователям изучить систему.
В тех случаях, когда краткое указание по устранению неполадок не может быть кратко включено в сообщение об ошибке (разумный сценарий для сложных приложений), дайте прямую ссылку на более подробную документацию или справку в сообщении об ошибке (но не слишком полагайтесь на этот подход). Например, когда проект невозможно развернуть из-за недопустимых операций, Jitterbit Cloud Studio предоставляет ссылки на обширную документацию по правилам и шаблонам работы.
Jitterbit Cloud Studio: сообщения об ошибках содержат ссылки на подробную документацию, если в сообщении об ошибке недостаточно подробно описано решение проблемы.
#10: Справка и документация
Лучше, если система не потребует дополнительных пояснений. Однако может потребоваться предоставить документацию, чтобы помочь пользователям понять, как выполнять свои задачи. (Прочитайте нашу полную статью о справке и документации .)
Многие сложные приложения требуют обучения пользователей или, по крайней мере, сопровождаются надежной документацией и справочными сайтами. Обучение и документация являются очень полезными ресурсами для пользователей, выполняющих нечастые или специализированные задачи; однако мы знаем, что пользователи редко тратят время на чтение надежной документации, прежде чем пытаться выполнить задачи, и даже самое лучшее обучение трудно вспомнить в данный момент. По этим причинам может быть полезно предоставить сокращенную контекстную справку и руководство в приложении.
Например, Revit, программа для моделирования зданий, предоставляет встроенную справку по командам панели инструментов. Когда пользователь наводит курсор на элементы на панели инструментов, краткое описание команды, сочетание клавиш и даже короткий видеоклип, демонстрирующий команду в действии, отображаются в большой всплывающей подсказке.
Revit: когда пользователь наводит указатель мыши на значок панели инструментов, всплывающая подсказка показывает содержимое справки: краткое описание команды, сочетание клавиш и даже короткий видеоклип, демонстрирующий команду в действии.
Этот метод предоставления краткой встроенной справки часто является лучшим способом представить пользователю справочный контент, чем длинные принудительные учебные пособия во время начального использования, потому что он находится внутри приложения и с большей вероятностью будет использоваться и упоминаться в контексте использования.