современный сайт
без потери трафика
поток заказов
Используемые инструменты и технологии
php
git
nginx
аспро
forie
preact
bitrix
Предполетный бриф
Ретейнеры, капы, электрические и классические щетки, индикаторы зубного налета, флоссы — на сайте клиента тысячи позиций. Взрослые и маленькие покупатели находят все, что нужно для правильного ухода за зубами и деснами.
Dent Mart с 2010 года продает и доставляет товары по РФ и за границу через сайт и маркетплейсы. Интернет-магазин работает с 2012. За такой срок появилась необходимость обновить сайт: сделать его более современным, удобным для пользователей и сотрудников.
Особенности проекта
Наша цель — перенести сайт на новый шаблон 1С-Битрикс из магазина Аспро. Но шаблон не всегда означает легкое решение. В техническом задании появилось много новых функций. Они не были заложены в шаблоне, а значит, на их написание и интеграцию нужно время.
Подготовка
Перед нами стояли 3 глобальные задачи:
- Обновить дизайн. Для этого нужно провести анализ UX/UI-дизайна от клиента, внести правки в макет и сверстать сайт.
- Расширить возможности. В шаблоне не хватало ряда функций: добавление уценки, прокрутка блока рекомендаций, корректировка состава корзины из карточки товара.
- Интеграция с МойСклад. Сотрудники Dent Mart заполняли много карточек товаров вручную — обмен данными работал не правильно.
Дизайн
По новой UX/UI-концепции сайт разработали в цветах, которые традиционно ассоциируются с медициной — синий и белый. Главные характеристики:
- белый фон
- спокойные цвета
- безрамочные блок
- объемные кнопки с анимацией
В каталоге понятная структура: система фильтров по ценам, акциям и производителям, перелинковка на товары из смежных категорий. Пользователь может выбрать удобный вид каталога: сетка или список.
Все категории в каталоге иллюстрированы — при наведении появляется соответствующая иконка. Работает и классический функционал интернет-магазинов: разделы «Сравнение», «Избранное».
Расширяем возможности
Появилось много деталей, которых раньше не было на сайте. Покупателям зубных паст важно знать о наличии фтора в составе, покупателям флоссеров — о материале нити, а людям с брекетами — диаметр щетинок в специальных ершиках. Для каждого товара мы настроили вывод только нужных характеристик без прочерков и пустых полей.
Написали инструкцию для сотрудников магазина — теперь они могут выводить свойства товаров через админ-панель без участия программистов.
Что еще доработала команда
- Вывод отзывов из Яндекс Маркета
- Пользовательские функции в корзине
- Акционную и бонусную системы
- Отображение подборок товаров на главной
- Автокоррекцию запросов в поиске
- Авторасчет стоимости доставки
Итоговый функционал сайта протестировали на двух фокус-группах: тестировщиках и обычных пользователях. После нескольких тестов и правок вынесли вердикт: процесс поиска, выбора и заказа товара получился максимально удобным.
Техническое решение
На этапе интеграции мы столкнулись с главной сложностью.
Из системы МойСклад в 1С:Битрикс информация проходида отлично, а вот в обратную сторону нет. Это повышало риск неприятных ситуаций для клиентов и магазина. Даже если товар заканчивался на складе, на сайте его все еще можно было купить.
Решение оказалось непростым. Нужно было сопоставить каталоги в МойСклад и 1С:Битрикс, найти различия и унифицировать структуру. У долгого и кропотливого процесса был понятный результат — полная синхронизация баз данных.
Раньше сотрудники Dent Mart заполняли карточки товаров дважды: сначала в системе МойСклад, а затем в админ-панели сайта. Сегодня они делают это один раз. Мы составили подробные инструкции по вводу данных, чтобы на сайте всегда отображались правильные названия и артикулы товаров, а на складе не возникало ошибок при отправке заказов.
Всегда приятно делать чью-то жизнь легче. Мы сдали проект, зная, что клиент получил готовую автоматизированную экосистему, а не источник головной боли. Благодаря правильной работе всех систем команда магазина экономит время на рутине, ведет процессы без сбоев и форс-мажоров.
Оцениваем результат
Финальный этап — тестирование, правка мелких багов. И, конечно, базовая SEO-рутина: настройка редиректов, мета-тегов, файлов sitemap и robots, установка счетчика Яндекс Метрики.
Переезд сайта прошел быстро и безболезненно — без потерь трафика и заказов. Интернет-магазин продолжает приносить прибыль, а наша команда продолжает работу с проектом уже в рамках SEO-продвижения.
Иногда идеи для улучшения продукта приходят уже в процессе разработки. Мы к этому готовы: обсуждаем, ищем лучшие пути решения задач, тестируем. После релиза сайт отличается от макета в лучшую сторону. Здорово, что у нас получилось дать клиенту больше пользы, чем ожидали на старте.