С детства мы знаем: "от перестановки слагаемых сумма не меняется". Но почему это не работает в вебдизайне? Как расположение элементов на странице влияет на поведение пользователей и прибыль бизнеса? Можно ли определить, какие элементы сайта способствуют повышению конверсии, а какие наоборот лишают вас прибыли? 

В этой статье мы рассмотрим, как A/B-тестирование дизайна VSV-Group помогло подтвердить UX/UI гипотезы Турум-бурум и раскрыть потенциал бизнеса, увеличив конверсию ключевых страниц от 30% до 58%.

О VSV-Group

Вашему вниманию VSV-Group — компания, специализирующаяся на изготовлении и установке ворот, автоматики, солнцезащитных систем, мобильных рамп, складского оборудования и не только. Такое разнообразие услуг и является главным преимуществом компании. Здесь вы можете заказать решение "под ключ" с учетом ваших самых креативных индивидуальных пожеланий.

Однако в контексте UX/UI дизайна это создает вызов: как подробно представить все доступные услуги компании и при этом не перегрузить интерфейс? Ведь без удобной и интуитивно понятной навигации пользователи банально не смогут ознакомиться с нужной информацией и понять ценность услуг бизнеса. 

Поэтому представители VSV-Group обратились в студию Турум-бурум с конкретной целью — оптимизировать интерфейс сайта для увеличения KPI и клиентоориентированности сайта.

Каким образом нам удалось увеличить конверсии ключевых страниц от 30% до 58% и какую роль в этом сыграло A/B тестирование? Ответ в следующем разделе.  

UX аудит или что предшествовало A/B тестированию е-коммерс?

Уверенность — это хорошо, самоуверенность — опасно. Это работает во всем: от определения рабочего веса в зале до выбора UX/UI дизайна проекта. И в каждом из случаев самоуверенность имеет свою цену: в первом — подорванное здоровье, во втором — трата времени и средств.

Именно поэтому команда Турум-бурум считает A/B-тестирование е-коммерс одним из самых эффективных методов для проверки UX/UI гипотез и принятия обоснованных бизнес-решений. А поскольку мы предпочитаем действия над словами, ниже — подробно о кейсе VSV-Group и достигнутых результатах.

Оптимизация сайта VSV-Group или все начинается с юзабилити аудита

Мы провели UX аудит в результате которого нашли около 30 юзабилити недостатков интерфейса и это на самом деле является хорошей новостью. Во-первых, выявленные UX/UI ошибки объясняют, почему некоторые показатели эффективности сайта не такие высокие, как хотелось бы. А во-вторых, демонстрируют огромный потенциал бизнеса в случае устранения таких недостатков.

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

Однако как убедиться, что сформированные гипотезы сработают на 100%? Именно здесь в игру вступает A/B тестирование продукта для е-коммерс, целью которого и является проверить как пользователи будут реагировать на предложенные UX/UI изменения.

A/B тестирование продукта для е-коммерс: опыт VSV-Group:

Поэтому мы решили проверить, как сработают наши гипотезы на практике с помощью A/B-тестирования е-коммерс. Для этого выбрали две ключевые страницы сайта с наибольшим потенциалом роста — страница выдачи и страница товара в десктоп и мобильной версиях. Мы разработали новый дизайн двух страниц сайта с учетом гипотез, рекомендаций и референсов. 

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

Страница выдачи воротных систем

Проблематика:

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

Оригинальная страница выдачи категории VSV-Group в десктоп
Оригинальная страница выдачи категории VSV-Group в мобайл

Гипотеза:

На странице выдачи пользователи не находили информации о компании и ее преимуществах, примеры работ, отзывы и другие элементы, которые повышали бы их лояльность к бренду. А поскольку фотографии товаров были недостаточно акцентными, чтобы захватить их внимание — они покидали сайт.

Рекомендации:

  1. Разместить карточки ворот по две в строке;
  2. Уменьшить размер SEO текста;
  3. Кратко указать основные преимущества компании;
  4. Увеличить размеры фотографий с примерами работ и расположить их перед блоком FAQ;
  5. Добавить информацию о ключевых особенностях различных видов ворот.
Обновленная страница выдачи категории VSV-Group в десктоп
Обновленная версия, которую тестировали в мобильной версии

