Энергогарант
Проектирование страховых сценариев с многошаговыми формами, автозаполнением, состояниями и подготовкой макетов к разработке.
Роль
UX/UI Designer
Период
Декабрь 2024 — февраль 2026
Сфера
Insurance · Web/Mobile · Forms
Команда
Продакт-менеджер, cистемный аналити, разработчики
О проекте
Энергогарант — российская страховая компания, работающая на рынке с 1992 года. Компания входит в число крупных страховщиков России, имеет рейтинг надёжности ruAA-, более 250 офисов по стране и около 3000 сотрудников.
Проект выполнялся командой Friflex: мы развивали цифровые сервисы Энергогаранта для оформления и сопровождения страховых продуктов.
Проект выполнялся командой Friflex: мы развивали цифровые сервисы Энергогаранта для оформления и сопровождения страховых продуктов.
Бизнес-задача
Переработать оформление ОСАГО из длинного калькулятора в пошаговый сценарий покупки полиса.
Пользователь мог начать оформление без входа в аккаунт, но для завершения покупки требовалась авторизация. Поэтому важно было встроить вход в сценарий так, чтобы сохранить введённые данные и не разрывать путь к оплате.
Пользователь мог начать оформление без входа в аккаунт, но для завершения покупки требовалась авторизация. Поэтому важно было встроить вход в сценарий так, чтобы сохранить введённые данные и не разрывать путь к оплате.
Моя зона ответственности
Я работал над ОСАГО, ипотечным страхованием, ДМС, страхованием танцоров, личным кабинетом и локализованными лендингами.
Моя задача — переводить требования и бизнес-логику в понятные интерфейсные сценарии: изучать конкурентные решения, собирать user flow, проектировать формы, состояния, модальные окна, ошибки и готовить макеты к разработке.
Моя задача — переводить требования и бизнес-логику в понятные интерфейсные сценарии: изучать конкурентные решения, собирать user flow, проектировать формы, состояния, модальные окна, ошибки и готовить макеты к разработке.
Процесс работы
Работу строил от входных требований к готовым сценариям: разбирал бизнес-логику, изучал похожие решения, собирал user flow и готовил состояния для разработки.
1
Разбор требований
Изучал ТЗ, бизнес-логику, ограничения страховых продуктов и обязательные данные для оформления полиса.
2
Уточнение логики
Если в требованиях не хватало деталей, фиксировал вопросы и уточнял спорные моменты через системного аналитика и бизнес.
3
Анализ конкурентов
Изучал, как страховые сервисы оформляют ОСАГО: структуру шагов, авторизацию, автозаполнение, проверку данных и оплату.
4
Подготовка к разработке
Собирал пользовательские сценарии, проектировал формы, состояния, модальные окна, ошибки и готовил макеты с пояснениями для разработки.
Анализ конкурентов
Я изучил, как крупные страховые сервисы и агрегаторы выстраивают оформление ОСАГО: структуру шагов, авторизацию, автозаполнение, проверку данных и оплату.
Ренессанс Страхование
Альфа
Страхование
Страхование
Сбер
Страхование
Страхование
Т - Страхование
Ингосстрах
Сравни.ру
Росгосстрах
Выводы из анализа
Сценарий нужно делить на шаги
Оформление ОСАГО проще проходить, когда данные сгруппированы по смыслу: автомобиль, участники, параметры, проверка и оплата.
Авторизация не должна ломать путь
Пользователь может начать оформление без входа, но авторизация должна быть встроена так, чтобы не терялись введённые данные.
Автозаполнение снижает нагрузку
Повторный ввод лучше заменять автозаполнением из личного кабинета, ранее введённых данных или данных по госномеру
Ошибки должны объяснять следующий шаг
Проверки и ограничения должны не просто показывать ошибку, а объяснять, что произошло и что нужно сделать дальше.
Проблема текущего оформления ОСАГО
На текущей странице оформление ОСАГО собрано в формате длинного калькулятора: пользователь сразу видит большое количество полей, условий и обязательных данных.
Такой подход усложняет прохождение сценария: непонятно, сколько этапов впереди, где потребуется авторизация, какие данные понадобятся дальше и что произойдёт после расчёта.
Такой подход усложняет прохождение сценария: непонятно, сколько этапов впереди, где потребуется авторизация, какие данные понадобятся дальше и что произойдёт после расчёта.
Новая структура оформления ОСАГО
Мы заменили длинный калькулятор на пошаговое оформление: данные ТС, участники договора, параметры полиса, проверка и оплата.
Так пользователь проходит сценарий последовательно, видит прогресс и не сталкивается со всей формой сразу.
Так пользователь проходит сценарий последовательно, видит прогресс и не сталкивается со всей формой сразу.
Шаг 1: Данные ТС
Пользователь начинает оформление с номера ТС. После проверки система раскрывает данные автомобиля, подставляет найденную информацию показывает поля для ручного заполнения.
Документы и FAQ помогают быстро понять, что понадобится для оформления, если пользователь попал сразу в калькулятор.
Шаг 2: Участники договора
Пользователь заполняет участников договора: страхователя, собственника ТС и водителей. Данные авторизованного страхователя подтягиваются из личного кабинета и недоступны для редактирования.
Переключатели позволяют использовать данные страхователя для собственника и водителя, чтобы не вводить одну и ту же информацию повторно. Собственником может быть физическое или юридическое лицо, а водителей можно указать без ограничений или добавить вручную.
Шаг 3: Параметры полиса
Пользователь выбирает тип срока страхования: 1 год, транзитный или краткосрочный полис. Для годового полиса можно настроить до трёх периодов использования.
На этом же шаге выбираются СТО, email для получения полиса и обязательные согласия перед проверкой данных.
Шаг 4: Проверка и оплата
Перед оплатой пользователь проверяет введённые данные по разделам: данные ТС, участников договора, параметры полиса и СТО. Каждый раздел можно раскрыть и при необходимости вернуться к редактированию.
После расчёта стоимости появляется финальный блок с ценой полиса и кнопкой оплаты.
Авторизация внутри оформления
Пользователь может начать оформление ОСАГО без входа, но купить полис можно только через личный кабинет.
Поэтому на шаге «Участники договора» появилась плашка входа в ЛК: существующий пользователь может авторизоваться и подтянуть данные, а новый — подтвердить контакты, согласиться на создание кабинета и продолжить оформление в том же сценарии.
Подготовка макетов к разработке
После проработки экранов я подготовил сценарий к разработке: связал шаги, состояния, модальные окна, ошибки и альтернативные ветки.
Так команда видела не только финальные макеты, но и логику поведения интерфейса.
Так команда видела не только финальные макеты, но и логику поведения интерфейса.
Другие страховые сценарии
Помимо ОСАГО, я работал над другими цифровыми сервисами ЭНЕРГОГАРАНТ. У каждого направления была своя логика оформления, набор данных, документы и ограничения, которые нужно было учесть в интерфейсе.
Ипотечное страхование
Форма с данными заёмщика, объекта страхования, банка и параметров договора
Страхование спортсменов
Нестандартный сценарий оформления с участниками, сроками и условиями страхования.
Личный кабинет
Список полисов, статусы, продление, оплата и детальная карточка полиса.
ДМС
Сценарий выбора программы, участников и параметров медицинского страхования.
Итог проекта
В этом проекте я работал не только с визуальной частью интерфейса, а с логикой сложных страховых сценариев: структурой шагов, обязательными данными, автозаполнением, состояниями и ограничениями.
Основной результат — проработанные макеты для разработки, где показаны не только финальные экраны, но и поведение интерфейса: переходы, ошибки, модальные окна и альтернативные ветки сценариев.
Основной результат — проработанные макеты для разработки, где показаны не только финальные экраны, но и поведение интерфейса: переходы, ошибки, модальные окна и альтернативные ветки сценариев.
