Салют! В проектировании любого интернет-магазина отдельного внимания заслуживает проработка пути оформления заказа, и вот почему:
На основе большого
Среди причин, по которым 1012 пользователей бросили корзину, 22% — слишком долгий или сложный процесс оформления заказа.
Это говорит о том, что каждый 5-й покупатель бросил корзину из-за факторов, на которые можно влиять с помощью интерфейсов, а это именно то, что нам нужно.
Мы рассмотрим важный и эффективный приём — упрощение пути оформления заказа. Это когда, начиная с корзины, сознательно убирают часть интерфейсов и форм и, наоборот, добавляют элементы, способствующие усилению доверия.
Расскажем, как это делать правильно, как это внедрять на действующий проект и что нам говорят исследования.
В 1999 году Амазон запатентовал технологию «1-Click Ordering». Суть технологии в запоминании платёжной и личной информации пользователя для быстрой покупки. Сейчас такой технологией не удивишь, но тогда это был прорыв.
Скорость оформления заказа снизилась с нескольких минут до секунд, а продажи выросли на 5–10% уже в первые годы после внедрения. Основную ставку сыграли именно эмоциональные покупки, успех которых напрямую зависит от скорости и удобства процесса оформления заказа.
Это можно взять как отправную точку в старте изучения данного вопроса, так как вскоре другие проекты запустили похожие технологии, только под своими названиями.
По факту, задача интерфейсов вкупе с технологиями — провести пользователя по пути оформления заказа, получив всю нужную информацию за минимальное количество действий и убирая все отвлекающие факторы.
Если всё свести к простым элементам, то нас интересуют области интерфейсов и формы, которые нужны или не нужны на конкретной странице, а также суммарное количество действий.
Нужны они или нет, мы определяем по принципу: возможно ли успешно оформить заказ без данного элемента?
Если возможно, то элемент попадает под оптимизацию. Подход «в хозяйстве всё пригодится» тут не работает.
Может показаться, что парочка лишних действий не станет препятствием для мотивированного покупателя. Но это решение прежде всего для тех, у кого мотивация меньше, или если покупка эмоциональная.
В том же исследовании от Baymard есть данные, что идеальный процесс оформления заказа может состоять из 12–14 элементов формы (7–8, если считать только поля формы). Под элементами подразумевается различная навигация в форме оформления заказа.
Мы предлагаем отталкиваться не от «идеального» количества шагов, а от минимально возможного в рамках вашего проекта без ущерба функционалу.
Например, если у вас есть система лояльности со списанием баллов, путь авторизации и подтверждения списания может накинуть до 10 дополнительных шагов, как и применение купона и т. д.
Давайте разбираться, что и как делать на проекте, чтобы улучшить его конверсию.
Сфера eCommerce в основном мобильная, и для 90% проектов подойдёт именно разработка от мобильной версии (mobile first). Учтите это даже для размышлений над действующим проектом.
В мобильных интерфейсах стандартом индустрии является меню «бургер» (две-три черточки или точки).
Как правило, такой вариант не требует упрощения, так как занимает минимум места, но если в вашем интерфейсе меню имеет визуальное выделение, то есть смысл оставить только логотип и чат (это же относится и к ПК-версии).
Наша задача — сужать возможности покупателя и предлагать ему следовать пути оформления заказа, не ощущая при этом дискомфорта. Негатив случается, когда покупатель начинает терять контроль над ситуацией, например не находя привычных элементов интерфейса или важной информации.
«Потеря контроля» — метрика, которую сложно оценить, но легко смоделировать. Например, если вы уберёте блок с суммой заказа, чтобы «оптимизировать» интерфейс (чего делать нельзя), то покупатель не будет понимать, какую сумму придётся оплатить, пока не увидит её в окне эквайринга.
Из этого понятно, что оптимизацию нужно проводить разумно, учитывая весь контекст, а не смотреть на интерфейсы изолированно от прошлого опыта пользователя и продукта в целом.
На этой странице начинается воронка оформления заказа. Нам важно, чтобы пользователь получил необходимую информацию, но при этом не столкнулся со сложностями.
Задача корзины — убедиться, что в заказе есть всё нужное и сумма заказа соответствует ожидаемой.
В большей степени пользователи лояльны к функциональным корзинам, и здесь важно просто грамотно расставить акценты, не забыть важную информацию и самое главное — чтобы она хорошо работала (купоны применялись, кнопки нажимались и т. д.).
Как показывает практика, даже такие, казалось бы, простые требования имеют множество нюансов, так как на данной странице концентрируется много взаимосвязанного функционала.
Ваш покупатель может быть заряжен мотивацией, пока не столкнётся со сломанным полем «промокод» или сам промокод не будет магическим образом работать. Итог мы понимаем.
Итак, ниже рекомендации:
Рассмотрим два популярных подхода в организации пути оформления заказа — одностраничный и многошаговый.
Одностраничный подход. Из названия понятно, что всё оформление проходит на одной странице. Этот подход не всегда уместен, так как подходит для небольшого количества форм. Например, в 1С-Битрикс стандартный путь оформления заказа по умолчанию одностраничный, многие сайты на этой системе его используют, но перегружены полями и формами.
Многошаговый. Когда путь разбивается на несколько логических шагов, но рекомендуется не более трёх. Как правило, это контактные данные, детали доставки и варианты оплаты. Такой формат отлично работает, если нужно собрать много данных для оформления заказа.
Для обоих вариантов стоит придерживаться ряда правил, чтобы получить максимальный эффект:
1. Убираем все лишние формы, например поле «Отчество» или «Индекс», если оно не нужно для вашей транспортной компании.
2. Всё, что можно заполнить автоматически, заполняйте. Это касается данных из последнего заказа.
3. Сохраняйте данные в формах в сессию. Нет ничего хуже, чем перезагрузить или сменить вариант оплаты и потерять всё, что заполнял пользователь.
4. Полностью убираем любую навигацию, хедер и футер. Вся концентрация должна быть на формах.
5. Если ваш проект работает преимущественно в одном городе или ряде близлежащих, выведите популярные города над полем «Город». Поле «Область» можно упразднить, а при необходимости всё равно передавать данные транспортным компаниям.
6. Покупка без регистрации (гостевое оформление). Где возможно, регистрируйте пользователя по тем данным, что он уже ввёл, и создавайте личный кабинет автоматически. Или дособирайте эти данные после оплаты.
7. Адаптивная проверка валидности полей - решение проверяет поле сразу после ввода данных (например, номер телефона или email), а не после нажатия кнопки «Продолжить».
8. Добавляйте удобные способы оплаты, например СПБ.
9. Не забудьте про страницу «Спасибо» после успешного оформления заказа.
Эти рекомендации могут увеличить конверсию пропорционально текущим проблемам в проекте. Некоторые исследования указывают на возможность роста конверсии на 0.5–1%, что может означать 25% прибавку к продажам.
Для начала нужно стратегически оценить, что представляет собой путь оформления заказа в вашем проекте.
Нас интересует прежде всего количество действий, которые пользователь совершает от момента касания корзины до завершения оформления заказа. Измерьте этот путь как для мобильных, так и для ПК-интерфейсов. «Касание» — это нажатие, клик, свайп, пролистывание.
Затем оцените этот путь (хотя бы гипотетически) после применения вышеописанных рекомендаций. Это покажет, на сколько процентов сократилось количество действий, а также поможет при проведении A/B-тестов.
Чтобы протестировать результат, нужно сохранить оба пути оформления заказа (старый и новый) и убедиться, что нигде нет конфликтов.
На момент написания статьи используют 2 инструмента:
Настройка и проведение A/B-тестирования требуют отдельного разбора, но в целом нас интересует стандартный сплит-тест длиной 4–6 недель для подсчёта результатов.
Оптимизация пути оформления заказа напрямую влияет на снижение процента брошенных корзин.
Убирайте лишние формы, облегчайте навигацию и упрощайте выбор способов оплаты — это избавляет пользователя от лишних преград и позволяет ему сфокусироваться на самом главном действии.
Скоро мы свяжемся с Вами и все расскажем