Результат A/B тестирования:

Мы проверили как предложенные изменения потенциально повлияют на поведение пользователей и получили положительные результаты. Так, пользователи дольше оставались на сайте, демонстрировали более высокий уровень вовлеченности и чаще переходили на страницу товара. Как следствие — конверсия страницы выдачи товара в десктоп увеличилась на 32%, а для мобильных устройств на 58%. 

Страница товара (ворот для гаража)

Проблематика:

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

Гипотеза:

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

Вот представьте, что вы решили установить воротную систему на даче, но не имеете достаточного опыта в этой сфере. Вы ожидаете, что сайт поможет вам сделать правильный выбор. Однако что произойдет, если вы не найдете ответы на свои вопросы среди "полотна текста"? С большой вероятностью — растерянность, раздражение и желание побыстрее покинуть веб-ресурс. Из-за этого потенциальные клиенты VSV-Group быстро и покидали сайт, не сделав выбора. 

Оригинал и тестовая версия блока с преимуществами и калькулятором расчета стоимости товара в десктоп
Оригинал и тестовая версия блока с преимуществами и калькулятором расчета стоимости товара в мобильной версии

Рекомендации:

  • Добавить макро фотографии материалов и примеры цветовых решений;
  • Визуально отделить опции и блоки страницы между собой;
  • Имплементировать блоки социального доказательства: "Примеры работ", "Отзывы", "Советы экспертов" и цифры, подчеркивающие экспертность компании;
  • Добавить блок с техническими характеристиками, рекомендуемые варианты решения, добавить справку в виде поп-апа для специфических характеристик с указанием наилучшего решения для конкретных ситуаций;
  • Упростить форму калькулятора расчета стоимости товара;
  • Увеличить карточку товаров, а также фото для мобильной версии сайта.
Варианты дизайна страницы товара в десктоп
Блок персонализации воротной системы в мобайл: оригинал и версия, которую тестировали
Имплементированный блок с описанием особенностей товара в новой версии карточки товара

Один блок — разные подходы: какой из них больше привлекает ваше внимание? А какой удобнее и нагляднее демонстрирует проделанную работу?

Вид блока реализованных проектов на сайте VSV-Group (до изменений)
Вид блока реализованных проектов на сайте VSV-Group (после изменений)

Результаты А/B тестирования:

Результаты тестирования нового дизайна страницы товара подтвердили нашу гипотезу. После редизайна страница стала более интуитивно понятной и удобной для пользователей. Как результат мы снова получили стремительное увеличение коэффициента микроконверсии — +30% для десктоп и +48% для мобильных устройств.

Таким образом мы подтвердили цифрами эффективность наших гипотез и необходимость их внедрения!

Что дают результаты A/B тестирования для е-коммерс?

В случае с VSV-Group, A/B-тестирование для е-коммерс позволило проверить гипотезы по оптимизации страницы выдачи и страницы товара на сайте в десктоп и мобильной версии и подтвердить, что внедрение нового дизайна приведет к значительным результатам, а именно:

  • +32% микроCR для страницы выдачи товаров в десктоп и +58% для мобильных устройств;
  • +30% микроконверсии для страницы товаров в десктоп и +48% для мобильных устройств.

В этом кейсе нам удалось подтвердить эффективность всех выдвинутых гипотез, но иногда для достижения конечной цели редизайн проходит несколько итераций. В таком случае A/B-тестирование позволяет подсветить места, которые требуют доработки и тем самым сохранить бюджет и время заказчика, минимизируя риски для самого бизнеса. Интересно как происходит работа над такими кейсами? Тогда ознакомьтесь с деталями работы над проектом Crystal Clear Memories.

This is some text inside of a div block.
This is some text inside of a div block.

Поделиться постом в:

Вера
Вера — копирайтер и редактор, которая тщательно прорабатывает каждую публикацию, помогая лучше понять мир UX/UI, CRO и электронной коммерции, а также ознакомиться с последними трендами.

Больше кейсов от турум-бурум?

Ознакомьтесь с нашим портфолио из различных сфер бизнеса.

Смотреть портфолио

Напишите нам, и начнем сотрудничество!

Ваше сообщение было отправлено! Мы свяжемся с вами как можно скорее

Отправить ещё одну заявку
Doublecheck your form data please