Как ускорить корзину сайта на Битрикс и получить +264% к заказам
Привет! С вами Евгений Александров и команда ITC CODES, сегодня расскажем про способ повышения конверсии из заказа в оплату с помощью модернизации корзины на одном из наших проектов.
Задачи проекта
Разберем детальнее кейс на примере реальной задачи на проекте интернет-магазина детских игрушек «БэнниХилл». Все началось с того, что с первых месяцев работы с проектом нас беспокоила корзина сайта, написанная на стандартном компоненте Битрикса
и дополнительно кастомизированная.
Основные типы проблем, которые мы выявили в ходе анализа ее работы:
- В самой корзине не было структуры, и визуального разделения на шаги:
- Порядок шагов не был визуально показан и клиенту необходимо было додумывать, как перейти на следующий шаг оформления заказа:
- Выбор упаковки тоже был неудобен и про неё вообще мог забыть клиент, так как она была на последнем шаге после выбора оплаты, что вовсе нарушает логику:
- Загрузка корзины при выборе способа доставки занимала до 5-10 секунд;
- Также временами без объяснения причин возникали: ошибки в расчете стоимости доставки, товары не добавлялись и не удалялись из корзины.
Решение
Мы предложили разработать новый компонент для проекта, который ускорит работу корзины и избавит ее от багов. Вместо рефакторинга мы решили создать совершенно новый комплексный компонент.
Важно было сразу же провести редизайн корзины, чтобы захватить проблему с адаптивностью и удобством для пользователей, которая страдает даже в стандартном компоненте. В итоге было принято решение написать корзину на стеке Vue.js с BackEnd API на основе CMS 1C-Bitrix.
Бизнес-аналитика
В заказанном клиентом дизайне корзина состояла из трёх шагов с адаптивными версиями: состав заказа, доставка, оплата.
Этап 1. Проектирование и написание ТЗ
Мы построили блок-схему работы корзины, чтобы учесть все пользовательские сценарии сайта, и на её основании составили подробное техническое задание (ТЗ) на разработку. В ТЗ мы постарались учесть все возможные пути пользователя и логику работы.
Этап 2. Реализация ТЗ
В новой корзине работают добавление товара, точное начисление/суммирование скидок, взаимодействие с промокодами.
Появилась возможность включать и выключать выбор подарочной упаковки сразу в составе заказа.
В рамках программы лояльности начисляются бонусные баллы — за каждые 50 рублей от стоимости товара начисляется 1 балл, который можно списать при следующих покупках, за исключением стоимости доставки.
Теперь можно управлять из административной панели всеми способами доставки и оплаты.
Проблемы, с которыми столкнулись
Основная проблема возникала при тестировании корзины. Как упоминалось ранее, не все пользовательские сценарии были учтены в блок-схеме, что затянуло тестирование. После добавления недостающих сценариев:
- Покупка товара с оплатой бонусами;
- Покупка товара с бонусами и оплатой через Юкассу;
- Покупка товара с оплатой бонусами с платной доставкой;
- Добавление подарочного товара в корзину.
По итогу тестирование прошло успешно. После функционального тестирования мы открыли корзину для реальных пользователей, чтобы собрать обратную связь. Возникающие баги оперативно исправлялись.
Выводы
В результате нам удалось собрать очень логичную и быструю корзину, которая несомненно помогла многим пользователям быстро и без труда совершать покупки.
Новая корзина позволила:
- Ускорить оформление заказа. Теперь проверка проходит быстрее, и в старой корзине PageSpeed не мог определить скорость страницы из-за долгой загрузки.
- Хранить информацию о клиенте и адрес предыдущего заказа. В старой корзине данные пользователя брались из личного кабинета.
- Определять геолокацию клиента и рассчитывать срок и стоимость доставки. В старой корзине не было определения местоположения.
- Давать возможность выбрать подарок к заказу, чего не было в старой корзине.
- Упростить логику пошагового оформления заказа, разделив корзину на три шага: данные, доставка, оплата.
Корзина наконец работает быстро, без багов и негативных отзывов от клиентов. Есть факт роста конверсии.
Хотелось бы показать скриншоты из систем аналитики, но корзина доступна только после авторизации, что затрудняет наблюдение за поведением трафика.
Однако, данные по товарообороту интересны: с 01.04.23 по 01.06.23 интернет-магазин получил 882 оплаченных заказа, тогда как за аналогичный период 01.08.22–01.10.22 — только 344 заказа. Совпадение? Не думаем.
Материал статьи подготовила команда ITC CODES