обзор самых востребованных
дизайн-профессий в 2024 году

Законы восприятия и когнитивные искажения в интерфейсах

Законы восприятия и когнитивные искажения в интерфейсах
2 ноября, 2023
5 мин

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

Законы восприятия в интерфейсах

Закон Фиттса

Закон гласит: чем больше размер объекта и чем ближе он к курсору, тем быстрее пользователь на него кликнет. Другими словами, рука человека не должна устать, пока он двигает курсор до нужной точки. 

Закон Фиттса о размере объекта
Источник фото: @thisishustler/twitter

Закон Хика-Хаймана

Время, которое человек тратит на принятие решений, зависит от количества альтернатив. Чем больше альтернатив, тем сложнее ему выбрать. Поэтому большие меню в приложениях работают плохо. Это можно объяснить простым примером: когда вам дают большое меню в ресторане, вы дольше выбираете блюдо, чем если вам дадут маленькое. 

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

Закон Теслера

Интерфейс можно упростить, если программа возьмет на себя часть функций пользователя. Например, если раньше при оплате банковской картой на сайте человеку самому нужно было выбрать тип платежной системы (MasterCard, Visa и т.д.), то сейчас за него это делает программа. 

Как когнитивные искажения влияют на интерфейс

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

Соответствие ожиданиям пользователей

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

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

меню на яндекс маркете
меню на сайте озона
У крупных маркетплейсов похожие меню

Сохранение единообразия

Интерфейс должен выглядеть одинаково в разных местах. Разношерстный дизайн усложняет использование продукта и его запоминание. Антипример — сайт компании Amazon, где добавление в виш-лист находится у одних товаров слева, а у других — справа, что приводит к неразберихе.

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

кнопка на сайте
аналогичная кнопка в другом месте
Одни и те же элементы в разных местах экрана

Функциональный минимализм

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

сайт в стиле минимализм
Главная страница Airbnb

Снижение когнитивной нагрузки

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

пример неудачной навигации по сайту
Тут непросто сориентироваться в навигации

Эмоциональное вовлечение

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

интерфейс без лишней нагрузки
Пример минималистичного оформления программы

Контроль пользователя над ситуацией

Позволяйте пользователю контролировать продукт. Например, если человек положил товар в корзину, то у него должна быть возможность в любой момент его удалить. Это вызывает чувство доверия и безопасности. В некоторых интернет-магазинах удаление товара — сложный процесс. Человеку нужно поставить «0» в количество товаров, что совсем для него не очевидно. Если пользователь не может контролировать интерфейс, то он чувствует себя беспомощным. 

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

Простота обучения

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

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

Корректная обработка ошибок

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

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

Читайте также

Подпишитесь сейчас на нашу рассылку

Мы присылаем отличные материалы и никогда не спамим. Отписаться можно в любой момент