Технологически удобный и современный финансовый сервис для действующих и новых клиентов банка
«Хлынов» — универсальный банк с 34-летней историей и широким спектром услуг для частных лиц и бизнеса.
Задача
Разработать новый корпоративный сайт банка «Хлынов» в формате технологически удобного и современного финансового сервиса для действующих и новых клиентов банка.
Разбили на несколько:
- Создать дизайн-систему, располагающую к совершению ключевых действий;
- Изучить и улучшить пользовательский опыт;
- Привести аналитические системы к соответствию современным требованиям;
- Внедрить возможность отдельно работать с видом и содержанием форм заявок, анкет;
- Создать доступную распространенную систему администрирования и минимизировать трудозатраты на администрирование сайта;
- Сократить временные затраты на внедрение сервисов и нового функционала на сайт;
- Реализовать возможность участия сразу нескольких разработчиков.
В процессе работы ориентиром служили три обязательных пункта:
- Соответствие требованиям законодательства и постановлениям ЦБ РФ;
- Соблюдение требований по информационной безопасности;
- Современный подход к дизайну и верстке.
Решение
При разработке мы уделяли особое внимание не только обновлению визуальной составляющей, но и созданию технологических решений, которые помогут увеличить конверсию на сайте. Основной целью проекта стало создание онлайн-платформы для эффективного взаимодействия с клиентами.
Особенности нового сайта:
- дизайн-система
- конструктор страниц
- функционал для составления форм и заявок
- обновленные калькуляторы
- аналитика посетителей
- система сигнализации о серверных ошибках
- минимизация простоя и бесперебойный доступ к услугам и ресурсам
Проектирование. Аналитика
Провели интервью с продуктологами и маркетологами, по результатам которого выявили проблемы текущего сайта и структурные требования к основным функциональным модулям. Сравнили более 30 банков, включая зарубежные компании и финтех-стартапы. Проанализировали метрики посещаемости сайта и переработали структуру нового на основе всех полученных данных.
Совместно с командой банка разработали порядка 60 прототипов и составили более 20 пользовательских путей.
Увеличили количество путей до с 4 до 7 и упростили самый короткий путь.
Разработка
Сформировали бэклог и поделились на две команды. Одна занималась пользовательской и административной частью, другая команда занималась заявками и формами. Каждая группа имела свой набор задач и координатора, это позволило углубиться в направление и параллельно двигаться вперед, сэкономив значительную часть временных затрат.
Сбор контента и новый формат инфоблоков
Информация хранилась в разных частях текущего сайта. Мы собрали абсолютно все виды контента по более 100 продуктам и создали новые инфоблоки в единой форме, закрывая потребности клиента.
Тестовый запуск
Выпустили сайт на новом домене в тестовом режиме на 3 месяца, отследили обратную связь от пользователей, исправили ошибки и завершили заполнение. Вместе с первым запуском рассказали о нововведениях для пользователей на отдельной странице.
Боевой запуск
Выбрали ночное время суток для боевого запуска, чтобы минимизировать возможные помехи и задержки. Каждый шаг был тщательно продуман и скоординирован с девопсами клиента. После запуска сразу провели тесты для проверки стабильности и производительности. Все прошло максимально бесшовно для пользователей.
Дизайн-система
Мы выбираем системный подход, поэтому разработали дизайн-систему, где учли все результаты наших исследований. Основные профиты:
- параллельная работа нескольких дизайнеров, вся информация есть в компонентах
- унификация — компоненты ведут себя одинаково одинаково на любых страницах на сайте
- возможность постоянного развития, внедрения в другие диджитал-сервисы банка
Кроме того, дизайн-система тесно связано с новым конструктором страниц, ее легко поддерживать и в любое время дополнить новыми элементами.
Конструктор страниц
Для доступного администрирования сайта модифицировали конструктор страниц на базе Сайты24, где использовали нашу дизайн-систему и внедрили весь этот функционал в админпанель на 1С-Битрикс:
- сократили время на внедрение новых продуктов и редактирование данных
- унифицировали дизайн на сайте за счет готовых компонентов
- расширили ряд задач, которые менеджеры могут выполнить без участия разработчика
- добавили функцию A/B-тестирования
Формы и заявки
Важная часть для работы с клиентами — сбор обратной связи, составление базы. Для этого мы упростили сборку форм и реализовали ее на конструкторе.
На сайте настроено много и внешних API, например Госуслуги, dadata, SMS.
Упростили расчеты
Обновляя калькуляторы, максимально упростили сложные расчеты для клиентов банка, включая визуальный аспект.
Система контроля версий
Для более эффективной и безопасной разработки внедрили GIT и миграции. Любые изменения можно удалить и выбрать одну из сохраненных версий. Это помогает упростить процесс совместной работы над проектом, предотвратить ошибки и конфликты при слиянии кода, а также гарантирует стабильность работы сайта.
Помимо этого внедрили мониторинг доступности и защиту при падениях за счет написанных нами логгеров.
Команда
«Инфинити»
- арт-директор
- аккаунт-менеджер
- 2 проджект-менеджера
- 3 дизайнера
- 3 front-end-разработчика
- 3 back-end-разработчика
- 2 тестировщика
Банк «Хлынов»
- проект-менеджер
- devOps-инженер
Результат
Для создания современного финансового сервиса проделана огромная аналитическая работа на подготовительном этапе, где учтены все ключевые аспекты в числе которых безопасность, пользовательские потребности, технологические и визуальные тренды. Мы выбрали лучшие функциональные и визуальные практики и разработали новый сайт. В количественных показателях это выглядит так:
27 встреч и конференций
>50 часов видеозаписей
30 банков и финтех стартапов изучено в процессе бенчмаркинга
>60 прототипов
>20 пользовательских путей
Сегодня мы продолжаем работать на сопровождении и внедрять улучшения с появлением новых потребностей клиента и технологий.
Оцените новый сайт сами → Банк «Хлынов»
Комментирует Михаил, арт-директор интернет-агентства «Инфинити»
— Мы полностью довольны процессом разработки и уровнем погружения команды клиента. От первой встречи до тестового запуска прошло 6 месяцев, за которые мы смогли глубоко вникнуть в банковскую отрасль, спроектировать и реализовать современный сайт банка. Агентство получило бесценный опыт в организации работы над таким крупным проектом — от взаимодействия с бизнесами клиента до синхронизации внутренних команд разработки. Благодарим команду клиента за глубокое вовлечение в процесс, понимание процессов разработки и профессионализм в своей сфере. В результате мы сделали удобный инструмент продаж с продуманным UX, который решает поставленные бизнес-задачи клиента. Продолжаем поддерживать сайт в рамках сопровождения, постоянно добавляя новые функции и развивать существующий функционал.
Комментирует Михаил, Начальник Управления по маркетингу банка «Хлынов»
— Мы рады, что смогли стать партнерами с «Инфинити». Профессионализм команды и тесное взаимодействие позволили нам достигнуть поставленных целей даже с учетом меняющихся обстоятельств как во внешней среде, так и внутри банка. Вместе мы провели масштабную аналитическую работу на подготовительном этапе, что позволило создать уникальные решения, которые полностью соответствуют нашим ожиданиям и требованиям.Особое внимание заслуживает видение агентства и разработанный кастомный функционал. Один из ярких примеров — конструктор страниц, который значительно облегчил процесс администрирования нашего сервиса. Создана дизайн-система, продуманы пользовательские пути и еще ряд значительных изменений, при внедрении которых соблюдены все требования безопасности, законодательства и постановлений ЦБ РФ.Мы продолжаем работать с «Инфинити» не только на уровне поддержки сайта, но и на уровне развития клиентской части и администрирования.