Весной 2017 года мы выпустили новое мобильное приложение «РосЕвроБанка». О вызовах, с которыми пришлось столкнуться двум командам — Redmadrobot и «РосЕвроБанка» — в процессе разработки, тестирования и внедрения мобильного продукта, рассказываем в нашем очередном кейсе. Итак, «Мобильный РосЕвроБанк: behind the scenes».
К моменту, когда к нам обратился «РосЕвроБанк», мы уже сделали несколько мобильных банковских продуктов: приложения банка “Открытие”, финансовой группы “Лайф” и др. И хорошо представляли себе всю “кухню” — процессы, правила, потребности операторов финансовых услуг, поэтому приступить к разработке смогли очень оперативно.
Артем Гребнев, Product owner, «РосЕвроБанк»
«В начале 2016 года мы собрали внутрибанковскую команду для работы над проектом и стали экспериментировать. К середине года стало окончательно ясно: писать мобильную версию на базе существующих у нас решений нерационально, нужно все переделать с самого начала, и сделать это должен грамотный, подготовленный, с опытом работы с банковским ПО разработчик. Мы изучали рынок, приглашали несколько команд — было открытое предложение, могли участвовать все желающие, но у нас были четкие критерии отбора: во-первых, выделенная команда разработки, во-вторых, плотное взаимодействие вплоть до «высадки» команды разработки непосредственно в офис банка, если это поможет ускорить работу. Рассмотрев все предложения, мы признали, что именно Redmadrobot наилучшим образом соответствует нашим ожиданиям».
В августе 2016 года банк передал нам подробнейшее ТЗ на 64 страницах: в нем содержалось все то, что клиент хотел видеть в будущем приложении. Эти ожидания от продукта нам пришлось совместно корректировать. ТЗ «РосЕвроБанка», в сущности, состояло из трех функциональных блоков: качественный сервис для существующих клиентов, дополнительный сервис вроде электронного кошелька для не-клиентов и платежный агрегатор для любых операций. Все блоки правильные, но их реализация — это огромное количество работы и очень длинный time-to-market: минимум год-два разработки, а за это время — потеря аудитории и огромное отставание от лидеров отрасли. Поэтому мы предложили банку подход, который часто используется на рынке мобильных приложений и FinTech-продуктов: выпуск в стор первой версии приложения с минимальным функционалом за 6-8 месяцев, а затем планомерное развитие продукта.
Чтобы определить минимальный функционал первого релиза мы с банком выделили наиболее критичную для его бизнеса проблему: большое количество корпоративных клиентов с зарплатными проектами, которые предпочитают уводить свои деньги в другие банки или в кэш. Эту боль нужно было отрабатывать в первую очередь, тут мы и сконцентрировали усилия.
Важно было с самого начала заложить в логику приложения и middleware банка возможности для его развития на следующие полгода.
Что умеет приложение
Помимо стандартного набора функций, которые обязаны быть в современном банковском приложении, мы решили реализовать дополнительные возможности, которые встречаются далеко не всегда. А именно автоплатежи и работу с картами других банков, как в кошельке.
Алиса Морозова, менеджер проекта, Redmadrobot
«Все, что связано с банковскими продуктами, у нас собрано на одном экране — счета, кредиты, карты «РосЕвроБанка» и других банков. Можно сразу понять, что у тебя сейчас с деньгами, можно легко перекидывать их туда-сюда».
Внешняя привязанная карта позволяет делать платежи, бесплатно пополнять баланс карт «РосЕвроБанка» и совершать переводы с нее на любые другие карты. Между картами других банков можно совершать переводы с комиссией всего 1%. Для операций с внешними привязанными картами нужно только вводить их CVV/CVC коды.
Для платежей выделена отдельная вкладка и реализовано несколько типов умных автоплатежей. Первый — регулярный: указывается сумма и периодичность переводов, можно настроить ограничения — выполнять до определенной даты или указанного количества переводов.
Второй вид автоплатежей — нерегулярные переводы по факту наступления события: оплата налогов, штрафов, ЖКХ. Здесь можно настроить оплату с лимитом каждой операции и общим лимитом в месяц (например, оплачивать штрафы до 500 рублей автоматом, но не более пяти раз в месяц).
Самое интересное — автоподписка по шаблону: допустим, вы ввели номер свидетельства о регистрации ТС, нашли и оплатили штраф. Этого достаточно, чтобы в будущем система сама отслеживала ваши штрафы, уведомляла о них и предлагала оплатить. То же самое и для оплаты налогов, сборов, можно даже подключить автоматическую оплату счетов своего родственника — например, школьных кружков ребенка.
Кстати, разработка платежей по схемам была самой тяжелой задачей с точки зрения бизнес-логики. Они могут прийти в каком угодно виде, а нужно их красиво отобразить и не дать пользователю запутаться. Множество банковских операций с точки зрения пользователя очень похожи — платежи, автоплатежи, выставленные счета, платежи по шаблону, — а с точки зрения банковской системы это совершенно разные сущности.
Архитектура системы
Как устроена архитектура банка? Есть Business Process Enterprise Layer (BPEL), где можно быстро реализовывать бизнес-логику обработки всех процессов на основе действующих и разрабатываемых сервисов в формате WSDL. Мобильное приложение смотрит на middle-прослойку, та смотрит на BPEL, а BPEL общается со всеми банковскими системами через WSDL через шину.
Middle-прослойка выполняет функцию CMS и одновременно производит трансформацию JSON в WSDL, так как все внутренние сервисы работают с WSDL, а мобильное приложение адаптировано под работу с JSON.
Плюс в ней же хранятся все данные для контента приложения: иконки платежей, логотипы, цветовые схемы и т.д. Например, начинаем добавлять карту «Сбербанка», и после ввода первых цифр номера, фон карты меняется на зеленый цвет. А при оплате МТС фон подсветится красным. Все эти цветовые схемы, логотипы и иной контент хранится как раз в прослойке.
Middle-прослойка — часть работающей наружу DMZ, в которую также вынесены сайт банка и «Виртуальный Офис» (интернет-банк). За DMZ находится основная сеть банка, где работают все остальные системы. Именно там расположен слой бизнес-логики мобильного приложения, который принимает и обрабатывает запросы исключительно от прослойки.
Все общение внутри банка происходит через шину данных, которая предоставляет веб-сервисы для всех систем. В итоге у нас получилось приложение с хорошими возможностями оптимизации. Например, первая версия списков провайдеров услуг была не очень быстрой — мы загружали полные схемы на всех провайдеров, и это занимало 15-20 секунд. Теперь мы выгружаем только список определений, а детали прячем в отдельные запросы, которые не каждому клиенту потребуются.
Алексей Щербаков, IT-руководитель «цифрового банка», «РосЕвроБанк»
«Сейчас мы и веб-приложение переделываем под эту же схему с контент-прослойкой. Ранее оно использовало собственную контент-систему и общалось через WSDL c BPEL. Но на мобильном приложении мы успешно опробовали смену архитектурного подхода, и теперь веб- и мобильное приложения будут синхронизированы и по функциональности, и с архитектурной точки зрения. Унификация упростит дальнейшее развитие банка: любой новый продукт мы можем быстро вывести на все доступные digital-каналы – web, mob, sms, ussd и так далее».
Дмитрий Корчмарек, тим-лид разработки, «РосЕвроБанк»
«Когда мы делали для банка веб-приложение, времени на него ушло гораздо больше — это был огромный проект с множеством требований, для него создавалось много новых систем. Несколько месяцев заняли только подготовительные процессы по реализации API всех систем и началу интеграции, плюс еще несколько месяцев – сама интеграция. Но зато нам удалось объединить все эти системы с точки зрения пользовательской, а не банковской логики. В результате на мобильной версии процесс разработки нового API и нового функционала пошел в очень агрессивном темпе. Нам понадобилось только верхнеуровневое бизнес-требование к мобильной версии, и с помощью Redmadrobot мы всего за несколько месяцев подготовили для него API. Оно получилось не таким уж идеальным, чистым и прозрачным, как хотелось бы (там одних спецификаций 117 страниц, из которых 17 – история изменений), но сама архитектура позволяет нам разрабатывать и внедрять новые функции, не затрагивающие текущую реализацию, на «боевой» сервер прямо на ходу».
iOS-версия приложения писалась на Swift. У нас в Redmadrobot много собственных библиотек – для транспортного уровня, баз данных и так далее, что здорово экономит время.
Ольга Ворона, iOS-разработчик Redmadrobot
«Мы стремимся работать внутри всех проектов компании в одной парадигме, и наш главный архитектор продвигает слоистую архитектуру. Большие слои – сервисный уровень и UI. Сервисный уровень включает транспорт, работу с базой данных, и все это разбивается на отдельные сервисы. Подробно об уровне бизнес-логики можно почитать здесь. Когда-то мы использовали MVVM (Model, View, ViewModel), потом MVPM (Model, View, PresentationModel), сейчас для навигации мы используем Router. Стараемся как можно меньше оставлять во ViewController, больше выносим в PresentationModel. Presentation берет модели из сервисного уровня и создает из них набор ViewModel. View Controller использует эти ViewModel для конфигурации View, которые пользователь видит на экране. Router же мы используем во ViewController’ах для перехода между сценариями или внутри сценария».
Банковские нюансы
Для разработки мобильного банка нужны тестовые аккаунты пользователей, тестовые счета, карты. В тестовой зоне банка, не пересекающейся с «боевой», можно создать клиента с любыми параметрами. Но при этом заранее нужно продумать все комбинации счетов, карт, кредитов, которые могут понадобиться. Для этого нужно хорошо понимать все банковские продукты и их возможные состояния, а это огромное количество вариаций.
На первой стадии, в процессе разработки и тестирования прослойки, в связи с этим возникало много моментов. Из-за особенностей банковского API корректное выполнение некоторых действий со стороны банка может выглядеть как ошибка с точки зрения мобильных разработчиков. Например, в выдачу приложению идут идентификаторы десяти продуктов, среди которых есть и карты, и счета. И с помощью карт запрещено делать ряд операций, которые по правилам банка можно проводить только со счетов. Разработчик подставляет идентификатор карты, вызывает метод для счета, и API выдает ошибку.
Дизайн
Банк был настроен на лаконичный и легкий дизайн, поэтому мы использовали минимум графики, крупные шрифты, простую цветовую гамму.
Татьяна Гущина, дизайнер, Redmadrobot
«Для ускорения разработки максимально применялись стандартные элементы дизайна, разбавленные интересными анимациями. Их задача — дать пользователю обратную связь при выполнении медленных операций, например, загрузке больших массивов данных. Поначалу у нас были только Refresh и Activity Indicator, блокирующий весь экран. Но из-за специфики запросов — их может быть несколько на одном экране, и при прокрутке это должно отображаться — мы отрисовали еще и Loader. Еще одна тема возникла с главным экраном: поскольку в приложении ничего не кэшируется из соображений безопасности, при загрузке экран оставался пустым. Это нарушало ожидания пользователей, и мы добавили специальный промежуточный экран, имитирующий основной, на котором идет процесс загрузки».
Коммуникация в двух командах
Виталий Пальчиков, product manager, «РосЕвроБанк»
«Внутри банка у нас комфортная экосистема взаимодействия между подразделениями: внутрикорпоративный чат, внутренний файлообменник, система управления проектами. Сложность данного проекта состояла, во-первых, в работе распределенной командой, состоящей, с одной стороны, из администраторов, менеджеров, разработчиков и тестировщиков на стороне банка, с другой – «внешней» для экосистемы банка команды. Во-вторых, вызовом для нас был короткий срок запуска проекта. Мы не стали изобретать колесо — чат в WhatsApp из 15-20 людей был экстремальным, но работающим решением :)
Было сложно: наши “центры компетенций” развивались на лету, до проекта у нас не было острой нужды в QA, и первое время приходилось лично проверять API наших разработчиков на соответствие спецификации; в рамках тестирования мобильного приложения “снифать” трафик; сравнивать ответ бэка и поведение приложения. А после выпуска приложения — самостоятельно обрабатывать приходящие обращения клиентов, формировать FAQ-базу с предзаготовленными скриптами для передачи функционала обратно на первую линию, пока доработки еще не были реализованы. Нагрузка на менеджеров проектов со стороны обеих команд возросла в разы, но все отлично справились со сложностями».
Командное общение в чате позволило выстроить эффективную коммуникацию по проекту 24/7. В результате общение разработчиков двух команд не замыкалось на администраторе проекта, и между ними выстроилось полноценное, очень тесное взаимодействие.
Мы могли в десять вечера сообщить, что вызов метода дал сбой, в банке оперативно связывались с дежурным админом, узнавали, что сейчас внепланово накатывается срочное обновление, и тут же отвечали “подождите 10 минут, и все заработает”. А не так, что метод не принимается, в Jira заводится баг, и банк реагирует на него на следующий рабочий день. Это существенно ускорило разработку и дало возможность программистам работать в удобное для них время.
По необходимости «РосЕвроБанк» подключал к чату специалистов, отвечающих за те или иные части банковского бэкенда, мы добавляли тестировщиков, и все вопросы решались оперативно. Даже о запуске проекта все члены команды узнали из чата :)
Что в итоге
Для нас в Redmadrobot самым важным было правильно выстроить работу с банком. Каким бы продвинутым он ни был — это все же массивная структура, и даже для обособленного диджитал-банка требуются многочисленные согласования и проверки. Серьезное достижение — то, что мы научились работать с такими заказчиками и одновременно научили их работать с тем, как мы делаем архитектуру, дизайн, пишем, проверяем и тестируем системы.
На сегодняшний день мы закрыли примерно 90% доступного в backend банка функционала, и мобильное приложение по возможностям уже обгоняет веб-кабинет банка. Пока мы писали статью, уже реализовали возможность открытия счетов, регистрации нерезидентов, графические отчеты по использованию средств на картах и управление карточными лимитами. Из планов на ближайшее будущее — перевод клиенту банка по номеру телефона, подключение опций – кешбеки, накопительные проценты и смс-информирование, конвертация, чат с операторами и многое другое.
Автор: redmadrobot
