Специалисты проекта
Стек технологий
О проекте
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-программист
Александр
Аналитик