Микровзаимодействия мы обычно не замечаем, но имеем дело с ними много раз в день. Например, провести пальцем по экрану смартфона, чтобы обновить страницу или воспроизвести видео — это микровзаимодействие.
UX-дизайн постоянно развивается. В настоящее время мы можем работать с минимальными взаимодействиями в пользовательском интерфейсе. При профессиональном подходе к процессу микровзаимодействия чрезвычайно полезны и помогают улучшить взаимодействие с пользователем.
Итак, давайте прочитаем нашу статью, чтобы подробнее узнать о микровзаимодействиях.
Что такое микровзаимодействия?
СХЕМА РАБОТЫ МИКРОВЗАИМОДЕЙСТВИЙ
Микровзаимодействия — это небольшие действия, которые имеют единственную цель — удовлетворение пользователя. Такие микровзаимодействия можно представить в виде небольших анимаций. Но главная цель — сообщить пользователю, что действие или задача выполнены.
Три основные задачи микровзаимодействий:
- Не допустить ошибки пользователя;
- Сообщать о результате действий;
- Подтолкнуть выполнить конкретную задачу.
Три основы микровзаимодействий
При работе с микровзаимодействиями возникают три фундаментальных вопроса:
- Что может случиться?
Пользователи должны знать, что может случиться, если они начнут действовать. Например, проведя пальцем влево в Gmail, можно добавить электронное письмо в архив. Об этом свидетельствует значок на зеленом фоне.
- Что происходит сейчас?
Используйте сопровождающие анимированные микровзаимодействия при выполнении определенной последовательности действий. Например, регистрация. Лучше всего проинформировать пользователя о точности его действий и результате.
Например, при входе в учетную запись. Если вы введете данные неправильно, вы узнаете об этом по красному предупреждению.
- Что уже произошло?
После выполнения микровзаимодействия пользователь должен знать результат действия, например, кнопку «Follow» в Instagram.
Как работают микровзаимодействия
Микровзаимодействия можно разбить на четыре компонента:
Триггер
Триггерызапускают взаимодействие. Есть два типа триггеров:
- срабатывает по инициативе пользователя (или срабатывает вручную)
- системные триггеры
Ручные триггеры активируются при намеренном взаимодействии с продуктом. Например: нажатие кнопки или встряхивание телефона.
Системные триггеры устанавливаются автоматически, если выполняются условия, необходимые для срабатывания триггера — например, короткий звуковой сигнал при получении электронного письма.
Правила
Правила — это условия, при которых происходят микровзаимодействия. Например, что произойдет, если пользователь щелкнет здесь?
Обратная связь
Обратная связьинформирует пользователя о том, что действие было завершено. Это может быть звуковой сигнал, вибрация или визуальное оповещение.
Циклы и режимы
Цикл — это продолжительность микровзаимодействий.
Будут ли микровзаимодействия повторяться? Например, вы получите электронное письмо с просьбой подтвердить свой номер телефона или ввести код из SMS или электронного письма при регистрации. Это действие занимает определенное время, и если оно завершится, вы будете проинформированы об этом.
Режимы изменяют обычное действие функций. Например, функция «Не беспокоить» на вашем смартфоне.
Преимущества микровзаимодействий
А как насчет преимуществ микровзаимодействий? Давайте посмотрим, как микровзаимодействия улучшают UX-дизайн вашего веб-сайта и мобильного приложения.
Упростите навигацию
Главное правило — микровзаимодействия — это не украшение. Вместо этого каждый из них служит определенной цели и задаче. Таким образом, одна из функций микровзаимодействия — быстрое и удобное использование продукта. Другими словами, чтобы направлять пользователей от операции к операции и подсказывать, что делать дальше или вернуться к предыдущему действию.
Сделайте ваш продукт запоминающимся
Качественно выполненное взаимодействие выполняет не только свою прямую задачу по помощи и предупреждению пользователя. Эта небольшая дизайнерская составляющая сделает ваш продукт узнаваемым на рынке.
Вспомните значок у Facebook «Нравится». Это маленькое анимированное микровзаимодействие стало визитной карточкой компании.
Микровзаимодействия в UX делают его ощутимым
«Детали — это не детали. Они создают дизайн ».Чарльз ИмсПо мнению Дэна Саффера, успех цифровых продуктов определяется мелочами.
Основываясь на его исследованиях, мы можем утверждать, что цифровой продукт состоит из функций и деталей. Характеристики — это функции, которые может выполнять продукт, и, как следствие, мотивировать пользователя использовать продукт. Детали — это небольшие дизайнерские решения, которые делают продукт уникальным и делают UX целостным. Микровзаимодействия — это те детали, которые позволяют пользователям «прикоснуться» к UX-дизайну. Другими словами, микровзаимодействия — это мост, соединяющий людей и технологии, цифровой опыт и реальные действия.
Разрешить пользователю контролировать ситуацию
Джейкоб Нильсон сформулировал десять основных правил дизайна пользовательского интерфейса. Один из них заключается в том, что пользователь должен знать, что происходит и что произойдет. Этого можно достичь за счет микровзаимодействий. Добавляя небольшие анимированные движения к функциональным элементам, вы, как дизайнер, даете пользователю чувство контроля и четкое представление о том, что каждый щелчок вызывает действие. Это делает ваш продукт удобным в использовании и побуждает пользователя использовать его снова.
Советы по разработке микровзаимодействий для улучшения UX
Много работы делается ради приверженности пользователей продукту. Микровзаимодействия — один из способов добиться желаемого взаимодействия. Давайте обсудим, как улучшить UX-дизайн с помощью микровзаимодействий.
- Помните, что анимация предназначена не только для макета сайта, но и играет функциональную роль, которая будет более полезной для пользователя.
- Подумайте об опыте пользователей. Ощущения, которые они получают от использования продукта, напрямую связаны с дальнейшим сотрудничеством. Если опыт, полученный во время взаимодействия с продуктом, будет приятным и запоминающимся, это гарантирует, что пользователи вернутся.
- Не усложняйте. Сделайте микровзаимодействия максимально увлекательными и понятными. Пользователь должен понимать, что ему делать с предлагаемыми функциями.
- Многофункциональность — не значит хорошо.
- Не перегружайте сайт анимацией. В таких случаях можно получить негативный эффект. Большое количество анимированных микровзаимодействий может раздражать пользователя.
- Представьте себя на месте пользователя. И исходя из этого постарайтесь сделать все удобным и понятным. Не забывайте о переходах между анимациями. Они должны быть плавными и точными.
Заключение
Микровзаимодействия — это мелкие детали, которые существенно влияют на успех продукта. Они помогают пользователю не потеряться на сайте и делают ваш продукт законченным, создавая общую картину.
Микровзаимодействия способствуют лучшей конверсии сайта, поэтому стоит уделять ему особое внимание во время разработки.
0 комментариев