5 приемов User Experience, позволяющих немедленно увеличить доход интернет-магазина

Содержание

0000000000shopping

Улучшение пользовательского опыта (UX) предоставляет веб-маркетологам множество возможностей для оптимизации конверсии и неоценимую перспективу видеть реальный и непосредственный рост доходов как следствие правильно проведенных тестов и настроек.

В новом посте мы хотим познакомить читателей нашего блога с 5 любимыми приемами («хаками», hacks) эксперта по оптимизации конверсии (CRO), веб-маркетолога и разработчика маркетинговых стратегий Nick Eubanks. Нику нравятся такие подходы, которые могут быть применены к максимально широкой популяции online покупателей, вне зависимости от целевой аудитории (target group) конкретного бизнеса.

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

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

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

Прием 1

Изменим стандартный шаблон формы адреса от порядка заполнения «город — регион — почтовый индекс» на следующий порядок «почтовый индекс — город — регион».

13

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

23

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

Разумеется, что нужно упредить нежеланные действия пользователя, просто разместив рядом с полем «почтовый индекс» текстовое предупреждение «Ваш город и регион будут добавлены автоматически».

Реализация этой несложной технологии на странице оформления заказа ресурса TrafficSafetyStore привела к немедленному увеличению конверсии на 38,74% (с абсолютного показателя 2,22% до 3,08%) менее чем за 2 недели. Сплит-тест регистрировал устойчивое повышение конверсии с 29 июля по 8 августа. Эта несложная автоматизация привела к получению еще 110 заказов и дополнительных $43 230 выручки за двухнедельный период.

34

Двигаясь по этой же линии мышления мы можем упростить и ускорить процесс принятия решения покупателем, предлагая по умолчанию самые очевидные варианты действий.

Прием 2

Автоматический выбор самого дешевого способа доставки по умолчанию.

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

44

Этот прием выходит за рамки поддержки самых распространенных моделей поведения, и потому покупателю нужно дать ясно знать, что вы понимаете его интерес к экономии средств, вследствие чего по умолчанию сразу предлагаете ему самый доступный вариант шиппинга.

53

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

62

TrafficSafetyStore так удалось поднять чистую прибыль на 19,31% (в абсолютных показателях с $14 298.26 до $17 059.46 — всего за неделю применения весьма несложной технологии!).

72

Прием 3

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

Как это делает, например, Amazon:

81

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

91

Чарльз Николлс (Charles Nicholls) из компании SeeWhy во время недавней конференции Conversion Conference провел убедительное выступление, посвященное практике сохранения пользовательских данных Amazon. Чарльз наглядно доказал, что Amazon работает с историями заказов исключительно хорошо: вы получаете рекламное письмо, предлагающее вам товар, предлагаемый на основе вашего покупательского профиля и недавнего пользовательского поведения на Amazon, или же вам напоминают о товарах, недавно просмотренных вами, но так и не купленных. Если вы решите сделать покупку, единственная информация, которая от вас потребуется — пароль от вашего аккаунта Amazon.

Вот слайд из презентации Николлса, подробно раскрывающий, как Amazon работает с «мобильными» покупателями:

101

Прием 4

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

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

А теперь собственно «хак»: настройте форму для кеширования (сохранения) введенной информации. Теперь покупателю после ошибки не придется заполнять всю форму целиком, это сохранит и время и нервы.

111

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

Кеширование введенных данных в форме заказа, примененное на TrafficSafetyStore, привело к росту количества завершенных сделок на 12,91% за неделю.

121

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

131

Наконец, «умная обработка ошибок» будет по-настоящему умной, если вы сумеете сформулировать сообщение об ошибке без употребления слов, несущих явные негативные ассоциации:

  • «Не удалось»;
  • «Проблема»;
  • «Недействительно»;
  • «Неправильно»;
  • «Запрещенный».

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

Прием 5

Последний «хак», которым делится с нами Nick Eubanks, касается механизма взаимодействия человека с компьютером. Согласно выводам исследователей из Nielsen Norman Group, «Чтение на экранах компьютера утомительно для глаз и происходит на 25% медленнее, чем чтение с бумаги» и «79% пользователей Интернета сканируют тексты, а не читают». Вооруженные знанием этих широко распространенных поведенческих паттернов, попробуем разработать макет продающей страницы, наиболее отвечающий стандартному поведению среднестатистического online посетителя.

Вот что мы сделаем: мы отсортируем навигационные элементы по популярности. И для английского, и для русского языков это означает пространственную организацию навигационных элементов в направлениях слева направо и сверху вниз.

Для TrafficSafetyStore это означает расположение товаров в вертикальном столбце меню не по алфавиту, как это было в самом начале, но в порядке популярности групп товаров. Покупателям взаимодействовать с такой навигацией легко и просто.

14

В направлении сверху вниз…

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

15

…и слева направо.

Для увеличения продаж к ТОП-3 самых популярных товаров маркетологи заботливо «подверстали» товары, находящиеся на позициях 4 и 5, поскольку они, по мнению специалистов, обладают хорошим коммерческим потенциалом.

За период с 23 сентября по 30 сего года с помощью этого нехитрого приема удалось достичь 32,47% увеличения продаж товара 1 позиции по сравнению с предыдущей неделей, что привело к росту чистой прибыли на 23.95%.

16

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

Дополнительный совет: длина поля формы должна соответствовать длине вводимого слова. Это помогает уменьшить подсознательное восприятие пользователем формы как длинной, требующей для заполнения много времени.

По материалам conversionxl.com