Изображение предоставлено агентством Kotelov с сайта https://kotelov.com/
Плюс Личный кабинет с функционалом конструктора товаров. Кейс агентства KOTELOV о том, как это реализовали разработчики.
Заказчик проекта: УЮТ — один из крупнейших производителей солнцезащиты и декора окна в России и СНГ, предлагающий:
– Карнизы
– Рулонные шторы
– Горизонтальные и вертикальные жалюзи
– Шторы плиссе
– Продукция с электроприводом
Ориентация на B2B: работает через сеть дилеров.
Сложности разработки: многообразие дизайнерских товаров и модификаций, требующее тщательной проработки и управления ассортиментом.
Задачи проекта:
- Создать Личный кабинет:
– Пользователи могут оформлять заказы и управлять своими данными.
- Разработать Онлайн-конструктор товаров:
– Возможность пользователям настраивать и визуализировать товары в реальном времени.
- Автоматизация передачи заказов:
– Интеграция с производственной базой данных для автоматической передачи и обработки заказов.
Цель: минимизация времени обработки заказов и снижение человеческого фактора.
Решение
Ситуация до реализации проекта
Сложная интеграция производственной базы данных, использующей технологии 1980-1990-х годов, потребовала 25 лет разработки.
Отсутствие онлайн-заказов ограничивало возможность оформления, требуя отправки заявок только по электронной почте. Не существовало возможности собирать заказы в конструкторе и визуализировать конечный товар.
Менеджеры салонов тратили много времени на составление и согласование заказов. Сотрудники УЮТа обрабатывали сотни звонков и писем, что часто приводило к потерям информации, затягиванию сроков и усложнению процессов.
Проблема заключалась в том, что клиенты могли выбирать только из бумажного каталога, требующего постоянного обновления, а сайт не позволял менеджерам демонстрировать сочетания цветов и материалов.
Менеджерам приходилось звонить в УЮТ для проверки наличия конкретных цветов и тканей, при этом они не могли показать, как будут выглядеть цвета, отсутствующие в каталоге.
Необходимо было создать систему, позволяющую менеджеру открывать сайт с ассортиментом и демонстрировать клиенту комбинации любых расцветок и компонентов, находящихся в наличии.
Ситуация после реализации проекта
В пять раз быстрее для сотрудников
Ранее сотрудники УЮТа в приемке получали заявки от менеджеров салонов в виде звонков и писем, что требовало ручного ввода параметров заказа.
Сейчас они получают только письма с готовыми параметрами, автоматически создаваемыми в производственной базе данных. Скорость обработки заказов увеличилась минимум в 5 раз.
В пять раз быстрее для дилеров
Раньше менеджеры должны были звонить или вручную заполнять заявку в письме, тратя много времени на создание каждой заявки. При найме нового продавца ему необходимо было изучить ассортимент продукции по каталогу, вручную заполнять бланки заказа и отправлять их по e-mail, что приводило к временным затратам на обучение и ошибкам.
Теперь заказ собирается автоматически при выборе необходимых параметров. Вместо длительных заполнений все можно сделать в несколько кликов. Производительность менеджеров увеличилась в 5 раз, что позволяет салону обрабатывать больше заказов и улучшать качество и скорость обслуживания. Новые продавцы быстро осваиваются в системе и могут оперативно приступить к работе, не жертвуя качеством.
Вызовы проекта
Интеграция клиентской базы
Задача:
Интеграция со сложной базой данных, содержащей более 10 000 клиентов и огромное количество товаров.
Сложности:
Сопоставление полей и передача больших объемов данных. У каждой компании минимум 3 заполненных пункта информации, каждый из которых содержит 11 полей. Это создает значительный массив данных, требующий правильной сортировки и организации интеграции информации в нужные поля.
Реализация:
Частичная интеграция старой базы данных в новую. Интегратор создал прослойку, позволяющую извлекать информацию из старой базы и корректно интегрировать эти данные в новую.
Для автоматизации процесса разработан функционал, который подтягивает данные клиентов по уникальному ID из старой базы.
Текущий процесс:
Когда менеджер УЮТа хочет создать аккаунт действующего клиента в новой базе, достаточно найти его ID в старой базе, ввести его в новую и все данные автоматически подгружаются.
Результаты:
Частичная интеграция базы позволила значительно сократить затраты ресурсов, избежать дублирования клиентских данных и сохранить бизнес-процессы компании.
Интеграция производственной базы
Задача:
В УЮТе более 1 000 000 000 комбинаций готовых изделий. Необходимо реализовать сборку товара в режиме конструктора с корректной отправкой в производство. Формат маркетплейса с готовыми товарами для этого не подходит. Главной сложностью является работа со старой базой, где критична точность сопоставления полей и исходящих данных, иначе заказы будут отображаться некорректно.
Реализация:
Каждый модификатор при выборе привязывается к нужному полю в производственной базе данных. Во время создания заказа для каждого товара выполняется расчет, состоящий из 66 000 строк, так как каждый товар может иметь до 18 уникальных модификаторов. Все данные вносятся в производственную базу данных.
Процесс раньше:
Менеджер салона вручную заполнял бланк заказа, отправлял его по email, после чего заказ приходил в приемку. Сотрудник УЮТа вручную перенабирал заказ, и только после этого начиналось производство.
Текущий процесс:
Заказ автоматически формируется в производственную базу данных и сразу направляется на производство.
Разработка
Задача:
Переход от другой команды потребовал очистки кода и вникания в предыдущую работу. Необходимость переписать 70-80% бэкенда с нуля.
Процесс:
– Технологический стек:
Продолжили использовать Vue2, чтобы сохранить совместимость с дизайном, частично подготовленным заказчиком. Некоторые разделы были доработаны совместно с командой.
– Рефакторинг кода:
Проведен рефакторинг, удалено 4000 строк ненужного кода; написано 2500 строк нового кода. Устранены повторяющиеся строки и «костыли».
– Интеграция клиентской базы данных:
Информация по более чем 10 000 клиентам интегрирована в личный кабинет без дублирования данных.
– Связывание товаров:
Связали модификаторы товаров (300+) с товарами в базе данных УЮТа для корректной передачи данных в производственную базу.
– Автоматизация создания заказа:
Заказ в производственной базе УЮТа формируется автоматически, что позволяет немедленно начинать производство без лишних согласований.
Начало интеграции
Первый месяц:
Завершили 80 задач со стороны фронта, прежде чем перейти к интеграции. Основная задача заключалась в интеграции товаров, клиентских баз данных, адресов доставки, грузополучателей и онлайн-расчета цен.
Процесс интеграции:
- Изучение системы интеграции:
Первая задача заключалась в понимании системы интеграции, что значительно усложняло процесс.
- Интеграция товаров:
Связали все товары на фронте с их сущностями в производственной базе, что обеспечило корректную передачу данных.
- Вывод клиентских данных:
Реализовали отображение клиентских данных, адресов и грузополучателей в личном кабинете.
- Интеграция расчета цен:
Выполнили интеграцию расчета цен на товары в режиме реального времени, что обеспечило актуальность информации.
- Автоматизация создания заказов:
Реализовали автоматическое создание заказов в производственной базе данных УЮТа, что существенно упростило процесс.
- Создание раздела “Мои заказы”:
Добавили отображение всех заказов с возможностью детального просмотра каждого заказа.
Функционал конструкторов заказов
– Сборка картинки позиции заказа:
Каждая картинка позиции формируется конструктором и сохраняется в разделе “Мои заказы”.
– Устойчивость к изменениям:
При удалении какой-либо позиции из линейки продуктов, картинка останется доступной и действующей для пользователя, который сформировал ее ранее. Это обеспечивает сохранность информации о заказах, независимо от изменений в доступных товарах.
Улучшение функционала отображения картинок товаров
Ранее:
– Картинка товара формировалась из позиций, доступных на сайте.
– При удалении одной из позиций, изображение ломалось и не отображалось, что создавало негативный опыт для клиента.
– Например, если заказ был сформирован полгода назад, клиент мог столкнуться с “поломанной” картинкой.
Теперь:
– Картинка формируется из уникальных ID товаров, интегрированных в базу данных.
– Сохранение выполняется в разделе “Мои заказы”, что обеспечивает долговечность изображений.
– При выводе товара из линейки продуктов, картинка останется в личном кабинете клиента.
– Даже через год клиент сможет вернуться и увидеть сохраненную композицию; изображение будет корректно отображаться.
Это значительно улучшает пользовательский опыт и минимизирует вероятность разочарования.
Профиль пользователя
В профиль пользователя подтягиваются следующие данные:
– ID пользователя: Уникальный идентификатор.
– Логин: Используемый для входа в систему.
– ФИО: Полное имя пользователя.
– Данные о компании: Название и реквизиты компании.
– Адрес доставки: Полный адрес, используемый для доставки.
– Данные грузополучателя: Информация о лице, которому будет доставлен товар.
Эта информация обеспечивает возможность быстрого доступа к персональным данным и упрощает процесс оформления заказов.
Возможности личного кабинета пользователя
– Замена логотипа: Пользователь имеет возможность изменить логотип в шапке личного кабинета на собственный.
– Онлайн-конструктор:
– Дилеры могут собирать товары под брендом своего салона.
– Установка своих цен на товары.
– Возможность формирования заказа в присутствии клиента, что обеспечивает интерактивный и персонализированный процесс покупки.
Эти функции повышают уровень персонализации и улучшения взаимодействия с клиентами.
Админский кабинет
В админском кабинете доступны следующие функции:
– Настройка модификаций товаров:
– Добавление тканей: Возможность добавлять новые материалы для товаров.
– Новые цвета: Добавление цветовых вариантов для продукции.
– Изменение комплектации: Настройка комплектации товаров, позволяющая адаптировать предложения под различные потребности клиентов.
Эти функции обеспечивают гибкость и позволяют оперативно обновлять ассортимент в клиентской части конструктора.
Интеграция производственной базы данных и улучшения в системе
- Интеграция с производственной базой:
– Ранее: отсутствовала полноценная интеграция с клиентской базой, требовалось вручную заполнять данные при создании клиента.
– Настоящее время: профиль пользователя доработан с добавлением всех необходимых полей для хранения клиентских данных.
- Автоматическое подтягивание данных:
– При создании нового клиента все необходимые данные автоматически подтягиваются по его ID из производственной базы.
- Упрощение процесса формирования заказа:
– Дилеры теперь могут самостоятельно выбирать адрес доставки и грузополучателя при создании заказа.
– Поддержка нескольких адресов доставки и грузополучателей для одной компании-дилера.
– Шаблоны: один раз заполненные адреса и грузополучатели позволяют быстро организовывать логистику в несколько кликов.
Эти улучшения значительно повышают эффективность работы дилеров и упрощают процесс управления клиентскими данными и заказами.
Результат решения задач
