Потратить четыре месяца работы впустую, а после — поднять конверсию формы заказа на 244%

Менеджер проекта сервиса Reviewter Ринат Субаев рассказал, как с помощью UX-дизайнера и «Яндекс.Метрики» понять, что нужно клиенту.

Потратить четыре месяца работы впустую, а после — поднять конверсию формы заказа на 244%

Учитесь на наших ошибках, не своих. Если вы думаете, что это всё очевидно и просто — вы правы.

Старт

Что главное в сервисе? Элемент, который взаимодействует с клиентом напрямую, — форма создания заказа.

Главная проблема формы и сервиса в том, что организованный заказ отзывов — непривычная услуга для российского рынка. Люди привыкли к общению с фрилансерами на бирже или с агентствами-подрядчиками, мы же предлагаем инструмент, как «Google Таблицы» или дрель.

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

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

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

Вот так выглядел первый редизайн формы заказа Reviewter
Вот так выглядел первый редизайн формы заказа Reviewter

Только на интерфейс выбора площадок ушёл месяц. Мы назвали его «Площадки 3.0». «Площадки 3.0» оказались небоеспособны. Нам пришлось отказаться от того, на чём мы сконцентрировались и во что вложили силы, энергию, креатив и терпение. Повторю: это стоило нам месяца работы.

Планирование и проектирование

Команда Reviewter варится в проекте слишком долго. Нам был нужен взгляд со стороны. Мы наняли в команду UX-дизайнера, начали использовать новую систему внедрения новшеств. В основу работы легли сплит-тестирования.

Сплит-тестирование (split testing) подразумевает сравнение исходной версии веб-сайта с доработанной. Разница может быть в цвете нескольких кнопок или перестановке целых блоков. Цель — посмотреть, как посетитель реагирует на разные версии. Лучшая остаётся.

Так выглядела дорожная карта сплит-тестирования
Так выглядела дорожная карта сплит-тестирования

Работу разделили на три итерации по три этапа.

  • Анализ результатов тестирования и планирование новшеств.
  • Создание макета, вёрстка и подключение функций.
  • Запуск тестирования (параллельно с фазой тестирования мы занимались доработкой других элементов сайта).

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

Важный момент: мы придерживались одного уровня трафика на протяжении всего времени тестирования.

Круговорот тестирования в экосистеме Reviewter
Круговорот тестирования в экосистеме Reviewter

Подготовка

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

Запуск сплит-тестирования состоялся 11 сентября 2016 года, хотя мы планировали на 5 сентября. Мы не забыли подключить:

  • Цели в «Яндекс.Метрике», чтобы проверить заполнения всех полей, клики на каждый элемент.
  • Hotjar (аналог «Яндекс.Вебвизора», который существовал ещё до «Вебвизора 2.0»).
  • Карту кликов.
  • Карту скроллов.

Итоги итераций

Первый: упростили форму заказа

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

Новый дизайн и упрощённая форма принесли прибавку на 0,89% к конверсии. Провал? Не совсем. Теперь мы знали, что идём в верном направлении. Тест показал, что пользователи больше всего задерживались на количестве заказываемого контента и площадках для их размещения.

Потратить четыре месяца работы впустую, а после — поднять конверсию формы заказа на 244%

Суть: не заваливай пользователя сотней новшеств. Веди его по шагам, дай ему влиться.

Второй: под нож пошли «Детали заказа»

Раздел «Детали заказа» был самым трудозатратным и дорогим. Решение оказалось тяжёлым с моральной точки зрения. Однако оно себя оправдало. Теперь посетитель не уходил в дебри деталей. Большинство людей терялось в них и уходило, система оказалась для них сложной. И это была наша проблема, а не их.

Вторая итерация принесла нам прирост конверсии ещё на 106,94%. Уже неплохо, учитывая, что рост обеспечил отказ от «Деталей заказа». Принцип «Бритвы Оккама» сработал и здесь.

«Бритва Оккама» — методологический принцип. Он гласит: что может быть сделано на основе меньшего числа, не следует делать, исходя из большего. Можно сказать по-другому: не нагружай интерфейс излишками, особенно если на них никто не кликает.

Потратить четыре месяца работы впустую, а после — поднять конверсию формы заказа на 244%

Суть: откажись от зауми в пользу простоты и прозрачности.

Третий: отточили форму макета

Мы создали так называемую «форму-урод», на которой тестировали всякие безумные идеи. Кстати, именно эта форма и является сейчас основной формой заказа на сервисе.

Как это ни удивительно, но самые мелкие доработки, «полировка» и тексты принесли нам больше всего конверсии. Скорее всего, это произошло по инерции из-за предыдущих итераций. Итог — мы получили прирост конверсии на 137%.

Суть: экспериментируй и не бойся безумных конструкций (привет, «ДжонФёдор»).

Что мы получили за три месяца тестирований

У прописных истин много недостатков и одно неоспоримое достоинство — они работают. Результаты в нашей работе проявились после сплит-тестирования и аналитического подхода ко всем аспектам сервиса Reviewter: проектированию, планированию, разработке, дизайну и логике интерфейса.

Прирост конверсии
Прирост конверсии

Однако мы не стоим на месте. Мы не завершаем наши сплит-тестирования, используя принципы на других страницах сервиса. Но сейчас мы поняли ещё кое-что: сколько бы аналитики ни было, не стоит уходить в growth hacking. Это принесёт показатели, но не пользу для клиента.

Сегодня команда работает над продуктом, изучая его, уходя от данных и возвращаясь к простым фактам: Reviewter — это сервис. Он должен быть простым, удобным и гибким. С его помощью можно решать маркетинговые и бизнес-задачи.

Уроки

  • Сначала планируй, потом делай.
  • Обязательно учти взгляд со стороны.
  • Фиксируй самые безумные идеи.

Полезный документ

Мы разработали систему внедрения новшеств в сервис и даём её вам. Пользуйтесь на здоровье, и успехов в вашем бизнесе.

1919
46 комментариев

А в чем рисовали дорожную карту? :)

2

В июле на VC была статья от создателей сервиса Time Graphics, которым мы и воспользовались.

https://vc.ru/25021-time-graphics

P.S. Забыли поблагодарить создателей за удобный инструмент. Спасибо!

4

Комментарий недоступен

3

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

Скажите, пожалуйста, а на какой выборке случился этот прирост? Ну то есть просто число. 5 человек, 500 или 50000? Проценты прироста без указания выборки не совсем корректно приводить. Прирост с 1 человека до 2 — уже в 2 раза, это одно. А прирост с 10000 до 20000 — это тоже в два раза, но уже совсем другое.

2

внизу у них счетчик liveinternet - 440 посетителей за сутки. То есть, речь максимум о нескольких десятках.
Учитывая что автор всерьез принимает прирост конверсии в 0,89%, ценность этой статьи стремится к нулю.

1

Alexander, наши показатели находятся между 500 и 50000. Более точно будет в следующих публикациях. Следите за нами!