Рост продаж после повышения юзабилити и улучшения user experience сайта

Отличная статья, иллюстрирующая важность исследования поведения посетителей для повышения конверсии сайта. "Рост продаж после повышения юзабилити и улучшения user experience сервиса PosterXXL.ru".

Павел Коноплицкий, компания 1point

Для большого количества отечественных e-commerce сайтов и интернет-магазинов рост прибыли возможен без дополнительных затрат на рекламу и продвижение, за счёт улучшения пользовательских качеств сайта. О том, как это было сделано на примере сервиса posterxxl.ru, вы узнаете из этой статьи.

Результаты

PosterXXL — online сервис печати постеров, плакатов и больших фотографий с доставкой по всей России. В марте 2009 года специалистами 1point был проведён юзабилити-аудит. Результатом аудита стал отчёт с перечнем обнаруженных проблем и рекомендациями по их устранению. На момент проведения аудита сервис работал уже более года. По мнению руководства сервис имеет потенциал к росту. Это стало основной причиной привлечения специалиста по юзабилити к проекту. Результаты проделанной работы можно увидеть, сравнив ключевые показатели эффективности (KPI) за два одинаковых периода: с марта по декабрь 2008 года и такой же период 2009 года. Ежемесячные расходы на контекстную рекламу и поисковое продвижение остались неизменными. Несмотря на рост количества заказов, сделанных по телефону, анализировались только заказы, сделанные через веб-сайт.

Если результаты, представленные в докладе на конференции User Experience 2009 (период с марта по сентябрь) можно назвать положительными, то результаты за период с марта по декабрь можно назвать более чем отличными.

Рост чистой прибыли на 133%



Рост конверсии на 198%

Рост лояльности (повторные продажи) на 191%

Инструменты

С помощью каких инструментов измерялись KPI, проверялись интерфейсные решения и анализировалось поведение пользователей?

Google Analytics


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


WebVisor


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

Для e-commerce сайтов WebVisor может стать доступной альтернативой юзабилити-тестирования по следующим причинам:

1. Стоимость использования инструмента на порядок ниже не только очного, но и удалённого юзабилити-тестирования.
2. Пользователи находятся в естественном контексте и действуют по тому сценарию, который считают естественным.

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


  И в Google Analytics, и в WebVisor для сервиса PosterXXL отслеживались 4 цели: перешли на страницу контактов, закачали изображение (перешли в корзину), перешли на первую страницу оформления заказа, совершили покупку (перешли на страницу благодарности). Ролики отсматривались ежедневно. С помощью фильтра просматривались только те ролики, в сессиях которых были: достигнуты цели, наблюдалась высокая активность или количество просмотренных страниц.

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

Управленческая программа


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

Интерфейсные решения

Рассмотрим, какие изменения произошли в интерфейсах сервиса.

Главная страница

Было. Посмотреть увеличенное изображение

Стало

На главной странице:

• Добавлен телефон в шапку сайта.
• Увеличили кнопку "Загрузить" и убрали цифру около неё . Так визуально уменьшилось количество шагов, необходимых для заказа.
• Вместо статической картинки добавили промо-блок с ротацией.
• Один из вопросов, который задают пользователи сервиса по телефону и в поле комментария к заказу: "Когда будет готов мой заказ?". Поэтому было принято решение добавить ориентировочную дату выполнения заказа на главную страницу.
• "Могу ли я сэкономить?", "Насколько дороже или дешевле печать на одном материале, чем на другом?", "На каком размере мне лучше печатать?". Чтобы ответить на эти вопросы и дать возможность пользователю самому оценить различные варианты печати (материалы и стоимость), на форму справа была вынесена ссылка "Сравнить материалы".
• Изменились логотипы платёжных систем. Вместо логотипов ROBOKASSA и ASSIST были размещены логотипы пластиковых карточек (Visa и MasterCard), Яндекс.Денег, платежей через sms Билайн, платёжных терминалов QIWI и т.д. Сделано это было с целю показать пользователю возможные способы оплаты. Например логотип Webmoney, на мой взгляд, лучше поясняет возможность расплатиться виртуальными деньгами, чем логотип ROBOKASSA - провайдера этой услуги. Есть информация о том, что логотипы известных компаний повышают доверие к сайту.

Лица притягивают взгляд

Было

Промежуточный вариант

Промежуточный вариант

Стало

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

Описание материалов

Было

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

Стало

С добавлением AJAX механизм зависимости был реализован — форма для выбранного материала справа меняется вместе с его описанием без перезагрузки страницы (и наоборот). Для части материалов предлагается печать либо на стандартных размерах (А0, А1 и другие) либо на указанных пользователем. При переключении установленные пользователем размеры сохраняются.

Сравнение цен

Было

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

Стало

Чтобы снизить когнитивную нагрузку в новой версии калькулятор заменили на интерактивную таблицу. В таблице отображаются как фиксированные цены для разных материалов, так и сохранилась возможность рассчитать стоимость для размеров, указанных пользователем. Если пользователя устраивает цена, то всего за один клик по ячейке (пересечение размера и материала) система выставляет в форме справа желаемые настройки.

Корзина

Стало

В корзине была добавлена дополнительная интерактивность. Появилась возможность без перезагрузки страницы посмотреть как вписывается загруженное изображение в выбранный формат, как оно выглядит с применённым эффектом (чёрно-белый или ретро) или в рамке.

Рекомендация размера

Стало

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

Покупка. Первый шаг

Было

Одна из самых распространённых преград, которые сооружают владельцы магазинов на пути онлайн покупки — это форма регистрации, следующая после клика по кнопке "Заказать". Пользователю предлагается то авторизироваться, даже если он на сайте первый раз, то заполнить форму с совершенно ненужными вопросами, подтвердить email и т.д. Так было и в первой версии сервиса PosterXXL. Логин, отчество, пароль и его подтверждение — всё это лишние поля на форме.

Стало

В новой версии была реализована т.н. "ленивая" регистрация. Т.е. в форме остались только реально необходимые для покупки поля. Ничто не отвлекает пользователя от процедуры заказа покупки. Система сама генерирует и отправляет пароль на указанный пользователем email. В дальнейшем у пользователя всегда есть возможность изменить пароль.

UX и поисковая оптимизация

Стало

Значение SEO (поисковой оптимизации) для сайтов электронной коммерции не требует дополнительного обсуждения. Однако, методы и решения, которые иногда предлагают SEO специалисты, подходят для роботов, но вызывают вопросы у реальных посетителей. Одним из способов продвижения сервиса PosterXXL является продвижение с помощью статей. Поэтому на сайте появился специальный раздел со статьями. С помощью Google Analytics определили, что пользователи не читают опубликованные статьи и покидают сайт. Но некоторые статьи являются весьма популярной точкой входа на сайт. Была добавлена функциональность, позволяющая для каждой статьи устанавливать такой материал в форме справа, о котором идёт речь в статье. Благодаря этому стали приходить заказы на материал со страницы-статьи о нём.

Выводы

Чтобы улучшить пользовательский опыт (user experience) и эффективность сайта электронной коммерции:

1. Будьте готовы к изменениям!
2. Используйте доступные инструменты для анализа.
3. Привлекайте специалистов со стороны, которые имеют свежий взгляд и опыт в повышении юзабилити сайтов электронной коммерции.
4. Наладьте контакт с вашими клиентами и прислушивайтесь к их мнению.