Мобильное банковское приложение @ Свой Банк

Задачи проекта

Свой Банк — новый бренд на рынке необанкинга в России. Перед нашей командой стояла амбициозная задача по разработке с чистого листа полнофункционального банковского ДБО. Уже на MVP мы должны были закрывать широкий набор пользовательских job stories. Работа велась в условиях ограниченных ресурсов, что уже само по себе было серьёзным вызовом

Подход

На протяжении всего процесса discovery в фокусе была клиентоцентричность. Мы хотели сделать приложение, которое будет простым, быстрым и интуитивно понятным. Для этого мы провели ряд исследований, узнали ожидания рынка и пользователей. На его основе был сформирован стек для стартового MVP 

Интерактивные прототипы

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

Интерфейс

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

Ключевые особенности

Дистанционный банкинг, скорость обслуживания клиентов, персонализация и доступность наших продуктов — ключевые преимущества банка. Всё это мы постарались отразить в рамках MVP внутри нашего приложения

УПРИД и открытие продуктов онлайн

Приложение позволяет дистанционно стать клиентом банка и оформить любой продукт онлайн. Для этого 
мы используем разные сценарии идентификации и регистрации клиентов, включая УПРИД. Всего доступно более 26 вариантов userflow для оформления продуктов.

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

Быстрый скоринг и интеграция с доставкой

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

Персонализированная лояльность

В самом начале процесса discovery мы решили, что если кешбэк — то действительно полезный. Приложение изучает потребительское поведение пользователей, собирает их интересы и анализирует траты. На основе накопленной даты наш AI генерирует максимально подходящие клиенту предложения, акции и кешбэки

Дизайн-инфраструктура

Мы использовали Flutter для сборки приложения и кросс-функциональные спринты дизайна в Jira для эффективного взаимодействия между командами и управления дизайн-процессом.

Workflow работы дизайнеров с макетами разделён на два вектора: discovery и delivery. В ветках discovery происходит генерация идей, сборка UI, доработка и тестирование прототипов. В контуре delivery хранятся актуальные синхронизированные мастер-версии макетов для команды разработки

Библиотека APP компонентов

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

Главный экран

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

Слайдер продуктов

Основной элемент навигации между продуктами. Экономит место в потоке и удобно структурирует основную информацию по продукту. Базовые функции пополнения, снятия и управления доступны по клику на контроллеры. Информация по продуктам и виджеты подгружаются автоматически при свайпе карточек

Профиль

В профиле можно изменить личные данные, добавить фото, установить параметры безопасности, изменить код-пароль для доступа в приложение, подключить FaceID и связаться с банком

Экран продукта

Управление продуктом и взаимодействие с основными функциями происходит на едином экране управления. Он открывается при нажатии на «Настройки» карточки продукта

Основная информация
и управление продуктом

Здесь мы компактно разместили все основные функции, такие, как возможность скопировать реквизиты, заказать справки, посмотреть тарифы, заблокировать или заморозить карту и т.д. 


Все основные документы можно сформировать онлайн и моментально отправить на почту.

Виджеты

Виджеты — универсальные модули, которые показывают пользователю разную информацию. При клике на виджет открывается экранная форма с подробностями.

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

Кредитные виджеты

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

Интеграция СБП

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

Внутрибанковские, P2P и переводы по реквизитам

В дополнение к СБП реализовали и все основные классические способы трансфера денег — внутрибанковские переводы, по номеру карты и по реквизитам. Формы спроектированы в единой стилистике с сохранением общего UX

История операций

Просмотр последних операций — самая частая функция, которая необходима пользователям в приложении согласно нашим исследованиям. Для быстрого доступа к ней мы вынесли на главный экран закреплённый всплывающий по свайпу вверх overlay.

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

Кешбэк

Мы реализовали систему прогрессивного персонализированного кешбэка. Чем больше клиент тратит, тем выше его максимальный порог вознаграждения. Система на основе даты и алгоритмов AI предлагает пользователю только те категории кешбека, которые будут ему действительно интересы

Визуализация и выбор категорий

В рамках текущей базовой программы лояльности клиент может каждый месяц выбрать 3 любые категории из 18 предложенных.

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

Мой Банк

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

Отслеживание статусов

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

Заявка на продукты + DaData

В приложение удобно открывать продукты онлайн. Подключили сервис DaData к большинству наших форм, чтобы пользователям было проще вводить данные, а нам проверять их и пробрасывать в БД. Принимаем решение по заявке, как правило, в течение нескольких секунд

Активация продуктов онлайн

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

Оплата услуг и интеграция с А3

Подключили возможность оплаты услуг у более чем 60 тысяч поставщиков услуг через решение от компании А3. Добавили возможность оплаты по QR

Поддержка клиентов

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

Интернет-банк

Функционал и интерфейс мобильного приложения и интернет-банка повторяют друг друга. Общие userflow и единая база дизайн-компонентов создают бесшовный пользовательский опыт. Это позволяет нашим пользователям без лишних усилий быстро ориентироваться в функционале и переключаться между платформами