Лекция «Стили в UX/UI: что вас ждет в 2025 году» ЛЕКЦИЯ 25 декабря

Как работает память пользователей и как это влияет на UX

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

Сегодня мы углубимся в тему памяти и разберем:

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

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

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

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

Что такое память?

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

Кратковременная память (STM)

Кратковременная память похожа на временное рабочее пространство. В ней хранится ограниченный объем информации (обычно около 7 элементов) в течение короткого периода времени (около 15–30 секунд). Этот тип памяти имеет решающее значение, когда нам нужно быстро обработать те или иные данные, например, запомнить телефонный номер и сразу же его набрать. Она мимолетна и требует постоянного внимания.

Долговременная память (LTM)

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

Как память влияет на опыт взаимодействия

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

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

Ключевые принципы работы памяти, применимые в UI/UX-дизайне

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

Эффект Струпа

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

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

Как этот эффект влияет на дизайн?

  • Цвет vs текст: Когда вы используете цвета, которые противоречат смыслу текста, это может запутать аудиторию. Яркий пример — важные инструкции или деструктивные действия, например, «Удалить», выделенные зеленым цветом вместо красного. В этом случае у людей возникнут проблемы с быстрой обработкой информации.
  • Читабельность: Выбирайте для текста цвета, которые легко отграничить от остального контента. Это поможет пользователям сосредоточиться на сообщении. Например, высококонтрастные сочетания (черный текст на белом фоне) способствуют более быстрому пониманию.
  • UX: Проектируйте интерфейсы, которые минимизируют когнитивную нагрузку. Позаботьтесь о том, чтобы люди могли быстро обрабатывать информацию и без лишних усилий следовать инструкциям. Это сделает опыт взаимодействия более комфортным и эффективным.
Дашборд, который минимизирует когнитивную нагрузку, от Conceptzilla

Разбивка на фрагменты (chunking)

Это способ организации данных, предполагающий их разбивку на более мелкие, простые для восприятия фрагменты (chunks). Например, нам проще запомнить номер телефона в формате 123-456-7890, а не 1234567890. Группируя цифры, человеческий мозг эффективнее обрабатывает и запоминает информацию.

Психолог Джордж А. Миллер предположил, что среднее количество объектов, которые мы можем одновременно удерживать в рабочей памяти, составляет 7 ± 2. Это означает, что нашему мозгу удобнее всего работать с 5–9 фрагментами контента. Ограниченная ёмкость рабочей памяти влияет на то, как мы принимаем решения, обрабатываем информацию и запоминаем ее.

Какое значение это имеет для дизайна?

  • Упрощение: Разбивайте сложный контент на простые для восприятия фрагменты. Так пользователям будет легче понять и запомнить ключевые идеи.
  • Повышение вовлеченности: Хорошо организованный контент помогает поддерживать вовлеченность и удовлетворенность пользователей. В этом случае людям проще обрабатывать представленную информацию и действовать в соответствии с ней.
  • Снижение когнитивной нагрузки: Не перегружайте пользователей информацией. Чем меньше путаницы, тем легче им выполнять стоящие перед ними задачи.
Разбитая на фрагменты информация в мобильном приложении Agriculture Assistant от Conceptzilla

Закон Хика

Чем шире выбор, тем больше времени нам требуется, чтобы принять решение. А иногда мы и вовсе не способны это сделать. Если вариантов всего 2, определиться легко, а если их 10, это занимает больше времени и чревато так называемым «аналитическим параличом», когда пользователь долгое время не может принять решение и откладывает этот процесс. Поэтому в UX некоторые ограничения просто необходимы.

Как этот закон отражается в дизайне?

  • UX: Позаботьтесь о том, чтобы пользователям было легко найти то, что они ищут. Если вариантов будет слишком много, люди могут почувствовать себя перегруженными и вовсе отказаться от выполнения задачи.
  • Ясность и фокус: Необходимо ограничить количество опций или упорядочить их. Так вы поможете клиентам быстрее принимать решения, повысите их удовлетворенность и улучшите юзабилити.
  • Эффективность: Чем проще будет выбор, тем быстрее люди смогут двигаться вперед. Это особенно важно в тех случаях, когда время имеет значение, например, при оформлении заказа онлайн или в чрезвычайных ситуациях.
Упрощенный выбор в мобильном приложении Capsule Hotel Booking от Conceptzilla

Эффект последовательного позиционирования

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

  • Эффект первичности (primacy effect): Мы с большей вероятностью запомним несколько элементов в начале списка, потому что они первыми привлекают наше внимание и у нас есть больше времени на их обработку.
  • Эффект новизны (recency effect): Мы также склонны запоминать последние несколько элементов в списке, потому что они еще свежи в нашей памяти.
  • Элементы в середине списка запоминаются хуже всего.

