Личный кабинет клиента «Катрен»

Ситуация

Бизнес-процессы компании «Катрен» обеспечивает комплекс сложных цифровых систем, интегрированных между собой. На момент обращения к нам для клиентов «Катрен» работал личный кабинет, однако он был создан под конкретную задачу и не предполагал значительного расширения функциональности. Нам предстояло создать принципиально новый продукт: расширить возможности взаимодействия клиентов с компанией в рамках одного сервиса с учетом разных ракурсов этого взаимодействия; как тех, которые планировались к реализации в ближайшей версии, так и будущих.

Бизнес-требования

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

Разработать удобный способ представления приоритетных (акционных) позиций.

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

Настроить интеграции с другими цифровыми системами «Катрен» и обеспечить адекватную скорость ответа.

Предоставить клиентам, подключенным к Apteka.ru, инструменты для работы с этим сервисом.

Снизить нагрузку на сотрудников, предоставив клиентам инструменты для самостоятельного доступа к данным от «Катрен».

Решение

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

Ключевые принципы в разработке:

- создаем решение, которое будет функционально расширяться по мере развития компании и среды;

- выбираем способы интеграции, которые позволят в будущем надстраивать необходимые инструменты;

- реализуем удобный поиск товаров и умную корзину — делаем выгоды понятными клиентам;

- минимизируем временные затраты клиентов и сотрудников «Катрен» на повторяющиеся рутинные операции

Функциональные задачи

Перенести реализованный функционал прежней версии ЛКК на новый стек технологий.

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

Настроить интеграции с системами заказчика через несколько разных интерфейсов.

Переработать элементы UI и дизайна с точки зрения удобства пользователя при многочасовой ежедневной работе с ЛК.

Модифицировать версии ЛКК с учетом системы пользовательских ролей.

Проектирование

На этапе проектирования для нас было очень ценным взаимодействие с командой заказчика. Специалисты из разных IT-департаментов помогли разобраться с принципиальными задачами и внутренними системообразующими продуктами. С первых дней и на протяжении всей работы по проекту мы в постоянном диалоге. Совместно проектируем технические и UI-решения, опираясь на особенности инфраструктуры, рекомендации и опыт команды «Катрен».

У личного кабинета простая и логичная архитектура с тремя основными разделами:

для работы с оптовыми онлайн-заказами;

для работы с документооборотом, возвратами и претензиями;

для аналитики и контроля работы с сервисом Apteka.ru.

В кабинете реализована система управления доступом на основе ролей. Роли позволяют клиентам «Катрен» самостоятельно контролировать доступ своих сотрудников к тем или иными данным и действиям.

Разделы

Оптовый онлайн-заказ

В прайс-листе «Катрен» более 35 000 позиций, доступных для заказа онлайн. Для удобства пользователей акционные товары выделены визуально. Пользователи могут находить товары по названию или свойствам, сохранять параметры поиска для повторяющихся заказов.

Логистика

В этом разделе пользователи могут оформлять претензии и возвраты, скачивать необходимые сертификаты, отправлять документы в ЭДО.

Apteka.ru

Специальный раздел доступен пользователям, чьи аптеки работают как пункты выдачи заказов с Apteka.ru. В нем отображена информация о статусах и движении заказов, статистика по отзывам.

Дизайн

В дизайне нам было важно не только осовременить интерфейс и соблюсти логику UI/UX, но и добиться визуального комфорта пользователя при многочасовой работе с сервисом. Для многих клиентов «Катрен» личный кабинет должен стать одним из основных рабочих ресурсов. Например, для менеджера сети аптек, который работает с документами в личном кабинете по несколько часов в течение дня.

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

Внедрение

В своих проектах мы часто берем ответственность не только за реализацию, но и за внедрение. В ноябре 2022 года мы запустили бета-версию личного кабинета и приступили к поэтапному подключению клиентов. Нам удалось реализовать переход из старой версии ЛКК в новую без изменения параметров авторизации и с минимальной нагрузкой на сотрудников «Катрен».

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

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

Результаты

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

Клиентам стало проще узнавать о наличии специальных предложений на товары и участвовать в акциях от «Катрен».

Клиентам, подключенным к Apteka.ru, стало доступно больше информации о заказах и выгодах от работы с сервисом.

Обновленный личный кабинет встроен в цифровую инфраструктуру «Катрен» с максимально упрощенными алгоритмами интеграции.

Время ответа сервиса сократилось, при выгрузке большого массива данных пользователь может продолжать работу с другими разделами ЛКК.  

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

Стек

Backend

Yii 2

REST API

Docker/Docker Compose

RBAC

Nginx

Design

Ant.design

Figma

Frontend

React/Redux

redux-saga

Antd

Typescript

Планы

Мы продолжаем работу по развитию и технической поддержке сервиса. В планах на следующие этапы проекта:

- дальнейшее развитие сервиса с добавлением новых инструментов;

- внедрение базы знаний и алгоритмов информирования пользователей;

- оптимизация бизнес-процессов посредством автоматизации документооборота;

- развитие дополнительного функционала в интеграции с Apteka.ru.