Строительный БУМ

Провели конкурентный анализ и разработали новую информационную архитектуру сайта

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

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

Выписали интересные решения и составили фич-лист (ниже скрин с частью анализа).

И небольшая часть фич-листа. 

Дополнили фич-лист своими наработками, согласовали с клиентом и собрали новую информационную архитектуру сайта. 

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

Дизайн

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

В «СтройБУМе» 100 000+ товаров, поэтому дизайн должен был не отвлекать от главного, а помогать выбирать. При этом важно было сохранить ДНК бренда: перенести айдентику офлайн-магазинов в диджитал и собрать современный, понятный интерфейс.

Мы предложили сдержанную концепцию в фирменных цветах бренда и согласовали её уже со второй итерации.

И вот как теперь выглядят основные экраны. 

Разработка

Мы выбрали RESTful-архитектуру: 1С-Битрикс использовали как API, а фронтенд собрали на Vue/Nuxt. Это позволило снять ограничения платформы, повысить безопасность, обеспечить масштабируемость и реализовать PWA, чтобы сайт работал быстро, стабильно и выдерживал рост нагрузки. 

Дополнительно подключили инструменты, которые делают проект управляемым и прозрачным:

— storybook — чтобы изолированно разрабатывать и тестировать интерфейсные компоненты. Это ускоряет работу и снижает количество визуальных ошибок*

— swagger — для понятной и актуальной документации API. Удобно и для текущей команды, и для тех, кто подключится позже*

— grafana — для мониторинга состояния системы и быстрого реагирования на возможные сбои.

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

Параллельно синхронизировали интернет-магазин и 1С

1С выступает мастер-системой — все изменения товаров идут именно из неё и автоматически появляются на сайте. Например, так формируется каталог сезонных товаров. 

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

Настроили CRM для автоматизации оффлайн-заказов

У «СтройБУМа» в b2b-направлении за каждым городом закреплён свой представитель. Он работает «в полях» — приезжает к партнёру и заключает сделку на месте.

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

Мы настроили CRM так, чтобы представители могли действовать автономно:

 — формировать заказ прямо на встрече;

 — видеть актуальные остатки;

 — автоматически применять свои цены;

 — собирать и отправлять КП клиенту в моменте.

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

А ещё параллельно реализовали множество интеграций

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

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

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

А ещё: 

— интегрировали Yandex SmartCaptcha, чтобы защитить сайт от спама и ботов. Это повысило безопасность сервиса;

— подключили DaData, чтобы при вводе ИНН автоматически подтягивались данные компании: название, юр адрес и другие реквизиты. Это ускорило оформление заказов и снизило количество ошибок.

Главные решения и новые функции

Доработали поиск — добавили удобную фильтрацию и сортировку. Теперь пользователю удобнее ориентироваться в большом ассортименте товаров. 

Для повышения лояльности добавили персональные предложения для авторизованных пользователей и сезонные подборки.

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

Получилась MVP-версия умного калькулятора, который помогает покупателям правильно рассчитывать кратность упаковки строительных материалов. 

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

А ещё напрямую через 1С на сайт подтягиваются сертификаты качества товара. Так информация всегда остается актуальной и не занимает время сотрудников на ручное обновление. 

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

Добавили страницы «Сравнение товаров» и «С этим товаром покупают», чтобы пользователю было проще выбрать и собрать корзину, а бизнесу — увеличить средний чек.