Платежный сервис

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

Задачи
Нам было необходимо:
— С нуля разработать локальную платформу для удобства онлайн-платежей телеком-провайдеров, телевидения, интернета и ЖКУ для сотрудников компаний;
— Разработать стабильную платформу, которая способна проводить множество транзакций для штата сотрудников клиента, облегчать внесение большого объема платежей для сокращения времени работы технической поддержки заказчика и клиентов;
— Разработать адаптивную версию сервиса для аппаратных средств: киоски самообслуживания, POS-терминалы, мобильное приложение, etc;
— Разработать упрощенную административную панель для технических специалистов заказчика.

Дизайн
Использовали фирменный стиль компании. С функциональной точки зрения, основной упор на:
— Удобстве и скорости использования сервиса. Предоставили возможность проводить регулярные платежи в несколько кликов;
— Удобстве ввода данных;
— Доступности необходимой информации по текущим или завершившимся batch-платежам;
— Интуитивности, наглядности и простоте проведения платежей для среднего юзера. Большая часть целевой аудитории заказчика не является продвинутыми пользователями компьютера, поэтому обойтись стандартными шаблонами UX/UI не получилось бы. Мы реализовали более наглядный и простой дизайн.

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

Раньше каждый вид платежа для каждого сотрудника компании вносили в программу вручную из Excel-таблицы. При этом количество сотрудников компании может превышать 1 000 человек.
Сейчас в сервисе нужно один раз внести всех сотрудников компании, добавить для каждого виды платежей и расходов. Указать минимальную сумму, которая должна пополняться. Далее — одной кнопкой «Повторить платеж» специалист может раз в месяц пополнять необходимую сумму всем сотрудникам. Чтобы сделать инструмент универсальным, внедрили более 32 операторов для оплат.
Использовали минимальное количество навигации. Всего 3 основных страницы сервиса: список сотрудников, история платежей, группы. Страницы реализовали похожими, чтобы упростить пользование сервисом. Таким образом нам удалось добиться максимально легкой навигации внутри страниц.

Список сотрудников
Этот раздел включает следующие возможности и данные:
— Создание нового сотрудника;
— Индивидуальные платежи;
— Групповые платежи;
— Страница сотрудника: имя, фамилия, телефон, личные операторы;
— Редактирование информации о сотруднике;
— Деактивация сотрудника. Так как по закону Уганды платежная система должна хранить данные в течение 5 лет на каждого сотрудника, мы реализовали не удаление, а деактивацию. Пользователь удаляется из списка, но остается в базе данных. При необходимости все данные можно предоставить;
— Объединение и перенос сотрудников в группы;
— Поиск по имени и номеру. Специально (по результатам тестирования с заказчиком) упростили лишний поиск по данным, которые могут дублироваться;
— Экспорт данных пользователей в Excel-файл.

Группы
Для разных отделов внутри одной компании реализовали групповой платеж с индивидуальными значениями для отдела. Например, группе А нужны пополнения мобильной связи, а группе В нужны гигабайты. В два клика можно пополнить баланс сразу двум группам.
Также реализованы:
— Список сотрудников в группе без ограничений по количеству;
— Информация об операторах;
— Редактирование и удаление группы;
— Поиск;
— Перенос сотрудника в другую группу с уведомлением о изменении данных;
— Переход к групповому платежу. Платежи проводятся последовательно по порядку списка пользователей, чтобы сервис проверил каждый. API платежного ПО заказчика не поддерживает многопотоковую обработку данных, поэтому отправляем запрос на проведение платежа раз в 1,5 минуты.

Создание платежей
Настроили табличную систему проведения платежей аналогично Excel-таблицам клиента. Вертикальный столбец ― список сотрудников. Горизонтальный столбец ― список операторов. В каждую ячейку можно добавить лицевой счет для проведения платежа.

История платежей
Чтобы техническая поддержка сервиса не искала каждую ошибку и причину вручную, а для работы с одним платежом не были задействованы 3-4 человека,
мы сократили участие до 1 человека. Сервис автоматически выдает, по какой причине платеж не прошел. В случае обнаружения десятков ошибок платеж можно возобновить по кнопке «Повторить». В личном кабинете отображается общая сумма баланса пользователя.
Инструменты работы с историй платежей:
— Фильтрация статуса платежей: «Успешно», «Ошибка», «В процессе»;
— Отображение даты, суммы, описания, комиссии, количества транзакций, ID транзакций;
— Переход в личную карточку сотрудника;
— Возможность повторять и редактировать платежи отдельно;
— Отчет на e-mail.

Административная панель
Технический администратор заказчика имеет возможности:
— Просмотра и управления списком корпоративных пользователей;
— Просмотра и управления списком администраторов;
— Доступа к редактированию и деактивации;
— Поиска по имени и ID клиента.

Интеграции
Для полноценной работы сервиса мы внедрили:
— Интеграции по API с платежной системой заказчика. Это собственное программное обеспечение для обработки платежей, которое позволяет организации обрабатывать платежи;
— Виджет Tawk. Это чат для web-сервиса, который позволяет клиентам связываться в режиме реального времени и отправлять сообщения, даже когда администратор не в сети.
Срок реализации: 9 месяцев
Стек технологий
Figma
ReactJS
HTML
CSS
CN