Исходный вариант

К первоначальному варианту карточки товара мы решили добавить сведения, способствующие принятию решения о покупке. Помимо этого, мы упростили и сделали более логичным процесс добавления товаров в корзину.

В исходном варианте в карточке присутствовали следующие элементы:

• Вкладки
• Сопутствующие товары
• Рекомендованные товары

Отзывы о товаре были выведены не со всех карточках.

Рабочие гипотезы

Во время работы по изменению дизайна карточки товара было выдвинуто две гипотезы:

1. Не стоит отвлекать пользователя от товара, которым он заинтересовался. Карточка товара должна размещаться по всей ширине экрана, при этом боковое меню можно исключить. Присутствующее на сайте выпадающее меню полностью повторяет боковое, в связи с чем особой необходимости в боковом меню нет.
2. Зная, что средняя корзина включает обычно около 20-50 позиций, необходимо предоставить пользователю широкие возможности для навигации по каталогу. По нашему мнению, наличие бокового меню позволит легче перемещаться по разделам сайта и набрать нужное количество товара.

Разработка нового дизайна

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

В оба варианта дизайна мы включили развёрнутую информацию о доставке и оплате. Это позволило сделать карточку более продающей, чтобы пользователь сразу мог понять, как совершить покупку и оплатить заказ. Мы избавились от вкладок, которые были не всегда очевидным для целевой аудитории. Получившаяся страница стала длиннее, но благодаря грамотному цветовому кодированию и правильно расставленным акцентам важная информация не потерялась, а все полезные дополнительные данные расположились на 2-3 экране.

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

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

Вариант без бокового меню

Вариант с боковым меню

A/B-тестирование

Тестирование мы запустили с использованием функционала системы управления содержимым сайта «1С-Битрикс» и с помощью сервиса Google Analytics.

Настройки для теста были установлены такие: в эксперименте участвует 100% трафика, вывод дизайна карточек произвольный. Вариант дизайна, на который попал пользователь, сохраняется в кэше, поэтому в дальнейшем пользователь видит только его.

Период тестирования было решено условно определить в 1 неделю, полагая, что к этому моменту должен определиться лидирующий вариант. Согласно статистическим данным, выборка является достоверной, если будет совершено порядка 30 000 сеансов для каждого варианта дизайна. Текущий трафик на сайт позволял набрать необходимое количество в заданный срок. В итоге полученные через неделю результаты были достаточно очевидны, и мы приняли решение о прекращении теста.

Результаты

С самого начала тестирования вариант нового дизайна с боковым меню заметно лидировал по объёму продаж. Через 1 неделю разрыв сократился, статистические погрешности были нивелированы.

• По количеству транзакций (заказов) оба новых варианта лидировали примерно по 15% по сравнению с исходным.
• По доходу вариант без бокового меню и исходный вариант приблизительно равны. При этом доходность варианта с боковым меню оказалась на 30% больше, чем у двух других.

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

Подробнее читайте на нашем сайте: http://bquadro.ru/portfolio/promotion/vsenitki_test?utm_source=cmsmagazine&utm_medium=cases&utm_campaign=vsenitki_test

Перейти на сайт