UX – (User Experience – опыт пользователя) – опыт/впечатление пользователя от работы с интерфейсом мобильного приложения/сайта.

Основная цель UX-дизайна: сделать так, чтобы пользователь максимально просто и быстро решил задачи, которые он ставил, заходя на сайт/в приложение.

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

UX МОБИЛЬНОГО САЙТА

ДИЗАЙН

  • Минималистичный дизайн;
  • Сократите цветовую палитру до минимального количества цветов. Google советует использовать 2 контрастных цвета и их оттенки;
  • Используйте минимальное количество шрифтов. В идеале – один.

НАВИГАЦИЯ

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

Телефон

Телефон должен быть кликабелен. Не утруждайте пользователя совершать лишние действия: выделять номер, копировать его и вставлять в поле ввода номера. Это неудобно.


Локация

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


Регистрация

  • Включите возможность авторизации и/или регистрации через соцсети. Чем их будет больше, тем лучше;
  • Заявки должны содержать минимальное число полей;
  • Используйте автозаполнение, везде, где возможно;
  • Правильные инпуты для разных полей (email, даты рождения, телефона и т.д.). Там, где нужно вводить только цифры, наличие буквенных символов излишне;
  • Мгновенные сообщения при заполнении формы, чтобы пользователю не приходилось скролить страницу и возвращаться к неправильно заполненным полям.

МЕДИАФАЙЛ

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


УВЕДОМЛЕНИЯ

  • Появление запроса на предоставление информации о местонахождении при заходе на сайт. Ответив “да”, пользователь должен увидеть, где и/или на каком расстоянии от него располагается ближайший магазин/ресторан/офис;
  • Отправка push-уведомлений. Пусть пользователи получают сообщения о появлении выгодных предложений, скидок, напоминания о неоплаченных товарах в корзине, данные о заказе и т.д.;
  • Будьте честны с пользователем. Объясняйте, зачем требуете ту или иную информацию (если это неочевидно).

ОПЛАТА

  • Обеспечьте несколько вариантов оплаты;
  • Возможность подтверждения покупки при помощи Touch ID.

Поиск

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


ССЫЛКА НА ПРИЛОЖЕНИЕ

Ссылка на мобильное приложение должна вести сразу в стор.


UX МОБИЛЬНОГО ПРИЛОЖЕНИЯ

ДИЗАЙН

  • Создайте минималистичный дизайн интерфейсов;
  • Не увлекайтесь разнообразием цветов. Достаточно одного яркого цвета, остальные пусть будут спокойными и не раздражающими;
  • Дизайн должен быть адаптирован под ЦА продукта. Например, если ваше приложение предназначено для детей, вы можете позволить себе более яркие оттенки, а если для пожилых – то стоит позаботиться, чтобы шрифт был достаточно крупным даже для людей с плохим зрением;
  • Если у вас также есть сайт, постарайтесь привести дизайн мобильного сайта и приложения к “единому знаменателю”. Так аудитория сможет эффективнее использовать и то и другое, опираясь на опыт работы с одной из платформ.

НАВИГАЦИЯ

  • Навигация должна соответствовать контенту. В большинстве случаев значки и иконки более оправданы, чем кнопки с текстом;
  • Управление должно быть интуитивным и основанным на расположении руки;
  • Значимые кликабельные элементы нужно расположить в области экрана, которая доступна для нажатия большим пальцем. Функции “отмены”, “выхода” и “удаления” должны располагаться в труднодоступных областях экрана, чтобы пользователь не нажал на них случайно;
  • Не усложняйте интерфейс дополнительными разделами и переходами. Не заставляйте пользователя совершать лишние действия, чтобы найти нужную информацию. Не стоит разносить по разделам ту информацию, которую можно поместить на одном экране;
  • Используйте свайп для смены экранов с различной информацией (в рамках одного раздела) или для совершения действий внутри приложений (удаление, отмена предыдущего действия, архивация и т.д.);
  • Ненавязчивые анимационные элементы при переходе между экранами или смысловыми блоками приложения улучшают впечатление пользователя от взаимодействия с приложением.

FREE-ВЕРСИЯ

Не делайте free-версию приложения бесполезной: не ограничивайте большинство функций и не слишком сокращайте время тестового периода.


ОНБОРДИНГ

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

РЕГИСТРАЦИЯ

  • Откажитесь от регистрации, если она не обязательна;
  • Если же она все-таки нужна, постарайтесь сделать ее максимально короткой;
  • Включите возможность авторизации и/или регистрации через соцсети. Чем их будет больше, тем лучше;
  • Используйте подсказки и предусмотрите автозаполнение, везде, где возможно;
  • Внедрите соответствующие инпуты для разных полей (email, даты рождения, телефона и т.д.). Там, где нужно вводить только цифры, наличие буквенных символов излишне;
  • Предусмотрите мгновенные сообщения при заполнении формы, чтобы пользователь возвращался к неправильно заполненным полям;
  • Обеспечьте сохранение заполненных регистрационных полей.

Поиск

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


УВЕДОМЛЕНИЯ

  • Если в вашем приложении есть push-уведомления, разрешите пользователям регулировать их получение. Например, выбрать время получения или отказаться от них совсем;
  • Включите запрос на определение локации пользователя, если это поможет вам предоставить ему полезную информацию (местонахождение ближайших ресторанов, точек продаж и т.д.);
  • Будьте честны с пользователем. Объясняйте, зачем требуете ту или иную информацию (если это неочевидно).