Новая платежная страница Robokassa: как, что и зачем мы изменили

Татьяна Глазачева, CEO платежного сервиса Robokassa:

Очевидно, что основное событие 2020 года – пандемия COVID-19 – серьезно повлияла на многие сферы и аспекты нашей жизни. Например, для сферы электронной коммерции ситуация стала толчком для развития и роста, поэтому, в целом, год оказался успешным. Согласно данным Ассоциации компаний интернет-торговли (АКИТ) в прошлом году российский рынок e-commerce составил 3,2 трлн рублей, что на 58,5% больше показателя 2019 года. В 2020 году количество онлайн-покупок выросло почти на 80%, россияне оформили 830 млн заказов в интернете – такие цифры озвучил директор исследовательского агентства Data Insight Борис Овчинников.

Покупатели привыкли к онлайн-платежам и к тому, что это просто, быстро и удобно. Качество платежной страницы – играет ключевую роль и влияет на самый важный показатель для продавца – конверсию оплат.

И мы сделали новую платежную страницу в такой технической логике, чтобы наши клиенты-мерчанты, выполнив главную задачу и доведя клиентов до покупки, были уверены, что процесс оплаты будет быстрым и комфортным, а еще лучше – практически незаметным. Здесь парадокс заключается в том, что лучшая платежная страница – это та, на которой пользователь даже не успевает обратить внимание на то, как оплата уже совершена. Обеспечить подобный пользовательский опыт – задача непростая, ведь помимо технических нюансов, необходимо соблюсти множество требований от МПС, условий безопасности и внутренних регламентов компании. Учитывая все эти моменты, мы основательно поработали над логикой платежной страницы, чтобы в итоге предоставить пользователям максимально комфортный, актуальный и стабильный инструмент для торговли. Этот масштабный проект мы начали с того, что определили спектр моментов, которые нас не устраивают и требуют изменения:

— Не оптимальная по времени загрузка страницы

— Избыточные элементы интерфейса

— Устаревшая логика формы «оплата картой»

— Скролл страниц даже с маленькой формой

— Устаревшая логика отображения ошибок

После определились с тем, что мы хотим реализовать в новой версии платежной страницы:

— Легкую и быструю загрузку страницы

— Новую логику оплаты картой

— Объединение методов оплаты

— Новую логику поведения ошибок

— Интуитивно понятное взаимодействие с покупателем после оплаты

Передаю слово Ивану Алексееву, CTO компании Robokassa. Иван подробно расскажет, что именно претерпело изменения в новой версии платежной страницы и как это скажется на удобстве нашего клиента и его плательщика.

Иван Алексеев, CTO платежного сервиса Robokassa:

Мы постарались сделать наши платёжные инструменты максимально незаметными для плательщика, не отвлекающими его от процесса покупки. Чтобы можно было сказать: «Если я не помню, через что платил, я платил через Robokassa». Я постараюсь максимально наглядно и конкретно описать ключевые изменения, которые дадут нашему пользователю кардинально новый опыт взаимодействия с платежной страницей.

Что мы сделали?

— Объединили платежные методы.

— Переработали каталог способов платежа.

— Свели к минимуму число кликов при платеже.

— Сделали уход с формы оплаты во время платежа осознанным действием.

— Исключили тупиковые пути при проблеме с оплатой.

— Всю правовую информацию сделали всплывающими окнами.

А теперь обо всем в деталях.

Объединили платежные методы

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

• Метод «Банковская карта» – включает в себя платёжные токены, кредитные карты, карты рассрочки и дебетовые карты платёжных систем Visa, MasterCard, Maestro и «Мир».

• Метод «Мобильный платеж» – включает в себя всех сотовых операторов, через которых проводятся платежи

• Объединение методов – если некий сервис владеет разными способами оплаты под одним брендом ( например, «Элекснет», оплата через терминал и через кошелек), то они объединяются в один, а переключение между ними осуществляется на форме оплаты.

Новый каталог способов платежа

В каталоге мы отказываемся от категорий, сортировки и поиска по причине объединения методов и сокращения их числа.

Минимум кликов при платеже

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

Вывод: таким образом, процесс оплаты для покупателя становится более быстрым и удобным.

Оплата прошла успешно: сценарии

• Возврат на страницу успеха внутри магазина

Мы не показываем форму success, её показывает магазин. Наша задача здесь – вернуть пользователя в магазин сразу после успешного проведения платежа.

• Страница с демонстрацией success

Это решение для магазинов, у которых нет страницы «успеха» или возврат не важен (например, в случае продажи только одного цифрового товара). По кнопке мы возвращаем покупателя на страницу, которую указал магазин. На второй странице можно вернуться в магазин и показать чек оплаты.

• Success – тупиковая страница

Это решение подходит для тех, кто продает в мессенджерах или соцсетях – то есть, там, где возвращать пользователя некуда.

Уход с формы оплаты во время платежа – осознанное действие

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

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

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

При проблеме с оплатой больше нет тупиковых путей

Если происходит ошибка «Отмена операции банком», мы принудительно возвращаем пользователя на форму оплаты. Как правило, это связано с неправильным вводом данных или недостаточным количеством средств.

И конечно, мы поступаем так же при переходе к подтверждению оплаты при других методах платежа.

Важно: чтобы покупателю не пришлось тратить время и вновь заполнять форму оплаты, мы сохраняем всю информацию, которую пользователь ввёл ранее (кроме кода CVC/CVV, это поле мы оставляем пустым).

— Банковские карты и токены

Если происходит ошибка при обращении к форме 3DS или отклонение операции банком, мы предлагаем проверить баланс и данные карты, обратиться в банк или оплатить другой картой.

— Другие методы оплаты

Если происходит ошибка при попытке оплаты – мы возвращаем на форму.

Вывод: не отпуская покупателя с платежной страницы, мы увеличиваем возможность успешной оплаты.

«Время вышло»: сценарии

— Сценарий №1 – если время оплаты выходит, возвращаем в магазин

За пять минут до окончания актуальности выводим уведомление, которое закрывается свайпом. Через две и через одну минуту до истечения времени мы повторяем уведомление, если оно было закрыто. Когда время истекает, показываем экран с загрузкой, пока не перенаправим в магазин.

— Сценарий №2 (тупик) – когда время оплаты вышло, а перенаправить покупателя некуда

Вывод: отправляя уведомления несколько раз, мы повышаем шанс на успешную оплату.

Правовые документы и сертификаты

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

Вывод: покупатель не уходит с платежной страницы, и мы снижаем риск того, что оплата в процессе прервется.

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