B2B-портал для российского производителя принтеров и расходных материалов

«Булат» — российская компания, имеющая более 100 фирм-партнеров из разных стран и собственные заводы. Производит расходные материалы для копировально-множительной техники и компьютерной периферии.

Цель проекта — разработка B2B-web-портала для автоматизации и оптимизации процесса продаж товаров компании и сторонних поставщиков/вендоров.

Задачи:

- Оптимизация процесса продаж в части создания инструментов активных продаж, повышения качества информирования клиентов о товарах, автоматизации выставления счетов на оплату, отображения статуса заказа и обработки обращений.

- Доработка «1С:Управление торговлей» и настройка обмена информацией с B2B-порталом.

- Разработка фирменного стиля маркетплейса, включая создание логотипа.

- Разработка универсального API для возможности интеграций любых систем с порталом.

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

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

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

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

Визуализация технического задания в виде прототипа (мы делаем его в «Фигме») помогает лучше понять описанную логику, выявить узкие места в описанных бизнес-процессах и переработать логику системы, где это необходимо. Например, при отрисовке процесса оформления заказа стало понятно, что необходимо добавить промежуточный шаг и обратную связь для пользователя, не учтенные в первой версии ТЗ.

Внутренние этапы написания технического задания:

Создание фирменного стиля для маркетплейса заказчика началось с разработки логотипа. Цвета логотипа стали основой для создания цветовой гаммы оформления B2B-платформы, а округлые формы задали стиль элементам (кнопкам, иконкам, рамкам, плашкам).

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

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

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

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

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

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

Особенности разработки B2B-портала для «Булат»

1. Различия в отображении информации на страницах каталога для авторизованных и неавторизованных пользователей из-за специфики отрасли заказчика, в частности с наличием поставщиков из разных регионов.

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

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

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

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

6. Для пользователей B2B-портала реализована возможность работы через API. Это позволяет настроить в личном кабинете интеграцию с ресурсами пользователя, получить временный API-токен и работать в привычных программах, например, делать закупки на портале из своей программы «1С».

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

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

9. Реализован функционал отслеживания всех заказов профиля в личном кабинете, а также получение информации о доставке (служба доставки, трек-номер, статус исполнения).

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

В рамках проекта для компании «Булат» был разработан MVP маркетплейса, который автоматизирует продажи и взаимодействие с поставщиками (вендорами). За счет сервис-ориентированной архитектуры B2B-портал легко развивать и изменять в зависимости от потребностей рынка, а лаконичный дизайн делает его удобным и понятным для пользователей.

Выполненные работы:

 - проведение комплексного предпроектного обследования с составлением подробного технического задания и разработкой прототипов;

 - создание фирменного стиля маркетплейса с разработкой логотипа и уникальных графических элементов;

 - разработка в тестовой среде веб-ресурса по утвержденному ТЗ и макетами;

 - доработка «1С:Управление торговлей» для нужд заказчика и настройка двусторонней интеграции B2B-портала;

 - наполнение контентом, проведение автоматизированных и ручных тестов и перенос готового кода на сервер.

Отдельно хотим поблагодарить руководство «Булат» за то, что они всегда выделяли достаточно времени на встречи, полноценно участвовали в разработке и проектировании системы, что позволило быстро принимать и согласовывать ключевые решения.