Эвристики нейродизайна: проектируем с учетом особенностей работы мозга

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

Мы рассмотрим несколько эвристик, которые, если использовать их с умом, могут повысить юзабилити, вызвать радость и побудить к действию.

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

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

Что такое эвристика?

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

Основы основ

Эвристики нейродизайна призваны дополнить (но не заменить) фундаментальные принципы проектирования. Многое в этой области уже сделано такими легендами, как Джейкоб Нильсен, Джилл Гердхарт-Повалс, Бен Шнейдерман и т.д. Их рекомендации — основа нашей работы. Вот они:

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

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

Основы нейродизайна

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

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

Доказательство визуального доминирования: прочитайте одно из слов — brainstorm или green needle, и вы услышите именно его. Есть аналогичная звуковая иллюзия со сценой из “Бойцовского клуба”

Быстрая и медленная обработка: В журнале Behaviour and Information Technology Journal вышла статья, в которой исследователи в области когнитивной психологии из Карлтонского университета сообщили, что люди принимают решение "нравится" или "не нравится" в отношении дизайна веб-страницы всего за 50 миллисекунд (Lindgaard et al., 2006). 

Причина — наша лимбическая система (отвечает за быструю обработку информации) и то, как она принимает большинство решений, с которыми мы сталкиваемся. Система медленной обработки информации требует больше усилий, обдуманности и, конечно, времени. Идея нейродизайна заключается в том, чтобы обратиться к системе быстрой обработки информации и как можно быстрее.

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

Внимание: Привлечь и удержать внимание — вот суть игры. Но что, если все играют в одну и ту же игру? Изучите, как работает визуальный контекст, чтобы создавать более эффективные интерфейсы.

Мотивация: Наконец, действия нет, пока нет мотивации. Как создавать интерфейсы, которые мотивируют людей к действию? Как стимулировать выделение нейротрансмиттеров, таких как допамин?

Итак, перейдем к эвристикам нейродизайна

1. Визуальный шум

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

• Без чего можно обойтись?
• Есть ли на странице конкурирующие цвета, яркость, текстуры?
• Можно ли сократить текст до более коротких абзацев и буллитов?
• Выстроили ли мы достаточно сильную визуальную иерархию?

2. Лица

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

• Используете ли вы изображения людей?
• Соответствуют ли эмоции этих людей бренду и основному сообщению?
• Смотрят ли они на CTA или другую важную информацию?

3. Яркость

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

• Есть ли на странице яркие элементы, которые не должны быть яркими (неважные)?
• Есть ли конкурирующие яркие элементы?
• CTA ярче, чем другие элементы дизайна?

4. Гештальт

Группируйте данные, чтобы быстро установить взаимосвязи между видимыми элементами.

• Используются ли визуальные характеристики единообразно?
• Есть ли четкий передний и задний план?
• Связаны ли родственные объекты визуально?
• Сгруппированы ли связанные элементы пространственно?
• Используется ли симметрия для объединения элементов, а асимметрия для создания фокусных точек?

5. Движение

Пользователи видят движение в первую очередь, но чрезмерное использование может приглушить его эффект.

• Есть ли в дизайне микровзаимодействия, которые привлекают внимание?
• Конкурируют ли микровзаимодействия друг с другом или с дизайном?
• Дают ли микровзаимодействия обратную связь или помогают понять, каким функционалом обладает тот или иной элемент?

6. Обратная связь

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

• Используется ли валидация полей в реальном времени?
• Полезна ли обратная связь?
• Является ли обратная связь негативной или недостаточной?

Общая картина: нейродизайн

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

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