Как эти особенности человеческой памяти влияют на дизайн?

  • Размещайте важную информацию в начале или в конце. Так пользователи скорее запомнят ключевые моменты.
  • Организованный лейаут повышает запоминаемость информации. Например, верхние и нижние пункты в списке функций откладываются в памяти лучше всего.
  • Управляйте вниманием аудитории: Используйте визуальное оформление (например, размер, цвет, расположение), чтобы выделить первый и последний фрагменты информации.
  • Правильное расположение элементов повышает вовлеченность пользователей и упрощает принятие решений — будь то меню, призыв к действию или список товаров.
Списки на SaaS-платформе Team Management от Conceptzilla

Теория когнитивной нагрузки

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

Существует три типа когнитивной нагрузки:

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

Как эта теория влияет на дизайн?

  • Упрощение: Снижая внешнюю нагрузку, вы помогаете пользователям сосредоточиться на главном.
  • Четкая коммуникация: Представляйте информацию в доступной и лаконичной форме, чтобы пользователи могли легко ее понять и запомнить. Простой язык и визуальные образы помогают минимизировать когнитивную нагрузку.
  • Прогрессивное раскрытие: Вместо того чтобы давать всю информацию сразу, раскрывайте ее постепенно. Пошаговый процесс позволяет контролировать внутреннюю нагрузку и обеспечивает адекватный темп обучения.
  • Эффективные инструменты обучения: Теория когнитивной нагрузки помогает создавать более качественные учебные материалы, что особенно актуально, если вы проектируете обучающее приложение. Например, пользователям будет проще понять сложные концепции, если вы дополните текстовый контент наглядными изображениями.
  • Принятие решений: Логично организованная информация снижает умственную нагрузку и помогает пользователям быстрее принимать решения, будь то покупка товара или навигация по сайту.
Пошаговое руководство в приложении Sport App от Shakuro

Рекомендации для UI/UX-дизайнеров

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

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

Вот несколько лучших практик, которые помогут повысить запоминаемость продукта:

Повторение и последовательность

Повторение помогает закрепить материал в памяти. Именно поэтому наш дизайн должен быть последовательным в каждом элементе. Это позволит пользователям сформировать ментальные модели взаимодействия с интерфейсом.

Советы:

  • Придерживайтесь одних и тех же паттернов: Используйте единые стили, цвета и шаблоны навигации на всех страницах и экранах, чтобы сделать продукт понятным и привычным.
  • Обеспечьте предсказуемость: Добавьте узнаваемые иконки и повторяющиеся действия (например, свайпы, кнопки в одних и тех же местах) на разных экранах, чтобы сделать взаимодействия более предсказуемыми.
Последовательные элементы в дашборде от Shakuro

Визуальное кодирование

Визуальные образы запоминаются лучше, чем текст. Ученые считают, что мозг может обрабатывать изображения примерно в 60 000 раз быстрее, чем аналогичный объем текстового контента.

Советы:

  • Используйте иконки и картинки: Выбирайте понятные, содержательные изображения, связанные с темой. Избегайте слишком сложной графики, которая может запутать пользователей.
  • Цвет и контраст: Выделяйте важную информацию и ключевые элементы при помощи контрастных цветов, чтобы упростить запоминание.
Яркие акценты в дашборде от Shakuro

Аффордансы и указатели

Мы можем дополнять элементы четкими указателями (signifiers), чтобы сделать их интуитивно понятными. Свойства объектов, которые подсказывают, как с ними взаимодействовать, называются «аффордансами». Термин был предложен основателем Nielsen Norman Group Доном Норманом.

Советы:

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

Эффект первичности и новизны

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

Советы:

  • Разместите наиболее важную информацию (например, ключевые этапы процесса) в верхней или нижней части интерфейса.
  • Убедитесь, что важные кнопки (например, «Отправить» или «Далее») отображаются на видном месте в начале или в конце сценария.
Важная информация в приложении Contact Manager от Conceptzilla

Обратная связь и подкрепление

Подкрепление действий посредством обратной связи усиливает воспоминания, связанные с этими действиями.

Советы:

  • Обеспечьте немедленную обратную связь: Убедитесь, что действия (например, нажатия или отправка формы) вызывают немедленную обратную связь в виде анимации, звуков или визуальных изменений (например, сообщение «Поздравляем!» после выполнения задачи).
  • Добавьте деликатные напоминания или уведомления для действий, о которых пользователи могут забыть (например, предупреждение о несохраненных изменениях).
Визуальная обратная связь в боковой панели от Conceptzilla

Пространственная память

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

Советы:

  • Привычный лейаут: Используйте стандартные паттерны (например, верхние панели навигации или нижние панели вкладок), чтобы людям не приходилось учиться ориентироваться в интерфейсе с нуля.
  • Логичная иерархия: Организуйте информацию таким образом, чтобы пользователи могли интуитивно понять, где искать нужный контент.
Организация информации в дашборде от Conceptzilla

Заключение

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

Источник
и
:
arrow