Личный кабинет клиента для небольшого страхового брокера, который продаёт ОСАГО и КАСКО: действующие полисы, продление онлайн, загрузка документов и статус выплаты на одном экране. Создание сайта и кабинета — работа Евгения Рослякова. Сайты он делает с 2016 года, оформлен как самозанятый, подписывает договор до старта, а юрлицам отдаёт закрывающие документы. Работает из Москвы и удалённо.
У брокера несколько тысяч клиентов, и почти всё общение шло по телефону. Один звонил узнать, когда кончается полис. Другой — отправить фото паспорта. Третий — спросить, дошло ли заявление по ДТП и когда ждать деньги. Менеджеры полдня отвечали на одни и те же вопросы, а продлением занимались вручную, когда срок уже поджимал.
Нужен был кабинет, где клиент сам видит свои договоры и сам делает типовые вещи. Менеджер подключается там, где нужен живой человек. Данные остаются в CRM брокера: вторую базу вести никто не хотел.
Кабинет должен нормально работать с телефона. Его открывают на парковке, в очереди, сразу после аварии, так что тяжёлые экраны и длинные формы отпадали.
Сперва мы с руководителем брокера прошли по журналу звонков и выбрали четыре сценария, ради которых люди звонят чаще всего: посмотреть действующие полисы, продлить, загрузить документы, узнать статус выплаты. Всё остальное отложили на потом.
Сайт собран на Next.js. Публичные страницы — калькулятор и описание продуктов — отдаются с сервера: быстро открываются и попадают в поиск. Кабинет за авторизацией написан на React.js: список полисов, карточка договора, мастер продления.
Мастер продления — форма из нескольких шагов: данные автомобиля, водители, расчёт, подтверждение. Человек может закрыть вкладку на третьем шаге и вернуться через день. Поэтому шаги, черновик, загруженные файлы и статусы запросов лежат в Redux.js. Без общего хранилища такая форма быстро превращается в клубок из пропсов.
Код написан на Typescript со строгими настройками. Полис, водитель и выплата описаны типами, и когда в CRM меняется поле, сборка сразу показывает, что сломалось. В страховании это важно: неверная дата окончания стоит клиенту денег.
Со стороны CRM стоит слой GraphQL. Экран запрашивает ровно те поля, которые ему нужны, а внутренние поля системы наружу не уходят. Клиент видит только свои договоры, права проверяет сервер, а не браузер. Загруженный документ попадает в карточку клиента в CRM, а менеджеру приходит задача на проверку.
Клиенты продлевают полис сами: приходит напоминание, они заходят в кабинет, проверяют данные и подтверждают. Документы по страховому случаю загружаются с телефона, статус выплаты виден без звонка.
Менеджеры реже отвечают на однотипные вопросы и занимаются тем, что требует разговора: сложными расчётами и спорными случаями. Данные по-прежнему лежат в одной CRM, лишних копий нет.
Одно изменение брокер заметил не сразу. Раньше срок окончания полиса помнил конкретный менеджер, и если он уходил в отпуск, клиент мог остаться без защиты. Теперь дату видит и сам клиент, и все сотрудники брокера.
Дальше обсуждали оплату прямо в кабинете и страхование путешествий. Экраны, состояние и слой данных разделены, так что добавить это можно без переделки основы.
Если у вас есть CRM, а клиенты всё равно звонят с одними и теми же вопросами, пишите мне в личные сообщения на freelance.ru. Расскажите, о чём спрашивают чаще всего, и прикинем, что вынести в кабинет.
