О продукте

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

Виджет может использоваться, как самостоятельно, так и встраиваться через API, например: в чекают-флоу интернет магазина, принимающего крипту, как оплату.

Desktop

Embed

Задача

Сделать редизайн виджета

Увеличить процент успешных оплат

Снизить время до цели

Снизить количество ошибок
с выбором монет и сети

Снизить количество обращений
в саппорт по поводу возврата

Улучшить мобильную версию

Обновить и внедрить компоненты ДС

Критерии успеха

Улучшение метрики время до цели

Улучшение метрики успешных оплат

Улучшение мобильной конверсии

Снижение процента ошибок из-за выбора неверной сети

Снижение количества обращений в саппорт, связанных с возвратом средств

Моя роль

Провёл ревью текущей версии

Подготовил гипотезы

Внёс быстрые изменения и проверил гипотезы

Доработал сценарии и все макеты

Снизить количество обращений
в саппорт по поводу возврата

Собрал и внедрил UI-kit для новой реализации

Повысил эффективность и показатели продукта

Результаты

Время до цели

-49%

Успешные оплаты

+27%

Моб. конверсия

+14%

Ошибки с монетой

-72%

Обращения в саппорт

-90%

по поводу возврата

Проблемы

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

Я изучил данные, провёл ревью и собрал список болей,
подбив их в соответствии с экранами:

Было

Выбор монеты

V 1.0

Desktop

Mobile

Embed

Боли

V 1.0

На метриках мы видели много ошибок при оплате BTC/BSH.
Гипотеза была такая: юзера путали BTC/BSH из-за похожих
иконок и плохого нейминга

Долгое время до цели

Низкая мобильная конверсия

Много обращений в саппорт по поводу возврата

Неудобный формат виджета для embed и чекаутов
при использовании API

Было

Оплата v 1.0

Боли

V 1.0

На этом экране было больше всего отвалов
и мы не понимали почему?

По обращениям в саппорт мы видели, что некоторые
юзера новички 🐹 не понимали как копировать реквизиты

Фидбэк от сейлзов: «Устевший UI во время прямой продажи
не вызывает отклика у потенциальных клиентов!»

Итерация 01

V 1.2

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

Мы сделали хот фикс, чтобы быстро починить платежи
в BTC/BSH, заменив иконки монет, и сделав рерайт.

Стало

Выбор монеты

V 1.2

Desktop

Mobile

Embed

Показатели

V 1.2

Гипотеза по BTC/BSH подтвердилась: иконки и нейминг убрали
больше половины ошибок с выбором монеты и сети: -59%

Улучшения с иконками так же повлияли на время до цели: -12%

Промежуточный результат:
Cтало лучше, экран оплаты в этой итерации тоже минорно
адейтнули

Оплата v 1.2

Стало

Показатели

V 1.2

На экране оплаты добавили подписи к иконокам
копирования это помогло: cнизилось количество
обращений в саппорт по поводу возврата: -11%

Успешные оплаты: +7%

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

Выводы

Мы получили неплохой результат но, не все боли ушли,
надо было сделать ещё вариант дизайна, чтобы сравнить
две версии и добиться лучшего UX.

Выбор монеты v 1.2

Было

Боли

Всё ещё недостаточно хороший показатель время до цели

Всё равно оставались обращения в саппорт по поводу возврата

Низкая мобильная конверсия. Гипотеза: это из-за того,
что влезают только первые пять карточек

Неудобный формат виджета для embed и чекаутов
при использовании API

Оплата v 1.2

Было

Боли

На этом экране было больше всего отвалов
(мы всё ещё не понимали почему)

Ошибки копирования тоже не ушли до конца. В Hotjar’е увидели, что некоторые юзера копировали адрес под QR-кодом 🤦🏻‍♂️

Устевший UI так же остался

Итерация 02

V 2.0

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

Стало

Выбор монеты v 2.0

Desktop

Mobile

Embed

Решение

01

В целом лейаут стал mobile first это упростило вёрстку и сделало его проще для embed версии под управлением API

02

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

03

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

Показатели

Время до цели: -49%

Ошибки c выбором монеты и сети: -72%

Оплата v 2.0

Стало

Инсайт!

Решение

01

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

02

Убрали адрес из под QR кода, чтобы его не копировали руками
и лишний раз не ошибались, забыв символ

03

Кнопки копирования я проверил в рапид коридорках
на коллегах: 8 из 10 респондентов их увидели и поняли,
что клик приведёт к копированию

04

Лого мерчанта засунули внутрь QR кода, чтобы у плательщика связывался сценарий оплаты, и он лучше понимал кому шлёт перевод.

Показатели

Успешные оплаты: +27%

Мобильная конверсия: +14%

Возврат

Новый экран

Про решение

01

Возврат средств был долгим и не автомати-зированным. Работало это так: после запроса на возврат от юзера, наши мерчанты шли к нам, потом мы разбирали кейс и после этого руками делали возврат средств!

02

Мы добавили экран с почтой в начале флоу, чтобы в случае возврата юзер сам мог инициировать весь процесс

Показатели

Обращения в саппорт по поводу возврата: -90%

Результаты

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

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

V 1.2

Показатели

Время до цели: -12%

Успешные оплаты: +14%

Мобильная конверсия: -

Обращения в саппорт
по поводу возврата: -11%

Ошибки с выбором монеты
и сети: -59%

V 2.0

Показатели

Время до цели: -49%

Успешные оплаты: +27%

Мобильная конверсия: +14%

Обращения в саппорт
по поводу возврата: -90%

Ошибки с выбором монеты
и сети: -72%

Метрики успеха

Время до цели

-49%

Успешные оплаты

+27%

Моб. конверсия

+14%

Ошибки с монетой

-72%

Обращения в саппорт

-90%

по поводу возврата

Выводы

Этот кейс подчёркивает важность замеряемого итерационного подхода в дизайне для создания лучшего UX.

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

Другие кейсы

Create a free website with Framer, the website builder loved by startups, designers and agencies.