Как быстро создавать уникальные интерфейсы на основе схем
На этой странице

Для чего используют дашборд в Газпромбанке

Как дашборд генерируется с помощью схем

Почему использовать схемы удобнее, чем программировать интерфейс с нуля



Тэги
разработка
Как быстро создавать уникальные интерфейсы на основе схем

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

Пример данных о клиенте в дашборде Газпромбанка.

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

  1. Банк не может использовать внешние сервисы, так как это небезопасно. Во время работы дашборд подключается к различным внутренним базам данных. Если открыть доступ к ним внешнему сервису, получится дыра в системе безопасности. Через нее злоумышленники могут похитить личные данные клиентов. Кроме того, обычно такие сервисы ориентированы на маркетинговые или бизнес-данные. Для решения задач Газпромбанка они не подходят.
  2. Программирование интерфейса требует много времени и ресурсов: код нужно отладить, скомпилировать и протестировать, а для каждого элемента создать дизайн. Для того, чтобы обновить интерфейс, весь процесс придется повторить.

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

Для чего используют дашборд в Газпромбанке

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

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

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

В интерфейсе дашборда менеджер может быстро найти клиента.

Сгенерированный дашборд используют в контакт-центре, фронт-офисе и на планшете мобильного рабочего места (МРМ). Их интерфейсы похожи, но не одинаковые: разным специалистам банка нужны разные функции и данные о клиенте.

Например, в дашборде МРМ есть функции, которые не нужны во фронт-офисе или контакт-центре: геолокация или возможность фотографировать и загружать документы. Менеджер фронт-офиса в карточке клиента среди прочих функций видит блок «ГПБ Мобайл» — это мобильный оператор Газпромбанка. У специалиста контакт-центра такой функции нет.

Интерфейсы дашборда для контакт-центра и планшета МРМ. Например, сотрудник контакт-центра может подсказать клиенту адрес ближайшего отделения.


Как дашборд генерируется с помощью схем

Схема — это JSON-файл с описанием структуры интерфейса. В ней записаны все элементы структуры: секции, поля, формы и кнопки. Обычно структура файла древовидная. Сначала описывается самая крупная секция, внутри нее — секции меньшего размера, а внутри них — отдельные компоненты.

Фрагмент схемы, которая создает в интерфейсе табы — вкладки для удобной работы с разными данными.

Каждый компонент описывается набором параметров:

  • тип;
  • имя;
  • функциональность;
  • визуальные особенности.

Например, для того, чтобы добавить в схему кнопку, нужно прописать ее ширину и высоту, цвет. Затем надо добавить текст кнопки, указать его размер, начертание и цвет. Для поля ввода потребуется описать, какие символы в него можно внести — например, только цифры.

Фрагмент схемы, в котором описан компонент интерфейса — кнопка «Отмена».

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

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

Почему использовать схемы удобнее, чем программировать интерфейс с нуля

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

  • На разработку уходит меньше времени. Вместо отдельных дашбордов для каждого отдела можно запрограммировать один дашборд с генератором и несколько разных схем для него.
  • Интерфейс можно быстро обновить. Для этого не нужно переписывать программный код. Достаточно изменить несколько строк в файле схемы.
  • Разные интерфейсы генерируются на основе одних и тех же компонентов. Можно сколько угодно раз использовать уже готовые элементы интерфейса в разных частях проекта или даже в разных проектах. Не нужно заново прописывать каждую форму или кнопку.
  • В будущем снижается нагрузка на разработчиков. Использование схем — это часть подхода Low Code («меньше кода»). Он позволяет привлечь к созданию интерфейсов аналитиков, тестировщиков и других специалистов, которые напрямую не работают с кодом. Они смогут создавать и настраивать элементы интерфейса, если разберутся, по каким правилам строятся схемы.

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

Другие статьи по теме

23 Мая, 2022

Java школа: как в Газпромбанке учат разработчиков

В начале 2022 года в Газпромбанке стартовала Java школа. Ее преподаватель и студент рассказывают как это было.

Читать

19 Мая, 2022

Фулстек-разработка: идти или не идти. Опыт тимлида

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

Читать

24 Февраля, 2022

Как черновики в мобильном банке и увеличили количество заявок на кредитную карту

Рассказываем, сколько клиентов вернула Газпромбанку новая функция и как ее планируют использовать в будущем.

Читать

15 Февраля, 2022

Платформы Low-code и No-code: что это такое и зачем они нужны

Рассказываем, как развиваются Low-code и No-code платформы в финтехе и Газпромбанке.

Читать

2 Февраля, 2022

Миграция со старых версий ПО на свежие: опыт Газпромбанка

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

Читать

17 Декабря, 2021

Тестирование инвесторов в приложении Газпромбанк Инвестиции: как мы это делали

Рассказываем, как команда сервиса Газпромбанк Инвестиции запускала тестирование для неквалифицированных инвесторов.

Читать