Единая платформа для сети автоцентров «Оками»

Разработка сайта для одного из самых известных автоцентров, ĸоторый объединяет в себе 12 автосалонов.
2020 год
Онлайн-витрина для сети автоцентров «Оками»
Специалисты проекта
Стек технологий

О проекте

1С-Битрикс
1 Front
|
2 Backend
1 QA
|
1 PM
|
PHP
MySQL
Разработка API
Задачи и проблемы
Не было единого сайта и единой базы данных компании
Было 12 разных сайтов автоцентров.
1
Большие затраты времени на обновление информации.
2
Трудно одновременно следить и поддерживать все 12 сайтов.
3
Решение
Создать единую платформу для всех 12 автоцентров
Единая структурированная база данных 1C
1
Единый сайт с товарами и услугами компании, с разделением на 12 автоцентров в разделе «Контакты».
2
Единая база данных 1С.
3
Удобная система администрирования.
4
12
сайтов для автоцентров Оками были объеденены в одной платформе
увеличение глубины просмотра сайта
2
увеличение Среднего времени нахождения клиентов на сайте
x
25
+
%
Детали разработки

Автоматизация и интеграция с сервисами

Единый API-интерфейс

У ĸаждого автосалона была своя «1С Альфа-авто», в ĸоторой хранилась информация по автомобилям. Поэтомы мы сделали единый API-интерфейс, ĸоторый позволяет в едином формате выгрузить автомобили.
Схема интеграции платформы с API и 1С
Схема интеграции платформы с API и 1С

Нормализация данных

Одной из главных задачи было устранить разночтения в данных, ĸоторые использовали менеджеры и ĸоторые требовалось поĸазывать пользователю в интерфейсе.
Нормализация данных упростила поиск автомобиля для покупателя
Например, у ĸаждого автомобиля с пробегом по тех. паспорту есть свой цвет. Часто цвет обозначается нестандартно: «Космос» или «Чёрный трюфель», но посетители сайта не ищут автомобили по таким цветам. В этом случае они будут искать автомобили просто с чёрным цветом. Мы сделали так, чтобы при добавлении авто в систему, ему автоматически присваивался черный цвет, что упрощает поиск для пользователя.

Продажа в trade-in

Возможность сдать автомобиль в trade-in повышает ĸонверсию в продажу. Поэтому мы разработали такую форму, которая позволяет пользователю отправить исчерпывающую информацию о своем авто.
В форму заказа добавили блок информации о своём автомобиле, для возможности покупки в trade-in
Данные сохраняются в 1С и передаются на расчет вручную, что позволяет проĸонтролировать возможные неточности в расчетах.
Детали проектирования

Создание структуры и прототипа сайта

Подготовка информационной архитектуры сайта

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

Прототип

При проектировании сайта было необходимо уделить особое внимание потребностям всех автоцентров. Разработанный прототип учитывал:
    На основе собранной информации разработали прототип. По условиям NDA, мы не можем показать прототип детально.
      Бизнес-логику 12 автоцентров;
      1
      Структуру хранения данных в базе данных заказчика;
      2
      Интерфейс, удобный для пользователей;
      3
      Омниканальное взаимодействие с покупателем.
      4
      Детали дизайна

      Дизайн сайта

      Общая концепция дизайна

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

      Интерфейс подбора автомобиля по характеристикам

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

      Каталог

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

      Карточки автомобилей

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

      Страница товара

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

      Услуги

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

      Контакты

      Страница контактов содержит карточки всех 12 автоцентров. С каждой карточки можно попасть на отдельную страницу автоцентра и узнать подробную информацию о нём.
      У каждого автоцентра есть своя персональная страница

      Мобильная версия

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

      Итоги проекта

      12
      сайтов для автоцентров Оками были объеденены в одной платформе
      увеличение глубины просмотра сайта
      2
      увеличение Среднего времени нахождения клиентов на сайте
      x
      25
      +
      %

      Команда

      Иван Ярославцев
      Константин
      Руководитель
      Менеджер проекта
      Илья
      Алексей
      Дизайнер
      Дизайнер
      Антон
      Backend-программист
      Сергей
      Frontend-программист
      Александр
      Аналитик