Главное о кейсе
Провели полный редизайн магазина. В пять раз сократили дерево элементов (DOM) страницы от исходного. В результате сайт быстрее загружается и отзывчивее реагирует на действия пользователя. В процессе редизайна сократили «высоту» мобильной версии большинства страниц сайта вдвое без потери функциональности.
Оптимизировали запросы к БД и кеширование на страницах каталога, товаров и акций. Итоговое ускорение сайта от 3 до 8 раз в зависимости от страницы.
Запустили новый одностраничный чекаут.
Подключили оффлайн программу лояльности, разработали схему сопоставления владельцев физических бонусных карт и пользователей на сайте, собрали недостающие анкетные данные для дальнейших маркетинговых действий. Реализовали отображение баланса бонусов в личном кабинете, списание и начисление бонусов за покупки онлайн, подарочные бонусы с ограниченным сроком действия.
Запустили в интернет-магазине сервисы, уже доступные оффлайн-покупателям гипермаркетов — прокат товара, калькуляторы расчета количества товара по параметрам помещения, и т.п.
Бизнес-задача и ее решение
Нам нужно было заново cпроектировать интерфейсы интернет-магазина, последовательно внедрить переработанные разделы без остановки работы сайта, интегрировать магазин с большим количеством внешних систем и запустить сервисы для клиентов.
Редизайн проводился ступенчато, мы внедряли каждый блок по мере готовности. Это позволило сразу вносить улучшения, не дожидаясь окончания редизайна и вёрстки всех разделов. Процесс внедрения был бесшовным и не создавал неудобств для пользователей.
Переработали логическую и визуальную структуру основного меню сайта и меню каталога. Чтобы ускорить работу сайта в браузере, меню сделали Vue-приложением. Поисковые системы индексируют всю нужную информацию с сайта, поскольку первый уровень категорий каталога находится в коде страницы.
Сделали совершенно новую структуру страницы товара. Сгруппировали все характеристики товара по категориям: основные, весогабаритные, параметры упаковки и так далее.
Важные характеристики сделали ссылками на фильтрацию по указанному значению в каталоге.
На странице каждого товара разместили раздел с сопутствующими товарами. Связи сопутствующих товаров между собой настраиваются в 1С.
Помимо самих товаров, клиентам часто нужны услуги: например, резка досок, колеровка красок или укладка ламината. Мы вывели на странице товара дополнительные услуги, которые можно оформить в корзине при заказе. Доступные услуги настраиваются для каждой товарной категории в 1С.
Добавили раздел «Документация», в котором можно скачать сертификат соответствия для любого товара. Товаров на сайте больше 100 тысяч, поэтому сертификаты не хранятся на сервере: при клике на ссылку «Получить сертификат» сайт обращается к 1С по API и запрашивает нужный сертификат. Архив распаковывается на сайте, и у пользователя открывается страница с сертификатом.
Запустили одностраничный чекаут (отдельное vue-приложение). Он имеет максимально облегченный дизайн и быстро ведет пользователя к покупке.
Интегрировали сайт с sms-шлюзом. Валидируем номер телефона в личном кабинете. Отправляем SMS-уведомления о смене статуса заказа, при этом есть возможность выслать не только шаблонный текст, но и написать необходимый текст вручную в админке сайта.
Интегрировали сайт с оффлайн бонусной системой, работающей на базе 1С.
Интегрировали сайт с Dadata и нормализовали данные уже зарегистрированных клиентов (порядок, регистр, опечатки).
Настроили проверку отпускной цены товара с учетом Стоп-цены. Скидки, акции и бонусы не могут уменьшить цену товара ниже стоп-цены. Стоп-цена по каждому товару настраивается на стороне 1С.
Прочая информация о кейсе
------
English case description is in
https://docs.google.com/document/d/12CP9QSxoP_Za8m4nAdmGtWr6UopARRRYWTIgtIfOrtg/edit?usp=sharing
------
Расширенное описание кейса редизайна со скриншотами, видео и было/стало:
https://braind.agency/cases/dobrostroy-redesign/
Описание интеграционных работ:
https://braind.agency/cases/dobrostroy-support/
Добрострой — сеть DIY гипермаркетов общей площадью более 60 тысяч квадратных метров. В сети продается более 100 тысяч товаров для строительства и ремонта.
Мы провели редизайн интернет-магазина, интегрировали проект с 1С по API, SMSC, DaData, Mindbox, Директ Кредит.
Запустили сервисы для покупателей: программа лояльности, прокат оборудования, калькуляторы (расчет материалов по параметрам помещения), отзывы о товарах «как на ali».
Скриншоты
Комментарий заказчика
Очень часто разработчики уходят в одну из двух крайностей. Первая крайность — слепое внедрение всех хотелок заказчика, чтобы было побольше человеко-часов на интеграции и переделки. Вторая крайность — подгонка бизнес-процессов заказчика под «прокрустово ложе» стандартных ИТ-инструментов.
Команда Braind, напротив, внимательно вникает в бизнес-процессы и в ходе совместного обсуждения с заказчиком находит оптимальное решение, интегрирующее базовую платформу (в нашем случае — 1С) и сайт.