Активно ищу работу
Активно ищу работу
re:Kassa Сложный paywall
Category:
Product design
Client:
re:Kassa
The Challenge
Design Pulse envisioned a platform that could pulse with creativity—merging editorial-style layouts with immersive design storytelling. The challenge was to balance expressive visual design with a clear, structured presentation of content.
The Solution
We approached the project with a focus on visual rhythm and hierarchy. Gridded layouts, layered imagery, and smooth motion transitions were combined to give life to the content. The interface was refined to feel editorial yet distinctly digital.
The Result
The final experience captured the essence of creative momentum, earning recognition from design communities and driving more collaboration requests from agencies and creators worldwide.
Проблема
После изучения текущего сценария стало понятно, что пользователи сталкиваются с трудностями почти на каждом этапе пути: от первого контакта с paywall до попытки оплатить подписку.
Сначала я разобрал старый flow по экранам и отметил места, где пользователь мог теряться. В сценарии платный функционал не был обозначен заранее, поэтому paywall появлялся только после клика на закрытую функцию. Из-за этого ограничение могло восприниматься как неожиданное прерывание сценария.
Также была слабая связь между функцией, которую пользователь пытался использовать, и предлагаемой подпиской. Модальное окно сообщало, что функционал станет доступен после оплаты, но не объясняло ценность тарифа и не помогало понять, где дальше искать подписку.
Из анализа старого сценария было видно, что пользователи:
Не понимают, какую конкретную ценность даёт подписка для их типа бизнеса.
Не видят связи между функцией, которую пытались использовать, и предлагаемой подпиской.
Не понимают, где находится раздел «Мои подписки».
Сталкиваются с неясными условиями оплаты и подписки.
Теряются при переходе из приложения в браузер.
Не понимают, на каком этапе сценария находятся и что нужно сделать дальше.
В результате старый сценарий содержал несколько точек оттока, которые могли негативно влиять на конверсию в покупку подписки. Поэтому первым этапом я подробно изучил текущий пользовательский путь и отметил основные проблемные места на старых экранах.
Проблема
После изучения текущего сценария стало понятно, что пользователи сталкиваются с трудностями почти на каждом этапе пути: от первого контакта с paywall до попытки оплатить подписку.
Сначала я разобрал старый flow по экранам и отметил места, где пользователь мог теряться. В сценарии платный функционал не был обозначен заранее, поэтому paywall появлялся только после клика на закрытую функцию. Из-за этого ограничение могло восприниматься как неожиданное прерывание сценария.
Также была слабая связь между функцией, которую пользователь пытался использовать, и предлагаемой подпиской. Модальное окно сообщало, что функционал станет доступен после оплаты, но не объясняло ценность тарифа и не помогало понять, где дальше искать подписку.
Из анализа старого сценария было видно, что пользователи:
Не понимают, какую конкретную ценность даёт подписка для их типа бизнеса.
Не видят связи между функцией, которую пытались использовать, и предлагаемой подпиской.
Не понимают, где находится раздел «Мои подписки».
Сталкиваются с неясными условиями оплаты и подписки.
Теряются при переходе из приложения в браузер.
Не понимают, на каком этапе сценария находятся и что нужно сделать дальше.
В результате старый сценарий содержал несколько точек оттока, которые могли негативно влиять на конверсию в покупку подписки. Поэтому первым этапом я подробно изучил текущий пользовательский путь и отметил основные проблемные места на старых экранах.
Проблема
После изучения текущего сценария стало понятно, что пользователи сталкиваются с трудностями почти на каждом этапе пути: от первого контакта с paywall до попытки оплатить подписку.
Сначала я разобрал старый flow по экранам и отметил места, где пользователь мог теряться. В сценарии платный функционал не был обозначен заранее, поэтому paywall появлялся только после клика на закрытую функцию. Из-за этого ограничение могло восприниматься как неожиданное прерывание сценария.
Также была слабая связь между функцией, которую пользователь пытался использовать, и предлагаемой подпиской. Модальное окно сообщало, что функционал станет доступен после оплаты, но не объясняло ценность тарифа и не помогало понять, где дальше искать подписку.
Из анализа старого сценария было видно, что пользователи:
Не понимают, какую конкретную ценность даёт подписка для их типа бизнеса.
Не видят связи между функцией, которую пытались использовать, и предлагаемой подпиской.
Не понимают, где находится раздел «Мои подписки».
Сталкиваются с неясными условиями оплаты и подписки.
Теряются при переходе из приложения в браузер.
Не понимают, на каком этапе сценария находятся и что нужно сделать дальше.
В результате старый сценарий содержал несколько точек оттока, которые могли негативно влиять на конверсию в покупку подписки. Поэтому первым этапом я подробно изучил текущий пользовательский путь и отметил основные проблемные места на старых экранах.
Исследование и анализ
Я собрал полный flow от первого контакта с платной функцией до перехода к оплате и отметил места, где сценарий прерывается или становится неочевидным для пользователя.
На этом этапе я зафиксировал проблемные точки прямо на экранах, чтобы дальше работать не с общим ощущением, а с конкретными местами в интерфейсе: вход в подписку, появление paywall, поиск раздела «Мои подписки» и переход к платёжным методам.
Ниже показан полный разбор старого сценария с отмеченными проблемными местами.
Исследование и анализ
Я собрал полный flow от первого контакта с платной функцией до перехода к оплате и отметил места, где сценарий прерывается или становится неочевидным для пользователя.
На этом этапе я зафиксировал проблемные точки прямо на экранах, чтобы дальше работать не с общим ощущением, а с конкретными местами в интерфейсе: вход в подписку, появление paywall, поиск раздела «Мои подписки» и переход к платёжным методам.
Ниже показан полный разбор старого сценария с отмеченными проблемными местами.
Исследование и анализ
Я собрал полный flow от первого контакта с платной функцией до перехода к оплате и отметил места, где сценарий прерывается или становится неочевидным для пользователя.
На этом этапе я зафиксировал проблемные точки прямо на экранах, чтобы дальше работать не с общим ощущением, а с конкретными местами в интерфейсе: вход в подписку, появление paywall, поиск раздела «Мои подписки» и переход к платёжным методам.
Ниже показан полный разбор старого сценария с отмеченными проблемными местами.
Бенчмаркинг конкурентов
После разбора текущего сценария я изучил бенчмарки paywall и сценариев оплаты в других продуктах. Смотрел не только прямых конкурентов, но и сервисы с похожей логикой подписки: где пользователь сначала сталкивается с ограничением, а потом переходит к выбору тарифа и оплате.
Мне было важно понять, как продукты объясняют ценность подписки, показывают состав тарифа, работают с выбором периода оплаты и уменьшают количество лишних шагов до покупки.
В процессе анализа я обращал внимание на несколько вещей:
где пользователь впервые видит платный функционал;
как объясняется ценность подписки;
как устроен выбор тарифа;
есть ли акцент на выгоде при выборе длительного периода;
как выглядит переход к оплате;
какие состояния показываются после покупки.
По итогам бенчмаркинга я выделил несколько решений, которые можно было адаптировать для Рекассы: сделать платный функционал заметнее, раскрывать состав подписки до оплаты, показывать тарифы в более компактном формате и не разрывать сценарий лишними переходами.
После бенчмаркинга я сопоставил найденные паттерны с проблемами текущего сценария. На основе этого сформировал гипотезы, которые должны были упростить путь пользователя: сделать платный функционал заметнее, понятнее раскрыть ценность подписки, сократить лишние переходы и улучшить сценарий оплаты.
После разбора текущего сценария я изучил бенчмарки paywall и сценариев оплаты в других продуктах. Смотрел не только прямых конкурентов, но и сервисы с похожей логикой подписки: где пользователь сначала сталкивается с ограничением, а потом переходит к выбору тарифа и оплате.
Мне было важно понять, как продукты объясняют ценность подписки, показывают состав тарифа, работают с выбором периода оплаты и уменьшают количество лишних подпискишагов до покупки.
В процессе анализа я обращал внимание на несколько вещей:
где пользователь впервые видит платный функционал;
как объясняется ценность ;
как устроен выбор тарифа;
есть ли акцент на выгоде при выборе длительного периода;
как выглядит переход к оплате;
какие состояния показываются после покупки.
По итогам бенчмаркинга я выделил несколько решений, которые можно было адаптировать для Рекассы: сделать платный функционал заметнее, раскрывать состав подписки до оплаты, показывать тарифы в более компактном формате и не разрывать сценарий лишними переходами.
После бенчмаркинга я сопоставил найденные паттерны с проблемами текущего сценария. На основе этого сформировал гипотезы, которые должны были упростить путь пользователя: сделать платный функционал заметнее, понятнее раскрыть ценность подписки, сократить лишние переходы и улучшить сценарий оплаты.
Гипотезы и ICE Score
Провел ICE-скоринг, чтобы выбрать самые полезные и реалистичные гипотезы. В работу взял решения, которые сильнее всего влияют на сценарий
User Flow
После скоринга гипотез я собрал новый User Flow. Нужно было продумать не только сам paywall, но и весь путь пользователя: от первого контакта с платной функцией до активной подписки.
В новом сценарии я оставил два входа в покупку подписки:
С главного экрана: пользователь переходит в личный кабинет, видит раздел «Мои подписки» и открывает экран выбора тарифа.
Из калькулятора: пользователь нажимает на платную функцию, после чего попадает в сценарий оформления подписки.
Оба пути ведут к одному paywall. На нём пользователь видит, что входит в подписку, выбирает тариф и переходит к оплате. После успешной оплаты подписка становится активной, а пользователь может вернуться к функции, ради которой оформлял тариф
Такой User Flow помог убрать разрыв между платной функцией и покупкой подписки. Пользователь понимает, почему функция недоступна, что нужно сделать для доступа и куда он вернётся после оплаты.
Также я заложил в сценарий более понятное состояние после покупки: подписка отображается активной в личном кабинете, а платная функция становится доступной без повторного поиска нужного раздела
User Flow
После скоринга гипотез я собрал новый User Flow. Нужно было продумать не только сам paywall, но и весь путь пользователя: от первого контакта с платной функцией до активной подписки.
В новом сценарии я оставил два входа в покупку подписки:
С главного экрана: пользователь переходит в личный кабинет, видит раздел «Мои подписки» и открывает экран выбора тарифа.
Из калькулятора: пользователь нажимает на платную функцию, после чего попадает в сценарий оформления подписки.
Оба пути ведут к одному paywall. На нём пользователь видит, что входит в подписку, выбирает тариф и переходит к оплате. После успешной оплаты подписка становится активной, а пользователь может вернуться к функции, ради которой оформлял тариф
Такой User Flow помог убрать разрыв между платной функцией и покупкой подписки. Пользователь понимает, почему функция недоступна, что нужно сделать для доступа и куда он вернётся после оплаты.
Также я заложил в сценарий более понятное состояние после покупки: подписка отображается активной в личном кабинете, а платная функция становится доступной без повторного поиска нужного раздела
User Flow
После скоринга гипотез я собрал новый User Flow. Нужно было продумать не только сам paywall, но и весь путь пользователя: от первого контакта с платной функцией до активной подписки.
В новом сценарии я оставил два входа в покупку подписки:
С главного экрана: пользователь переходит в личный кабинет, видит раздел «Мои подписки» и открывает экран выбора тарифа.
Из калькулятора: пользователь нажимает на платную функцию, после чего попадает в сценарий оформления подписки.
Оба пути ведут к одному paywall. На нём пользователь видит, что входит в подписку, выбирает тариф и переходит к оплате. После успешной оплаты подписка становится активной, а пользователь может вернуться к функции, ради которой оформлял тариф
Такой User Flow помог убрать разрыв между платной функцией и покупкой подписки. Пользователь понимает, почему функция недоступна, что нужно сделать для доступа и куда он вернётся после оплаты.
Также я заложил в сценарий более понятное состояние после покупки: подписка отображается активной в личном кабинете, а платная функция становится доступной без повторного поиска нужного раздела
Wireframes
После User Flow я перешёл к wireframes, чтобы проверить структуру ключевых экранов до работы над визуалом.
На этом этапе я собрал основные состояния сценария: экран подписки, выбор тарифа, способы оплаты, успешную оплату и активную подписку после покупки. В wireframes проверил, где пользователь видит состав подписки, как выбирает тариф, какой шаг ведёт к оплате и что происходит после успешной покупки.
Отдельно я проработал состояния до и после оплаты: пользователь без подписки, выбор тарифа, переход к платежу и активная подписка в личном кабинете. Это помогло быстро проверить логику экранов и понять, какие элементы должны быть на каждом шаге.
После этого я перешёл к детализации текстов, состояний и финального UI
Wireframes
После User Flow я перешёл к wireframes, чтобы проверить структуру ключевых экранов до работы над визуалом.
На этом этапе я собрал основные состояния сценария: экран подписки, выбор тарифа, способы оплаты, успешную оплату и активную подписку после покупки. В wireframes проверил, где пользователь видит состав подписки, как выбирает тариф, какой шаг ведёт к оплате и что происходит после успешной покупки.
Отдельно я проработал состояния до и после оплаты: пользователь без подписки, выбор тарифа, переход к платежу и активная подписка в личном кабинете. Это помогло быстро проверить логику экранов и понять, какие элементы должны быть на каждом шаге.
После этого я перешёл к детализации текстов, состояний и финального UI
Wireframes
После User Flow я перешёл к wireframes, чтобы проверить структуру ключевых экранов до работы над визуалом.
На этом этапе я собрал основные состояния сценария: экран подписки, выбор тарифа, способы оплаты, успешную оплату и активную подписку после покупки. В wireframes проверил, где пользователь видит состав подписки, как выбирает тариф, какой шаг ведёт к оплате и что происходит после успешной покупки.
Отдельно я проработал состояния до и после оплаты: пользователь без подписки, выбор тарифа, переход к платежу и активная подписка в личном кабинете. Это помогло быстро проверить логику экранов и понять, какие элементы должны быть на каждом шаге.
После этого я перешёл к детализации текстов, состояний и финального UI
Hi-Fi
После проверки структуры в wireframes я перешёл к финальным экранам.
В hi-fi я обновил визуальную подачу интерфейса, но сохранил тёмно-зелёную основу продукта. Переработал палитру, карточки, кнопки, статусы, отступы и визуальные акценты, чтобы экраны выглядели более цельно и аккуратно.
Также я сделал платный функционал заметнее, вынес статус подписки в личный кабинет, добавил понятный экран выбора тарифа и собрал отдельный экран оплаты с доступными способами платежа.
Отдельно проработал состояние после покупки: пользователь видит, что подписка активна, понимает срок её действия и может вернуться к платной функции без лишних шагов
Hi-Fi
После проверки структуры в wireframes я перешёл к финальным экранам.
В hi-fi я обновил визуальную подачу интерфейса, но сохранил тёмно-зелёную основу продукта. Переработал палитру, карточки, кнопки, статусы, отступы и визуальные акценты, чтобы экраны выглядели более цельно и аккуратно.
Также я сделал платный функционал заметнее, вынес статус подписки в личный кабинет, добавил понятный экран выбора тарифа и собрал отдельный экран оплаты с доступными способами платежа.
Отдельно проработал состояние после покупки: пользователь видит, что подписка активна, понимает срок её действия и может вернуться к платной функции без лишних шагов
Hi-Fi
После проверки структуры в wireframes я перешёл к финальным экранам.
В hi-fi я обновил визуальную подачу интерфейса, но сохранил тёмно-зелёную основу продукта. Переработал палитру, карточки, кнопки, статусы, отступы и визуальные акценты, чтобы экраны выглядели более цельно и аккуратно.
Также я сделал платный функционал заметнее, вынес статус подписки в личный кабинет, добавил понятный экран выбора тарифа и собрал отдельный экран оплаты с доступными способами платежа.
Отдельно проработал состояние после покупки: пользователь видит, что подписка активна, понимает срок её действия и может вернуться к платной функции без лишних шагов
Юзабилити тестирование
После сборки hi-fi экранов я провёл usability-тестирование, чтобы проверить понятность сценария покупки подписки.
В тесте участвовали 15 респондентов: ИП, владельцы небольших торговых точек и пользователи, которые уже работали с кассовыми приложениями.
Формат: удалённое интервью по кликабельному прототипу в Figma, 20-25 минут на одного респондента.
Я проверял 7 задач: найти подписку, понять платные функции, перейти к paywall, разобраться в составе подписки, выбрать тариф, перейти к оплате и понять статус после покупки.
Всего получилось 105 пользовательских действий. Успешно выполнено 91 действие. Общая успешность сценария составила 87%.
Ключевые результаты:
15 из 15 нашли раздел «Мои подписки».
13 из 15 заметили платные функции в калькуляторе.
12 из 15 поняли состав подписки.
13 из 15 выбрали тариф без дополнительных вопросов.
10 из 15 сразу поняли переход к оплате.
13 из 15 поняли, что подписка активна после оплаты.
После теста я уточнил CTA на экране тарифа, усилил описание состава подписки, сделал платные функции заметнее и доработал статус активной подписки.
Юзабилити тестирование
После сборки hi-fi экранов я провёл usability-тестирование, чтобы проверить понятность сценария покупки подписки.
В тесте участвовали 15 респондентов: ИП, владельцы небольших торговых точек и пользователи, которые уже работали с кассовыми приложениями.
Формат: удалённое интервью по кликабельному прототипу в Figma, 20-25 минут на одного респондента.
Я проверял 7 задач: найти подписку, понять платные функции, перейти к paywall, разобраться в составе подписки, выбрать тариф, перейти к оплате и понять статус после покупки.
Всего получилось 105 пользовательских действий. Успешно выполнено 91 действие. Общая успешность сценария составила 87%.
Ключевые результаты:
15 из 15 нашли раздел «Мои подписки».
13 из 15 заметили платные функции в калькуляторе.
12 из 15 поняли состав подписки.
13 из 15 выбрали тариф без дополнительных вопросов.
10 из 15 сразу поняли переход к оплате.
13 из 15 поняли, что подписка активна после оплаты.
После теста я уточнил CTA на экране тарифа, усилил описание состава подписки, сделал платные функции заметнее и доработал статус активной подписки.
Юзабилити тестирование
После сборки hi-fi экранов я провёл usability-тестирование, чтобы проверить понятность сценария покупки подписки.
В тесте участвовали 15 респондентов: ИП, владельцы небольших торговых точек и пользователи, которые уже работали с кассовыми приложениями.
Формат: удалённое интервью по кликабельному прототипу в Figma, 20-25 минут на одного респондента.
Я проверял 7 задач: найти подписку, понять платные функции, перейти к paywall, разобраться в составе подписки, выбрать тариф, перейти к оплате и понять статус после покупки.
Всего получилось 105 пользовательских действий. Успешно выполнено 91 действие. Общая успешность сценария составила 87%.
Ключевые результаты:
15 из 15 нашли раздел «Мои подписки».
13 из 15 заметили платные функции в калькуляторе.
12 из 15 поняли состав подписки.
13 из 15 выбрали тариф без дополнительных вопросов.
10 из 15 сразу поняли переход к оплате.
13 из 15 поняли, что подписка активна после оплаты.
После теста я уточнил CTA на экране тарифа, усилил описание состава подписки, сделал платные функции заметнее и доработал статус активной подписки.
Результат
Результат
Paywall View: 42,3 тыс. → 44,1 тыс.
Start Checkout: 18,4% → 24,7%
Purchase Success: 9,8% → 14,1%
В результате изменений удалось улучшить ключевые показатели воронки. Число просмотров paywall выросло с 1,34 тыс. до 1,80 тыс., что соответствует приросту на 34,3%. Конверсия на этапе Start Checkout увеличилась с 12,8% до 15,1% (+17,6%), а Purchase Success — с 6,7% до 8,3% (+23,9%).
Это показывает, что обновленный сценарий сделал путь пользователя к оплате более понятным и эффективным, а сама воронка — более результативной
