В этой статье на примере интернет-магазина мы подробно рассмотрим и обсудим возможные причины, по которым покупатели бросают свои онлайн-корзины. Мы также проанализируем возможные решения для каждого конкретного случая.
Sunuva — это мировой бренд детской одежды, основанный в 2007 году. Сегодня их продукция представлена в известных магазинах класса люкс, таких как Bloomingdale’s, Harrods, Barneys, Harvey Nichols и других сетях роскошных универмагов. Это отличный пример того, как мы с командой Turum-burum провели UX аудит. А затем на основе данных аналитики внесли корректировки в UX дизайн, которые дали хорошие результаты.
UX аудит и поддержка по внедрению улучшений
Так как у Sunuva уже была команда разработчиков, задача состояла в том, чтобы провести тщательный UX аудит и оказать дальнейшую поддержку по внедрению предложенных решений.
Компания наняла Turum-burum для выполнения следующих задач:
- Проведение тщательного аудита юзабилити, включая изучение каждой детали сайта.
- Объяснение проблем, с которыми сталкиваются пользователи, и предложение оптимальных решений.
- Предоставление консультаций команде разработчиков клиента по любым дизайн-вопросам.
Мы провели тщательный аудит сайта с применением инструментов анализа данных, записей экрана пользователей Hotjar и карты кликов, а также информации, предоставленной заказчиком.
Процесс реализации проекта состоял из трех основных этапов:
- UX аудит десктопной и мобильной версий сайта.
- Проведение интервью с представителями бизнеса.
- Предоставление дальнейшей поддержки и консультаций по любым вопросам, связанным с UX дизайном проекта.
После завершения аудита мы сделали следующее:
- Представили перечень проблем в разрезе каждой ключевой страницы.
- Расставили приоритеты.
- Предоставили детальное предложение по оптимизации UX дизайна. К каждой предложенной корректировке были приложены примеры и объяснение того, как она может помочь улучшить взаимодействие с пользователем.
Ключевые проблемы и рекомендации
Анализ метрик веб-сайта показал, что показатели вовлеченности, состав трафика, коэффициент конверсии как для новых, так и для вернувшихся пользователей, количество отказов от корзины и выходов с сайта для данного сегмента находятся в пределах нормы.
Тем не менее, мы обнаружили несколько проблем, которые требовали решения. Среди них были ошибки интерфейса, которые отрицательно сказывались на ключевых бизнес-показателях и препятствовали конверсии. К основным точкам роста относятся:
- Повышение конверсии мобильной версии сайта.
- Увеличение количества просмотров страниц с описанием товара.
- Увеличение скорости добавления товара в корзину в десктопной версии.
- Сведение к минимуму количества брошенных корзин.
- Увеличение процента оформленных заказов.
Наиболее критическими точками, которые мы обнаружили, были следующие:
- Структура каталога.
- Отсутствие предотвращения ошибок пользователей.
- Подводные камни на странице оформления заказа.
- Отсутствие акцентов в элементах хедера.
- Отсутствие раздела «Недавно просмотренные».
- Неразборчивые названия категорий.
Все эти проблемы изложены и подробно описаны ниже. Давайте приступим к их анализу!
Структура каталога
Проблема
В каталоге было представлено много совершенно разных товаров. Таким образом пользователям было сложно находить то, что им нужно. На основе данных тепловых карт стало понятно, что люди часто прибегали к фильтрации — выбирали размер (возраст) и пол. Те, кто никогда не пользовался фильтром, с трудом находили нужные товары в каталоге. По данным аналитики только 37% покупателей нашли в каталоге товар, который искали, заинтересовались им и решили перейти на страницу с описанием товара.
Рекомендации
Для того, чтобы упростить поиск товаров, необходимо добавить быстрые теги с группами (например, Мальчики, Девочки, Малыши, Дети, Подростки; Шорты, Костюмы, Жилеты). Также рекомендуется по умолчанию показывать расширенный фильтр с указанием размеров одежды и пола, чтобы пользователи могли его быстро найти и воспользоваться им. Это должно сократить время, необходимое для поиска. В мобильном телефоне кнопка фильтра всегда должна оставаться в фиксированном положении по мере прокрутки пользователем страницы вниз.
Ошибки пользователей
Проблема
Если пользователи нажимали кнопку «Добавить в корзину» без предварительного выбора размера, то уведомление об ошибке не появлялось. Это вынуждало их вернуться, выбрать размер и повторно нажать кнопку «Добавить в корзину».
Рекомендация
Всякий раз, когда покупатели забывают выбрать размер и нажимают кнопку «Добавить в корзину», перед ними автоматически должен открываться список с размерами. Как правило, покупатели переключают свое внимание на него.
Решение: пользователи не только получают уведомление об ошибке, но их также возвращают на страницу товара, чтобы они могли выбрать правильный размер одежды.
Решение: внедрение этой функции в мобильную версию сайта.
Подводные камни на странице оформления заказа
Проблема
При переходе на страницу оформления заказа пользователи видели уведомление о том, что им необходимо докупить еще что-нибудь, чтобы доставка была бесплатной. Это вынуждало их покинуть страницу оформления заказа и продолжить покупки. В этом случае покупатели могли вообще ничего не купить. По данным аналитики до 38% пользователей не покупали выбранный ими товар, и, скорее всего, именно по этой причине.
Рекомендация
Уведомление о том, что для бесплатной доставки не хватает определенной суммы, не следует показывать на странице оформления заказа. Наличие индикатора прогресса при добавлении товара в корзину или информационного сообщения о бесплатной доставке будут способствовать улучшению взаимодействия с пользователем.
Отсутствие акцентов в элементах хедера
Проблема
В элементах хедера неправильная расстановка акцентов смущала многих пользователей. Эта проблема портила впечатление покупателей о бренде.
Рекомендации
- Следует визуально разделить такие элементы, как «Валюта», «Избранное», «Поиск», «Личный кабинет» и «Корзина».
- Необходимо в первую очередь выделить категории каталога.
- Пункты «Валюта» и «Избранное» следует расположить с одной стороны от логотипа, а «Поиск», «Личный кабинет» и «Корзину» — с другой. Это поможет пользователям сразу увидеть наиболее важные части сайта и сократит время на поиск необходимых товаров.
Проблема
В бургерном меню было сложно отличить категории каталога от информационных категорий. Пользователям приходилось тратить время на поиск нужной категории.
Рекомендация
Следует создавать визуальное отличие между категориями каталога и информационными категориями. Необходимо сделать меньший акцент на последних. Это поможет пользователям сосредоточиться на категориях товаров и быстрее находить нужные позиции.
Отсутствие раздела «Недавно просмотренные»
Проблема
На сайте не было блоков или списков с Недавно просмотренными товарами и быстрой кнопки «Добавить в корзину». Если покупатели уже видели какие-то товары, то они с большей степенью вероятности будут готовы их купить. При этом пользователи не захотят тратить время на поиск тех товаров, которые им понравились в прошлый раз. Этот фактор значительно влияет на конверсию.
Рекомендация
Следует добавить карточки с недавно просмотренными товарами. В составе каждой из них должна быть кнопка «Добавить в корзину». Этот раздел следует разместить в десктопной версии и закрепить в мобильной. Это поможет пользователям быстрее находить интересующие их товары.
Неразборчивые названия категорий
Проблема
Пользователи никогда не нажимали на категории товаров, потому что им было слишком трудно разобрать их названия. К тому же они считали, что эти блоки являются частью рекламного баннера. По этой причине людям было сложно быстро найти нужные товары и требовалось больше времени на их поиск.
Рекомендация
Следует изменить внешний вид названий и самих категорий. Их нужно визуально отделить от рекламного баннера, чтобы пользователи знали, что они кликабельны и ведут в каталог.
Результаты работы, проделанной на сайте Sunuva
Наша команда использовала аналитические инструменты, записи сеансов пользователей, тепловые карты и другие данные о покупателях для выполнения поставленных задач и разработки рекомендаций. В результате клиент сообщил об увеличении коэффициента конверсии и посещаемости сайта после того, как все предложения были реализованы.
«Работа Turum-burum привела к увеличению конверсии и посещаемости сайта. Проактивные и внимательные к деталям, они нашли время, чтобы изучить все доступные данные, предоставить объяснение всех проблем и оптимальные решения. Они оказывали всестороннюю поддержку и были прозрачными во всех своих действиях».
— Дженнифер Талли, менеджер интернет-магазина, Sunuva
Какие изменения необходимо внести в UX/UI, чтобы увеличить коэффициент конверсии?
Мы покажем вам семь простых шагов, которые вы можете выполнить, чтобы самостоятельно провести UX аудит. Он поможет найти и устранить некоторые ошибки интерфейса:
- Исследуйте пути пользователей. Совершайте покупки, как будто вы посетитель сайта.
- Анализируйте микро- и макроконверсии. Используйте Google Analytics и Google Tag Manager.
- Проводите исследование потенциальных покупателей. Каков портрет вашей целевой аудитории?
- Проводите технический аудит. Все ли работает на сайте?
- Проверяйте тепловые карты и карты кликов. Для этих целей могут быть полезны Hotjar и Plerdy.
- Отсматривайте записи сеансов пользователей.
- Анализируйте отзывы (Hotjar, Survio).
После прохождения всех этих этапов, сформулируйте несколько гипотез о том, как можно улучшить сайт. Расставьте приоритеты в соответствии с их влиянием на конверсию. После этого начните проверять гипотезы с помощью A/B-тестирования или отслеживания изменений в аналитике. Этот процесс можно повторять бесконечно.
Конверсия, которую совершают пользователи, уже посетившие сайт, будет стоить бизнесу гораздо дешевле, чем привлечение новых покупателей с помощью маркетинговых инструментов. Вот почему следует постоянно работать над улучшением интерфейса. Так компания сможет соответствовать новым бизнес-целям, рыночному спросу и моделям поведения пользователей.
