Существует ряд передовых практик дизайна пользовательского интерфейса, в которых известные цифровые продукты, которые мы часто производим, проверяются на ошибки пользователей. Однако реальный опыт и опыт взаимодействия не всегда оправдывают наши ожидания: ошибки по-прежнему могут быть неотъемлемой частью процесса проектирования. Очень важно проверить элементы интерфейса, которые должны помочь пользователям быстро распознавать определенные взаимодействия или доступный контент. Мы изучаем ошибки пользователей, чтобы сделать эти элементы наиболее полезными.
Как предотвратить ошибки пользователя?
Нам нужно предотвратить ошибки, помогая пользователю предварительно просмотреть и построить лучшую ментальную модель интерфейса продукта. Согласно NN Group , для этого важно использовать шаблоны проектирования, которые могут сообщать пользователям, как они работают, побуждать пользователей перепроверять свою работу (особенно перед удалением) и предупреждать до того, как будут допущены ошибки.
Следование этим простым приемам дизайнеров может помочь вам выяснить, где именно ваши пользователи допускают ошибки, и составить план наперед . Таким образом, существует целый ряд способов, как этого добиться. Давайте посмотрим, что они собой представляют, что они делают и как их использовать с умом.
Соберите пользовательские данные
Чтобы избежать ошибок, важно определить точные расхождения между ментальными моделями пользователей и ментальными моделями дизайнеров. Для этого необходимо собрать пользовательские данные. Существует множество методологий исследования пользователей, которые можно использовать в разных ситуациях, поэтому очень важно выбрать ту, которая даст вам представление о том, почему потребители совершают ошибки и каковы их ожидания.
Контекстное исследование, полевые исследования и этнографические исследования являются эффективными методами раннего изучения ментальных моделей и ожиданий пользователей при разработке нового дизайна. После создания системы (или, по крайней мере, прототипа) можно использовать качественное юзабилити-тестирование для выявления несоответствий между ожиданиями пользователей и ментальными моделями дизайнеров.
Предварительный просмотр результатов
Правда в том, что пользователи часто могут не совсем осознавать полное влияние действий, которые они на самом деле оказывают. Вы должны позволить им рассмотреть, как будут выглядеть внесенные ими изменения, что поможет им увидеть и понять будущее и часто решать свои собственные проблемы еще до того, как они произойдут. Это также позволит им поиграть, экспериментируя, ничего не искажая.
Поддержка отмены
Пользователи могут выполнять, отменять, повторять или повторять многие действия. Когда вы позволите им, по крайней мере, сделать и отменить некоторые из них, чтобы увидеть, как они взаимодействуют, они узнают об ошибке и смогут легко ее исправить. Возможность отменить любое действие из нескольких последних действий будет полезной и приятной для пользователей. Это прямое противодействие ошибкам пользователей и может сделать пользователя более уверенным. Например, использование таких функций, как корзина для мусора, также работает как функция отмены, поскольку позволяет отменить изменения, извлекая удаленные элементы.
Предложения предложения
Посмотрите, какие функции будут добавлены в дизайн вашего продукта, проголосуйте за то, что вы хотели бы видеть в приложении в первую очередь, или поделитесь своими идеями с потенциальными пользователями. Они также должны вносить предложения в качестве обратной связи. Команда разработчиков сделает некоторые заметки, какие функции могут быть изменены и т. д.
Анимация прогресса
Индикаторы выполнения сообщают людям, что ваше приложение не останавливается во время загрузки содержимого или выполнения длительных операций. В вашем родном приложении для реагирования вы можете захотеть иметь анимированные значения индикатора выполнения, а красиво анимированные индикаторы выполнения, заполненные правильно, могут быть проблемой. И таким образом они должны быть хорошо пересмотрены с пользователями.
Моушн-дизайн сейчас в тренде, многие разработчики стремятся заложить в интерфейс не только функциональную анимацию, но и декоративную. Почему нет? Движущаяся картинка будет работать сильнее, чем даже иллюстрация. Все, что нужно для грамотного применения анимации.
Предупреждения в реальном времени
Предоставляйте тонкие контекстные предупреждения в реальном времени, чтобы уведомлять, когда пользователь активно совершает ошибку. Они могут помочь им быстро и точно исправить это. Вам может понадобиться установить эти предупреждения в тех областях, где вы особенно знаете, что пользователи с большей вероятностью будут совершать свои ошибки снова и снова.
Например, служба MailChimp часто показывает, выполнили ли вы все требования к паролю или нет, с помощью галочки, когда вы вводите новый или неправильный пароль.
Установить ограждения
Создайте полезные ограничения, чтобы пользователи не могли сделать неправильный выбор. Ограничение возможностей пользователя не всегда является хорошей идеей, но когда есть четкие указания относительно того, что приемлемо, а что нет, необходимы ограждения, чтобы избежать ошибок.
Следуйте соглашениям о дизайне
Соглашения визуального дизайна обычно представляют собой модели, которые предназначены для управления внешним видом приложения. Конечно, это не выбор визуального дизайна, который сделал бы арт-директор. Это больше то, что показало улучшение удобства использования вашего приложения.
Таким образом, некоторые стандартные соглашения о дизайне могут помочь, поскольку они улучшают понимание пользователями того, какие действия они могут предпринять. И это один из дизайнерских принципов. Пользователи, которые взаимодействуют с вашей кнопкой на веб-сайте или в приложении, использовали тысячи других моделей сайтов и приложений и ожидают, что общие элементы интерактивной системы будут выглядеть и работать определенным образом, знакомым им.
Используйте цветовые акценты
Веб-дизайн требует четкой структуры и ненавязчивых визуальных решений. Пользователь, зайдя на сайт, должен сразу понимать, что главное, а что второстепенное, и т. д. В отличие, например, от рекламного баннера, где основное сообщение умещается в пару строк, интерфейс более нагружен информацию – поэтому выделить главное сложнее, зато можно быстро испортить всю работу.
Вы не можете просто сделать главную кнопку самой большой, жирной и яркой, потому что есть другие важные кнопки. Иерархия создается за счет небольших акцентов. Имейте в виду, что для предотвращения ошибок пользователя.
Искажение порядка
Наш мозг хорошо считывает шаблоны. Если какой-то элемент выбивается из общего ряда, у него нет шансов остаться незамеченным. И это используется в веб-дизайне. Такой подход встречается часто. Так вы сможете показать актуальный раздел сайта, продемонстрировать выбор клиента; обратить внимание пользователя на преимущество продукта или ценную информацию. Главное не переусердствовать: нужен порядок с одним выбивающим элементом, а не вездесущий хаос.
Темные фоны
Такие интерфейсы распространены во всех творческих индустриях и некоторых отраслях бизнеса. Обычно темный фон чередуется со светлым — наличие темного экрана нон-стоп усложнило бы восприятие. Но если пользователь читал что-то на светлом экране, а потом вдруг переключился на темный экран, то получится мощный визуальный акцент, который также может помочь таким пользователям лучше воспринимать данные.
Мы читаем контрастные светлые буквы на темном фоне не хуже, чем темные буквы на светлом фоне. Но если читать слишком долго, мозг устанет — поэтому нужно дозированно использовать темный фон. Следует учитывать, что пользователь может долго и внимательно читать информацию на белом фоне, поэтому там могут быть написаны длинные тексты второстепенной важности. Иногда темные фрагменты довольно малы и помогают разделить информацию на блоки на одном экране и помогают пользователям избежать дискомфорта.
Тональный контраст
Контраст означает просто «различие». Контраст — важнейший аспект визуальной иерархии и важный элемент графического дизайна. Если на сайте представлены все цвета радуги, пользователи непременно оценят его художественную ценность. Но работа с таким интерфейсом их быстро утомит.
Для удобочитаемости текста и различения разных объектов важен не цвет. Важно, что мы видим темное на светлом и светлое на темном. Это помогает выделить самое важное и просто главное, четко разделить информацию, даже если ее много.
Таким образом, тональный контраст не бросается в глаза пользователям, поэтому подходит и для обработки больших объемов текстов, и для сайтов, с которыми пользователь работает длительное время.
Выбирайте разумные значения по умолчанию
Поскольку они показывают пользователям, какой может быть справедливая стоимость ввода, хорошие значения по умолчанию выгодны. Предварительное заполнение полей наиболее типичным значением или настраиваемым значением дает контекст и позволяет пользователям распознавать, когда они ошибаются.
Проведите пользовательское тестирование
Самый точный метод выявления проблем, проблем и пробелов в ментальных моделях — это пользовательское тестирование. Когда пользователю дается задание, сразу становится ясно, борется ли он, терпит неудачу или разочаровывается. Затем, чтобы помочь им избежать этих ошибок, вы можете либо спланировать методы предотвращения ошибок, либо, что еще лучше, улучшить сам дизайн.
Используйте метрики
Метрики могут помочь вам определить, где у ваших пользователей возникают проблемы по разумной цене. Где ваши пользователи покидают страницу? Где они проводят столько времени в странных местах? Когда они выходят из рабочего процесса? Делайте заметки по ответам и используйте стратегии, перечисленные выше, чтобы избежать ошибок.
Оставляйте отзывы об ошибках
Если вы хотите проинформировать пользователя о том, что произошло, что он может с этим сделать и как избежать этого в будущем, обязательно четко сообщите об ошибке. Сильное сообщение об ошибке также поможет пользователю увидеть ошибку как возможность обучения, а не неудачу от его имени. Будьте приветливы, оптимистичны, интересны и полезны.
Заключение
Например, предложение идей, предварительный просмотр результатов и пользовательское тестирование ускоряют доступ пользователя к результатам и выделяют больше, чем просто области, подверженные ошибкам. Пользователи все равно будут совершать ошибки, несмотря на все ваши усилия по предотвращению их взаимодействия. Как дизайнеры, мы несем ответственность за обеспечение системы безопасности, чтобы уменьшить финансовые последствия ошибок, и работаем над тем, чтобы пользователи не совершали одну и ту же ошибку дважды. Большинство упомянутых выше улучшений также повышают общий стандарт UX для всего продукта. Проверьте, выиграет ли ваш следующий UX-проект от реализации этих идей. Дайте нам знать, если вам нужна дополнительная помощь с вашими проектами дизайна продукта.