Зачем банкам нужен конструктор опросов и как он может увеличить продажи

Команде SimbirSoft поступила задача по развитию банковского приложения — разработать новый вспомогательный сервис, конструктор опросов. С его помощью клиенты самостоятельно выбирают для себя банковские продукты. Кроме того, сервис используют сотрудники банка для консультирования клиентов.

От заказчика сразу получили несколько вводных: 

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

Ищем проблему

Создать конструктор — дело несложное. Но чтобы процесс пошел быстрее, нужно понять, какие проблемы можно решить с его помощью. Проведя несколько бесед с заказчиком, мы поняли, что продажи банковских услуг в первом квартале снизились на 14% по сравнению с четвертым кварталом предыдущего года. Если такая динамика сохранится, то по прогнозам аналитиков банка, падение выручки к 4 кварталу может достигнуть 27%. С помощью конструктора важно устранить разрыв уже к концу 3 квартала. 

Основная причина проблемы в том, что сотрудники банка часто неверно понимали запросы клиента и предлагали им нерелевантные продукты. Некоторые решения были продиктованы KPI, а не желанием помочь потребителю. 

Исследование и интервью

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

Продукт создавали для двух групп: сотрудников банка и клиентов (активные пользователи банковских продуктов). Для каждой целевой аудитории составили сценарии интервью и CJM (Customer Journey Map, карту пути пользователя, который он проходит от осознания потребности в продукте до его покупки). 

Работу начали с проведения интервью. Но тут возникли первые трудности. Вводные говорили, что конструктор для сотрудников должен собираться быстро, да и клиенты его должны быстро проходить. 

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

Каждое интервью длилось по два часа: на общение и анализ результатов уходило примерно по одному часу. Один дизайнер вел беседу и задавал уточняющие вопросы, а второй записывал ответы. Этап исследований, включая интервью, занял около 90 часов. Во время обработки результатов сортировали ответы, выделяли нестандартные ситуации и проверяли несколько гипотез. На основе анализа решали, какая информация является ключевой для достижения цели и в каком направлении развивать продукт. Также во время исследования вносили коррективы в CJM. 

UX/UI-дизайн

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

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

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

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

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

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

Каких результатов достигли

Мы спроектировали и отрисовали конструктор за 1 месяц. Всего получилось 140 экранов: для десктопа, планшетов и мобильных телефонов, включая экраны ошибок, пустых состояний и экранов успеха. 

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

Главная проблема заказчика была решена. К концу 3 квартала продажи банковских продуктов увеличились примерно на 31% (на 4% выше плана), а сотрудники банка смогли точнее подбирать услуги под потребности клиентов.