Цель и решаемые задачи

Необходимо было провести бизнес-анализ предложения клиента (товаров и сервиса), анализ работы сайта и целевой аудитории. Затем — спланировать и реализовать ряд доработок для улучшения конверсии. Доработки должны были позволить продажу тех категорий товаров, которые на момент старта работ вообще не продавались через сайт.

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

Основные этапы проекта

На этапе предпроектного анализа была проведена достаточно объемная работа. Мы собрали материалы по особенностям бизнеса, продуктов и целевой аудитории, веб-аналитику по сайту и маркетинговым каналам. В проектировании и реализации стартовых доработок на сайте мы использовали именно эти материалы.

Анализ бизнес-целей

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

Для интернет-магазина единственным существенным KPI является транзакция (т. е. оформленный заказ), а остальное — промежуточные действия (микроконверсии). Но особенность бизнеса в данном случае — категории товаров, которые не продаются в формате «взял и купил». Т. е. продается не сам товар, а промежуточная точка контакта с компанией: «замеры» и «дизайн-проекты». Поэтому категории товаров подробнее обсудили на предмет того, что на самом деле стоит показать на сайте для мотивации выхода на контакт. При этом нужно было максимально упростить взаимодействие.

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

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

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

Скриншоты из отчета по анализу целевой аудитории
Проблемы существующего решения

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

Создание концепции. Планирование работ

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

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

 

К ним отнесли:

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

 

Т. е. доработка была итерационной: отрезок в 3 недели, затем — небольшая порция доработок. После каждой итерации мы тестировали сделанные доработки и при необходимости добавляли в план исправления.

Запланированные работы по развитию сайта
Прототип и техническое задание

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

Прототип в программе Axure

Над страницей каталога любого уровня вложенности и локальной навигацией размещаем 5 основных особенностей (для каждой группы категорий или общие — в зависимости от вложенности). Они обозначают сервисные возможности компании для покупателя. Согласовываем такой вариант.

Прототип страницы каталога

Начинаем проектировать категории товаров в каталоге. Первое, что действительно проблематично для покупателей, — товары, которые перед покупкой требуют выбора параметров. Изучаем действия через Вебвизор, смотрим статистику по веб-аналитике.

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

 

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

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

Тестируем, правим, согласовываем.

Прототип страницы категории товаров
Прототип страницы категории товаров - ховер карточки товаров

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

Прототип элемента глобальной навигации (шапка)
Прототип шапки с открытым каталогом и строкой поиска

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

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

Заказчик хочет, чтобы покупатели «заказных» товаров по возможности отказывались от них в пользу готовых. Добавляем блок аналогичных готовых товаров с соответствующим пояснением.

Прототип категории товаров «на заказ»
Прототип страницы товаров «на заказ» с открытым блоком

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

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

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

 

По сути, модульный товар должен был стать аналогом категории в каталоге.

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

Прототип страницы модульных товаров
Прототип страницы модульного товара
Прототип страницы модульного товара - ховер модуля
Прототип информационных блоков на странице модульного товара

Проектируем страницу товара, на которой планируются небольшие изменения.

Прототип страницы товара

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

Делаем, правим и согласовываем прототип раздела со всеми страницами.

Прототип страницы способов оплаты
Прототип страницы о кредите
Прототип страницы о доставке
Техническое задание на реализацию

Параллельно с прототипами готовим технические задания для каждой итерации доработок.

Скриншоты из технического задания на первые этапы
Скриншоты из технического задания на вторые этапы реализации
Дизайн

Отдаем на дизайн внешнему подрядчику.

Готовим макеты под нашим авторским надзором — получаем макеты, готовим замечания, правки и т. д.

В итоге согласовываем макеты всех страниц с заказчиком.

Дизайн-макет страницы каталога товаров
Дизайн-макет страницы категории товаров
Дизайн-макет страницы товаров «на заказ»
Дизайн-макет страницы категории модульных товаров
Дизайн-макет страницы модульного товара
Дизайн-макет информации для покупателя на странице модульного товара
Дизайн-макет элементов: шапка и целевые блоки для страницы товара
Дизайн-макет страницы способов оплаты
Дизайн-макет страницы о кредите
Дизайн-макет страницы о доставке
Фронтенд- и бэкенд-разработка. Тестирование

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

Результат

Для анализа результатов мы готовим модель KPI и настраиваем аналитику для отслеживания взаимодействия покупателя с сайтом на разных этапах выбора и покупки товара.

В целом мы получили рост конверсии до 160%.

Скриншоты из отчета по анализу KPI и настройке отслеживания результатов на сайте
В ходе проекта было сделано
  • 9 аналитических записок (бизнес-анализ, анализ по каждой товарной категории, анализ целевой аудитории)
  • Составлен итерационный план доработок
  • Спроектировано 9 прототипов уникальных страниц
  • Написано техническое задание на реализацию каждой итерации проекта
  • Создано 9 дизайн-макетов уникальных страниц, макеты модальных окон и новой шапки
  • Сверстано столько-же страниц и написано много-много строк кода
  • Настроена аналитика и подведены итоги

Сроки реализации 5 месяцев 2016 года

Доработка сайта интернет-магазина «Шкаф Сегодня»

Связаться с нами