От MVP до полноценной онлайн-витрины. Как запустить продуктовый каталог поэтапно

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

Есть третий путь — поэтапный запуск, который начинается с «минимального жизнеспособного продукта», MVP. Он позволяет не затягивать сроки и быстро выйти на стабильные онлайн-продажи. Рассказываем, что должно попасть в первый релиз каталога и как мы в Uplab разбиваем сложные e-commerce проекты на понятные этапы.

Какие задачи решает первый релиз

Что такое MVP и почему разработчики выпускают такие версии, мы уже писали в отдельной статье. В e-commerce у «минимального жизнеспособного продукта» одна задача: провести клиента по всему пути, от изучения карточки товара до заказа. Остальное — личный кабинет, конфигуратор, персональные цены — делает этот сценарий удобнее для клиента и продавца, но может подождать своей очереди.

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

Разберем по шагам, как собрать первый каталог и развить его после запуска — на примерах проектов Uplab.

Шаг 1. Разберитесь, кто и зачем заходит в каталог

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

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

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

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

Шаг 2. Проведите границу первого релиза

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

Для ГК «Атриум» мы провели такую границу на этапе аналитики, еще до первых макетов. В текущий этап вошли каталог-витрина, корпоративная часть и HR-раздел — восемь разделов с описанным составом каждой страницы. За границу вынесли личные кабинеты и сложные калькуляторы. Отдельной задачей стало объединение двух каталогов: горелки и котельные раньше жили на разных сайтах холдинга.

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

Шаг 3. Соберите минимальный состав каталога

Вот что входит в первую версию каталога почти всегда:

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

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

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

Шаг 4. Решите, откуда каталог берет данные

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

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

Шаг 5. Посмотрите, что люди на самом деле ищут

После релиза каталог начинает отвечать на вопросы, по которым ранее были только догадки. Смотреть стоит на четыре вещи:

• запросы во внутреннем поиске, которые не дали результата;
• фильтры, которыми пользуются, и фильтры, которые никто не трогает;
• страницы, с которых люди уходят, не дойдя до формы;
• долю посетителей, которые дошли до формы и отправили заявку.

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

Целевые показатели полезно зафиксировать заранее, до запуска. Для «Водокомфорта» мы это сделали: рост трафика и заявок, увеличение времени на сайте, снижение отказов до 10–15%. Без конкретных ориентиров любой результат можно объявить успехом.

Шаг 6. Наращивайте функционал на основе данных

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

Хороший пример такого функционала — конфигуратор для проекта «Северсталь Стальные Решения». До него посетитель сайта видел общее описание возможностей, но не мог оценить ни внешний вид будущего здания, ни его стоимость. Узнать цену можно было только через заявку, звонок или обращение в отдел продаж. Часть обращений приходила без технических параметров, и менеджер тратил время на переписку ради уточнений.

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

Конфигуратор сделали отдельным подсайтом: публичная часть осталась на 1С-Битрикс, а конфигуратор работает на Nuxt, Three.js и WebGL. Контент и справочники редактируются в привычной для клиента среде, а новый функционал развивается независимо и не задевает остальной сайт.

В каком порядке добавлять функции

Приоритет задают данные из шага 5. Но если статистики пока мало, отталкивайтесь от порядка, который в B2B-каталогах работает чаще других — от дешевого к дорогому и от частого к редкому:

1. Подбор по параметрам и сравнение товаров. В «Атриуме» подбор выдает до пяти подходящих горелок по топливу, давлению и мощности и рисует схему работы по четырем-шести точкам.
2. Умная форма запроса. Там же работает «единое окно»: интерактивный опросник собирает данные под тип обращения, а заполненную форму можно скачать и загрузить обратно документом.
3. Личный кабинет с историей запросов и персональными ценами. Появляется, когда клиенты возвращаются регулярно.
4. Конфигуратор или калькулятор. Оправдан там, где товар собирается из параметров, а цена зависит от их сочетания.
5. Инструменты для маркетинга: конструктор промо-страниц, подборки, сценарии рассылок.

Архитектуру закладывают заранее. В «Атриуме» мы спроектировали платформу с запасом на эти шаги. Личный кабинет, калькуляторы и новые интеграции добавляются без перестройки. Границу первого релиза провели жестко: запас оставили в структуре данных, а не в объеме работ.

Как понять, что вы застряли на MVP

Каталог застревает на первой версии не потому, что закончился бюджет. Обычно дело в одной из трех причин:

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

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

Расскажите про свой каталог — предложим состав первого релиза и план развития по этапам.