55 сценариев для аудита мобильной версии сайта интернет-магазина. Чек-лист

Чем мобильная версия сайта отличается от десктопной в Е-commerce?

Для электронной коммерции по тем действиям, которые пользователь должен пройти, чтобы добраться до конца конверсионной воронки, мобильный сайт не сильно отличается от десктопной версии. Но сам путь клиента/Customer Journey Map или пользовательский опыт/User Experience точно будет у каждого свой.

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

На какую статистику стоит опираться?

Поданным, опубликованным в отчете Strategy Analytics в конце июня 2021 года, уже половина всего населения земного шара, а это около 4-х миллиардов человек, владеет смартфонами.

Если брать российские данные, то продажи смартфонов по итогам 2020 года выросли и составили 32 млн устройств. Об этом писали «Ведомости» со ссылкой на крупнейшие торговые сети.

По данным из различных источников, включая Яндекс и SaleCycle, доля трафика на мобильные устройства в разных сферах растет и на него приходится порядка 65% всего трафика электронной коммерции, хотя доля продаж составляет 53%. И такие тенденции роста скорее всего сохранятся.

Классические пользовательские UX сценарии в воронке продаж

Помимо базовых показателей, которые стоит проверять – скорости загрузки сайта и адаптивной верстки для M-commerce – существуют 3 основных пользовательских сценария или шага в воронке продаж. Так как подавляющее число клиентов у нас из Е-кома, мы протестировали эти шаги много раз:

    i.        Поиск товара

    ii.       Работа с карточкой товара

    iii.      Чек-аут. Совершение покупки

Еще к аудиту мобильной версии сайта добавляются: работа с каталогом и детали почек-ауту. Например, разные варианты оплаты, доставки и получения товара.

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

Для начала пройдёмся по основным и как их можно протестировать.

      i.        Поиск товара

А) Свободный тест

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

B) Готовый тест

‍Формулируем задание с определённым товаром, который нужно найти на сайте, проверяем сортировку или фильтры. Респонденту придётся пройти «самым коротким» путём, настроить правильно фильтры и найти товар.

С) Клик-тест

‍Проверяем, как пользователь ищет иконку, которая развернёт сортировку или фильтр, куда нажимает. Для мобильной версии – это частая проблема.

      ii.        Работа с карточкой товара

‍

А) Работа с изображениями

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

B) Работа со структурой и информацией

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

С) Стоимость и другие цифры

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

D) Пиктограммы и чёткие подписи

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

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

Проверка работы с карточкой товара заканчивается поиском кнопки (CTA – Call To Action), которая ведет к покупке.

‍

      iii.        Совершение покупки

‍

А) Работа с активными элементами

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

B) Заполнение форм

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

С) Карты и офисы доставки

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

‍

D) Оплата товара

При оплате товара у пользователя возникает волнение за сохранность данных, иногда не готовность вводить какие-то данные. Автоподстановка упрощает работу.

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

Наша рекомендация:

для начала пройдите самостоятельно путь клиента или закажите услугу тайного покупателя. Проверьте свои ключевые сценарии, где и на каком этапе Customer Journey Map пользователь может споткнуться. Для какого-то сайта поиск и оценка отзывов может оказаться ключом к повышению конверсии, а для кого-то этап заполнения формы или отслеживание (трекинг/tracking)товара, для кого-то смена шрифта или цвета и т.д. Правильных ответов нет.

Разбейте свою конверсионную воронку на отдельные действия и найдите эти действия в нашем Списке из 55 сценариев. Шаблоны подготовлены, чтобы сэкономить время. Они разбиты на группы в личном кабинете.

Пользуйтесь и совершенствуйте цифровой мир вместе с нами!

Список 55 сценариев ю-тестов по пути следования пользователя в воронке продаж. Чек-лист

1. Ориентирование в категориях каталога. Вариант 1

2. Ориентирование в категориях каталога. Вариант 2

3. Фильтрация по заданным параметрам

4. Сброс фильтров

5. Сортировка по заданному параметру

6. Изучение карточки товара в каталоге

7. Изучение страницы с подробным описанием товара

8. Поиск товара по заданным параметрам

9. Сравнение товаров

10. Ориентирование в подборках товаров

11. Добавление товара в избранное

12. Работа с изображением товара

13. Ориентирование в стоимости товара

14. Взаимодействие с чужими отзывами

15. Считываемость доступного кол-ва товара

16. Обращение в поддержку

17. Заказ в один клик

18. Добавление товаров в корзину

19. Удаление товара из корзины

20. Очистка корзины

21. Применение промокодов

22. Поиск ближайшей точки по карте

23. Понимание условий возврата товаров

24. Понимание условий программы лояльности

25. Понимание Push/SMS о статусе заказа

26. Считываемость баннеров

27. Перелистывание карусели

28. Отмена заказа

29. Треккинг заказа

30. Ориентирование в стоимости опций и заказа

31. Считываемость рекомендуемых товаров

32. Поиск заданной точки по карте

33. Оформление доставки

34. Смена города/региона

35. Работа с кликабельными тэгами

36. Оставление фидбека о товаре

37. Взаимодействие с видео о товаре

38. Передача ссылок и шеринг информации о товаре

39. Использование списка избранного

40. Повторение прошлых заказов

41. Редактирование профиля

42. Редактирование состава заказа в корзине

43. Изменений опций заказа

44. Выбор способа оплаты

45. Выбор способа получения товара

46. Считываемость экранов/сообщений об ошибке

47. Взаимодействие с всплывающими подсказками

48. Регистрация

49. Поиск товаров, похожих на просматриваемый

50. Считываемость продвигаемых товаров

51. Оформление самовывоза

52. Свободный поиск товара

53. Работа с поисковой строкой

54. Оплата заказа

55. Поиск товара через каталог

‍

Надеемся, что этот список пригодится вам в работе! Если нужно что-то протестировать по этим сценариям, обращайтесь, будем рады помочь!

‍

Елена Брумарова, Digital Marketing & UX Manager