СМП Банк

Предыдущее приложение тормозило развитие банка: дизайн устарел, обновления шли медленно, новые механики внедрялись вручную с переписыванием кода приложения. Банку нужно было быстрое приложение с современным UX и возможностью быстро масштабировать линейку продуктов (включая «дочку» — Мособлбанк).

Мы предложили кроссплатформенную стратегию и создали единую кодовую базу на Flutter для нескольких мобильных приложений. Добавили автоматизацию тестов, чтобы релизы оставались регулярными и без сбоев. За 9 месяцев вышли на релиз iOS и Android, сократили стоимость последующих проектов до 70%, ускорили тестирование почти вдвое.

СМП Банк вошел в топ-30 мобильных банков России благодаря приложению.

Что сделали — главное

Собрали два нативных приложения на общем Flutter-коде, обновили дизайн и выстроили структуру, где модули легко переиспользуются между продуктами. Всего создали 13 модулей к первому релизу, в том числе: 4 способа авторизации, 2 способа регистрации, управление картами и счетами, модуль «Мои финансы», платежи и переводы, аналитику расходов и чат с поддержкой.

Главную страницу сделали компактной: пользователь скрывает лишнее и видит только нужные продукты. Сразу добавили онбординг, чтобы новые клиенты быстро ориентировались в продукте.

Динамические формы платежей и переводов

Формы платежей и переводов в СМП Банке динамические — собираются из отдельных компонентов и обновляются без релиза. Если меняются поля или структура на бэкенде, приложение автоматически подхватывает изменения.

Главная не превращается в бесконечный список: пользователь может скрыть неиспользуемые карты и продукты под свое удобство и быстрее добирается до нужного.

Аналитика расходов

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

Чат с поддержкой

Чат в приложении сделали на базе Webim SDK, как у Тинькофф и Райффайзенбанка. На Android стандартное решение работало с ошибками, поэтому мы создали собственную библиотеку и выложили её на GitHub. Теперь чат полностью функционален на обеих платформах и легко адаптируется под потребности банка.

Разработали приложение на кроссплатформенной технологии Flutter. Одна кодовая база стала основой сразу для четырех продуктов. На ней собрали два полноценных приложения и быстро выпустили ДБО для Мособлбанка, сократив расходы до 70% и ускорив релизы.

Использовали сквозное тестирование (end-to-end). Программа имитирует щелчки мышью, нажатия на кнопки, заполнение форм и переходы по экранам. Тестирование запускается перед релизом сборок, повышает качество и экономит время на поиске и исправлении ошибок.

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

После запуска добавили PWA-версию: она полностью повторяет мобильный UX и работает как страховка в случае санкций от сторов. Дизайн адаптировали под Flutter и разные типы устройств, обновили интерфейсы и сохранили фирменный стиль.