01 — Контекст
В автомобильной отрасли существует проблема учета автопарка: для хранения, учета и обновления данных об автомобилях использовались excel-таблицы, заполнять которые приходилось вручную. Массив данных был такой большой, что работать с этим стало сложно. Клиент увидел в этой ситуации возможность создать такой инструмент, который поможет систематизировать массив данных и облегчить работу с ними.
Клиент обратился к нашей команде с пониманием этой проблемы и прототипами интерфейсов системы, которая могла бы ее решить.
Разработать MVP облачной системы для учета автосалонов. Необходимо было создать сервис, который позволит:
автоматизировать работу учета автопарка;
перенести в облачное хранилище;
сделать рутинную ручную работу более понятной и удобной.
Технологии и архитектура
Продукт создавался с возможностью масштабироваться в будущем, поэтому наша команда брала технологии, которые доступны для широкого круга подрядчиков, минимизируют ошибки и легко обновляются.
Технологии и архитектура
Backend
Для написания бэкенда проекта мы использовали PHP Laravel 8.2.
Данная технология выбрана неслучайно — продукт будет модернизироваться, расширяться и обновляться. А поддерживать и расширять функциональность проекта, написанном на Laravel, не составит труда, благодаря продуманному коду и большому количеству разработчиков, работающих с данным фреймворком.
В качестве административной панели мы взяли Laravel Nova.
База данных — PostgreSQL.
Система очередей (для выполнения отложенных задач) — Redis.
Технологии и архитектура
Frontend
Фронтенд мы написали на React — одном из наиболее популярных инструментов для разработки в формате Single Page Application. TypeScript позволяет сделать код проекта более строгим и минимизирует вероятность синтаксических ошибок со стороны разработки.
Кроме этого, используются стейт-менеджеры — TanStack Query и Zustand. Работа с формами ведется на react-hook-form & yup. Сборщик проекта — Vite.
Технологии и архитектура
Архитектурная схема
На иллюстрации ниже представлена упрощенная схема разработанной системы
Этапы работы
Было только общее видение продукта и схемы бизнес-процессов, прежде чем приступить к разработке, мы изучили и оценили все вводные. Важно было четко сформулировать каждый этап и спланировать работу.
Этапы работы
Подготовительный этап
Итак, мы приступили к оценке проекта и формулированию потребностей заказчика. Каждую фичу обсуждали и согласовывали с клиентом. Это помогло синхронизировать работу с видением клиента и выбрать наиболее оптимальные инструменты разработки.
Мы определили, зачем нужна каждая из фичей, как они взаимосвязаны и как влияют друг на друга. В итоге для MVP оставили самый важный функционал и перевели его в конкретный бюджет и сроки, а остальное оставили на развитие.
Функционал
Управление системой построена на ролевой модели. Функционал расписан для трех типов пользователей: администратора, организации и менеджера.
Система позволяет хранить в себе большое количество информации об автомобилях:
— технические характеристики,
— историю поступления,
— документы,
— особенности автомобилей,
— которые выявлены при осмотре,
— информацию о затратах перед продажей,
— историю цены,
— аналитику маржинальности,
— информацию о продаже,
— всевозможные файлы и подробную историю изменений (кто и когда уменьшил или увеличил стоимость авто, изменил другие вводные данные об авто).
Доступ к такому количеству данных помогает вести процессы внутри автосалона максимально прозрачно.
Наша команда сделала так, чтобы организации могли самостоятельно корректировать и вносить данные в соответствии с их бизнес-процессами. Например, указать какие инструменты в продаже автомобилей используются, а у каждого инструмента указать стоимость.
Доступ сотрудника автосалона к этой информации помогает более качественно и профессионально презентовать клиенту автомобиль и облегчает процесс продажи.
Структура сервиса
Структура сервиса поделена на две части — административную и публичную панели. Так, в административной части продукта можно вносить, корректировать и обновлять информацию, которая выдается в публичной панели. Пользователи могут работать в публичной части, фильтруя данные об автомобилях.
Структура сервиса. Административная панель
Компании
В разделе можно вносить, изменять, хранить и дополнять данные обо всех автосалонах: название, ИНН, время создания и время последнего редактирования. К каждому отдельному автосалону можно прикрепить неограниченное число пользователей (сотрудников автосалонов).
Структура сервиса. Административная панель
Пользователи
При заведении данных о новом пользователе можно внести информацию о его имени, контактных данных, а также о часовом поясе для удобства связи с ним. Данные в карточке можно редактировать. Один пользователь может принадлежать сразу к нескольким компаниям.
Структура сервиса. Административная панель
Справочники
Все справочники, представленные в системе, делятся на внешние и внутренние. А внутренние, в свою очередь, — на статические и пользовательские.
Внешние справочники.
Внешние справочники реализованы с помощью интеграции с auto.ru. Это позволяет компаниям всегда иметь актуальный перечень марок, моделей, поколений и других свойств автомобиля, которые постоянно обновляются.
Внутренние статические справочники.
Значения данных в статических справочниках заданы на этапе разработки. При этом названия данных могут дополняться неограниченное количество раз. Редактировать данный справочник можно из административной панели.
Внутренние пользовательские справочники.
Эти справочники отображаются в публичной части у всех компаний. Первичные значения можно задать из административной части, а из публичной — отредактировать эти значения и добавить свои.
Структура сервиса. Публичная часть
Личный кабинет пользователя
Личный кабинет пользователя содержит в себе основную информацию о каждом сотруднике автосалона (имя, фото и контактные данные). В разделе «Система» пользователь может менять данные о формате времени и часовом поясе.
Структура сервиса. Публичная часть
Личный кабинет компании
Функционал личного кабинета компании позволяет управлять:
основной информацией о компании, которая содержится в карточке (название, город, адрес, график работы, номер телефона, электронная почта и сайт);
справочниками, которые содержат информацию о характеристиках автомобилей (виды расчета, группы, источники поступления, источники продаж, контрагенты, поставщики, группы, источники поступления, источники продаж, контрагенты, поставщики, статусы, типы контрактов и формы продаж);
ценами (можно проставлять соответствующие теги для каждого конкретного автомобиля: цена в рекламе, цена в кредит, цена за безналичный расчет, цена со страховкой).
Структура сервиса. Публичная часть
Список автомобилей
Раздел позволяет видеть информацию обо всех автомобилях на складе — все в одном окне.
На странице можно фильтровать весь перечень автомобилей на активные, архивные, неактивные и удаленные позиции. Кроме того, можно добавлять данные по новым автомобилям, которые только появились в наличии в автосалоне. Количество столбцов, отображаемое на странице, можно регулировать с помощью шестеренки в правом верхнем углу. Также в разделе сохраняются данные по истории действий. Сотрудник может отследить информацию работе предыдущего пользователя со страницей.
Структура сервиса. Публичная часть
Детальная страница автомобиля
Данный раздел содержит всю информацию о каждом отдельном автомобиле в салоне и позволяет управлять его характеристиками, информацией о поступлении, документами и данными, историей осмотра, затрат и цен, данными по истории продаж.
Результаты
Разработали MVP проекта, который включает в себя весь базовый и основной функционал. Весь процесс работы над проектом занял около 8 месяцев с последующей поддержкой.
Это перспективный проект, который в будущем будет расширяться до большого и сложного сервиса, в котором пользователи смогут отслеживать подробную аналитику, подключать систему подписки, следить за информацией о документах автосалона и информацией о сделках.
Планы
В ближайшее время проект будет доступен для использования сотрудниками автосалонов. После тестирования и получения обратной связи наша команда проведет еще один этап аналитики и сможет развернуть проект на широкий круг пользователей. В планах — отдать проект в автосалоны, протестировать, получить обратную связь, провести еще один этап аналитики и развернуть проект.
Связаться с нами
Хотите обсудить свой проект? Воспользуйтесь формой обратной связи и мы начнем общение.
.svg){kind=logo}
.svg)
.svg)
