Наглядность состояния системы (юзабилити эвристика #1)

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

Я нашла несколько вариантов перевода на различных платформах о 10-ти юзабилити эвристиках Якоба Нильсена «10 Usability Heuristics for User Interface Design», в которых собрано краткое описание по каждому из принципов, однако материалы с подробным разбором каждой их них есть только в англоязычном первоисточнике (могу, конечно же ошибаться, может плохо искала.) Это, и плюс желание подкачаться в английском и сподвигли меня на то, чтобы восполнить данное упущение.

Автор: Якоб Нильсен

24 апреля, 1994 г. · Обновлено 30 января, 2024 г.

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

Автор: Aurora Harley

3 июня, 2018 г.

Первый закон Якоба Нилсена из 10 эвристик — Наглядность состояния системы — имеет отношение к гораздо большему, чем к проектированию пользовательского интерфейса. В сущности, речь идёт о коммуникации и открытости, которые критически важны для различных аспектов нашей жизни. Люди стремятся к предсказуемому и управляемому, и в большинстве случаев большая информированность позволяет принимать наиболее эффективные решения.

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

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

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

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

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

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

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

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

Хотели бы вы, чтобы пользуясь вашим продуктом пользователи чувствовали себя также, как при использовании DOS или Unix? Настоящее отличие между устаревшим дизайном интерфейса командной строки и современным дизайном графического пользовательского интерфейса (имеется в виду использование графических элементов, таких как кнопки, меню, окна, иконки и пр.) заключается не в красочных иконках. Оно заключено в наглядности — чётко и понятно отображаемом статусе системы.

Даже когда пользователи не могут увидеть производимого от их действий эффекта по причине того, что у продукта отсутствует экран (например, как в случае с устройствами, оснащёнными только голосовым управлением, такими как Amazon Echo и Google Home) минимальный фидбэк о том, что команда была услышана является существенным. Amazon Echo отображает световое кольцо на поверхности девайса, показывая таким образом, что устройство на данный момент слушает или обрабатывает полученную ранее команду. В данном случае решение в виде индикатора, отображающего состояние «Включено-Выключено» не является таким уж хорошим в сравнении, скажем, с отображением запущенного таймера со временем, необходимым на выполнение полученной команды, но по крайней мере, даже благодаря такому индикатору (как световое кольцо), пользователь может быть уверен в том, что система услышала его команду и (в первую очередь) было запущено время отсчета для её выполнения.

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

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

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

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

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

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

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

К примеру, что должно произойти, когда пользователь вернется к ранее составленному списку в «Избранном» или «Списке желаний», где на данный момент отмечены товары, которых нет в наличии или которые и вовсе больше не продаются? Покупатель приобретет наихудший пользовательский опыт, если эти товары просто исчезнут из списка, безо всяких объяснений того, почему это произошло. А что, если такую проблему решить с помощью нотификации в верхней части экрана? Такое решение может лишь незначительно улучшить сложившуюся ситуацию, так как оно не поможет пользователю вспомнить исключённый из списка товар, чтобы найти подходящую ему замену. Оба ранее описанных сценария лишают пользователя чувства контроля, разрушая тем самым доверие (к сайту и к компании) — пользователи перестанут полагаться на такой список, поскольку выбранные товары могут исчезнуть из него сами по себе.

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

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