Как мы закрыли форму, которой было 15 лет, и не уронили конверсию
Через эту форму проходило более 98% всех платежей сервиса.
Контекст
Компания трансформировала биллинговую систему, чтобы быстрее адаптировать её к новым бизнес-целям. Одной из частей этой трансформации стало закрытие старой формы оплаты.
Я взял на себя роль Project Manager этого проекта и очень благодарен коллегам за доверие. При этом я продолжал работать над проектом как Product Designer.
Цели
- исправить в новой форме критичные проблемы, из-за которых компания теряла деньги;
- перенести в неё все обязательные платёжные сценарии;
- предусмотреть возможность встраивать форму в сценарии оплаты внутри продуктов;
- закрыть старую форму;
- сохранить конверсию при переходе.
На старте
* А ещё у нас был амбициозный проект и общее желание наконец закрыть старую форму!
Чего нам недоставало
- полной картины всех пользовательских сценариев, связанных с формой и подписками;
- понятного разделения ответственности между командами разработки и дизайнерами в контексте новой формы;
- большого запаса времени на несколько итераций экспериментов.
С какой стороны прочитать этот кейс?
До этого момента контекст был общим. Дальше одна версия рассказывает про управление проектом, другая – про дизайн системы состояний. Начать можно с любой.
Моя роль как
Product Designer
Я был основным дизайнером core-команд биллинга и одним из носителей сквозного контекста о платёжных сценариях и интерфейсе. Я отвечал за следующие направления работы:
Главная функция
Удерживать одну непротиворечивую модель между сценариями, интерфейсом и командами.
Исследовать и проверить
Сбор
Собирал и проверял информацию о платёжных сценариях, ограничениях и существующем поведении.
Что выходило на следующем шаге
- Сценарии
- Ограничения
- Фактическое поведение
Сделать сложность видимой
Визуализация
Переводил найденную логику в карты сценариев, состояния интерфейса и структуру billing kit.
Что выходило на следующем шаге
- Scenario map
- States
- Billing kit
Свести участников к одному решению
Согласование
Согласовывал основные сценарии, corner cases и границы ответственности между командами.
Что выходило на следующем шаге
- Corner cases
- Ownership
- Финальные решения
Сохранять общий контекст
Синхронизация
Поддерживал общий контекст на еженедельных синках с разработчиками, Product Owner’ами и другим дизайнером биллинга.
Что выходило на следующем шаге
- Weekly sync
- Design review
- Следующие шаги
Взаимодействие
двух Product Designer
Вместе с дизайнером смежной команды биллинга мы работали над одним billing kit.
биллинга
биллинга
Один billing kit
Вместе отвечали заРаспределяли работу над billing kit.
Передавали компоненты другим дизайн-командам.
Тестировали и проверяли дизайн-решения.
Тестировали сценарии на стейдже и проде, исправляли неточности.
Граница между нами совпала с границей между командами — она ниже.
Одна форма: три зоны, две команды
Один экран — три зоны с двумя владельцами. Граница между командами проходит по PCI DSS.
Changing subscription plan
Buying keyword packs
Change your plan?
You still have Pro active until May 24, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Business$499.95 /mo
Quantity−2+
Next chargei$499.95
BillingEvery month
Total$40.00 /mo
BillingEvery 1 month
Card••5763
Your card’s security code is incorrect.
Today’s chargei$66.66
Today’s chargei$66.66$5.33
All prices are in US dollars and include tax.
Смежная команда
- Информация о цене и подписке
- Периодичность
- Сумма для оплаты и кнопка
- И другая справочная информация
Моя команда
- Поля для ввода данных карты
- Обработка данных с формы
- Предоставление справочной информации смежной команде
Карта платёжных сценариев
Я описал все возможные типы платёжных сценариев и объединил их в одну карту для удобства работы в рамках проекта.

Одна карта для общего контекста
Карта помогает быстро увидеть все сценарии, учитывать взаимосвязи и принимать решения внутри команды.
карта во весь экран
Billing kit
Документация и публичные компоненты
Для каждого компонента описали, как меняется интерфейс в разных условиях.
Для каждого компонента определили
Собрали базовую форму из компонентов
Из неё можно было накликать любое состояние под нужный сценарий.

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

17
основных состояний собирается из одного главного компонента
Из свойств компонента можно был собирать любое необходимое состояние под любой сценарий пейволла или формы оплаты.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Added unitsi$89.99 /mo
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Next chargei$249.95
Next charge dateFebruary 16, 2027
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$0.00
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Added unitsi$89.99 /mo
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Subscribing to
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Custom offer$249.95
Quantity−4+
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Trial period used. You can continue using the product at its full price.
Guru$249.95 /mo
Quantity−4+
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Trial period used. You can continue using the product at its full price.
Guru$249.95 /mo
Quantity−4+
Added units$0.00 /mo
Your new plan will not include previously added units. You can also .
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Next chargei$249.95
Next charge dateFebruary 16, 2027
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$0.00
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Guru$249.95 /mo
Quantity−4+
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Subscribing to
Buying extra projects
Change your plan?
You still have Pro active until February 16, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Custom offer$249.95
Quantity−4+
Next chargei$249.95
BillingEvery month
Total$48.00 /mo
BillingEvery 1 month
Card••6926
Your card was declined.
Today’s chargei$166.63
Today’s chargei$166.63$32.00
All prices are in US dollars and include tax.
Вложенность и параллельная работа
Одна форма состояла из вариантов, блоков и вложенных компонентов. Такая структура фиксировала границы владения и позволяла командам обновлять свои части параллельно.
Let's share together
Offer type8, Has card=No
2nd trial, Has card=Yes
1st Trial, Has card=No
1st Trial, Has card=Yes
Standard, Has card=No
Standard, Has card=Yes
Варианты формы — те же свойства, что в ките
- Уровень 1
Варианты формы
Состояния начинались с тех же свойств, которые были заданы в Billing kit.
- Уровень 2
Блоки двух команд
Каждый вариант собирался из блоков с разделённой ответственностью: платёжные поля принадлежали моей команде, кнопки — смежной.
- Уровень 3
Вложенные компоненты
Внутри блока находились отдельные компоненты со своими владельцами и согласованными правилами обновления.
- Уровень 1
Варианты формы
Состояния начинались с тех же свойств, которые были заданы в Billing kit.
Let's share together
Offer type8, Has card=No
Summary blockPayment block2nd trial, Has card=Yes
Summary blockPayment block1st Trial, Has card=No
Summary blockPayment block1st Trial, Has card=Yes
Summary blockPayment blockStandard, Has card=No
Summary blockPayment blockStandard, Has card=Yes
Summary blockPayment blockВарианты формы — те же свойства, что в ките - Уровень 2
Блоки двух команд
Каждый вариант собирался из блоков с разделённой ответственностью: платёжные поля принадлежали моей команде, кнопки — смежной.

Внутри — блоки двух команд - Уровень 3
Вложенные компоненты
Внутри блока находились отдельные компоненты со своими владельцами и согласованными правилами обновления.

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

21+
условных развилок в общей логике
- has card?
- is trial?
- downgrade?
- ошибка
- успех
- ожидание
- процессинг

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

Те же условия в компонентах
Те же условия использовались в свойствах компонентов.
Состояние на карте имело точное соответствие в billing kit — его не нужно было переводить в макет или объяснять команде словами.

Поиск
Разработчики могли по названию найти нужную конфигурацию компонентов.
Дизайнеры — проверить её соответствие сценарию.
QA — использовать то же название при описании ошибки.

Одна форма
в разных точках оплаты
Мы отделили контекст покупки от самой оплаты.
Меняется в зависимости от сценария
- Оффер (название плана)
- Итоговая сумма
- Действие(например,Оплатить/Обновить)
- Контекст сценария (тарифы, апгрейд, лимиты, пейвол, страница оплаты)
Остаётся общим
- Платёжные поля
- Сохранённые карты
- Валидация
- Состояния загрузки
- Обработка ошибок
Changing subscription plan
Buying extra projects
Change your plan?
You still have Pro active until July 31, 2027
You still have a paid period of your current subscription left. Changing the plan now will mean losing it.
If you have any questions, contact us.
Business$499.95 /mo
Quantity−5+
Next chargei$499.95
BillingEvery month
Total$50.00 /mo
BillingEvery 1 month
Card••1598
Your card has expired.
Today’s chargei$183.32
Today’s chargei$183.32$18.33
All prices are in US dollars and include tax.
Система прошла проверку в продакшене
Мы закрыли старую форму только после того, как убедились, что новая платёжная основа работает стабильно и сохраняет ключевые конверсии.
Первый A/B дал противоречивый результат
Попыток отправить форму стало больше, но конверсия в первый платёж снизилась. Распределение участников между группами тоже вызывало вопросы.
- Попытка отправки формы
- 2 357→3 032
- +15,32%
- Первый платёж
- 78→61
- −29,89%
Проверили измерение — A/A-тестом
Обе группы видели одинаковый интерфейс. Проверили рандомизацию и настройки, прежде чем продолжать эксперимент.
- Попытка отправки формы
- 9 794→9 902
- +1,59%
- Успешная отправка
- 7 378→7 447
- +1,42%
- Триал
- 4 185→4 169
- +0,10%
Проверка подтвердила корректность системы измерений. Эксперимент можно было перезапустить.
Повторный A/B показал сопоставимую конверсию
Повторный запуск шёл три недели. Распределение по группам стало нормальным; результат оценивали по критерию «без потери конверсии».
- Попытка отправки формы
- 2 762→3 103
- +5,74%
- Успешная отправка
- 2 675→2 869
- +0,95%
- Триал
- 2 276→2 416
- −0,09%
- Платящие пользователи
- 88→107
- +14,44%
- Первый платёж
- 13→21
- +52,04%
+52,04% по первым платежам — это 13 событий против 21. При такой выборке итог эксперимента — паритет по конверсии.
Миграцию продолжили, старую форму закрыли
Вместе с аналитиками приняли решение о выкладке. Завершили постепенный перевод трафика на новую платёжную основу.
Паритет достигнут.
Старая форма закрыта.Миграция продолжилась без заметной потери конверсии.
В карточках — число событий в исходной и новой версиях; в A/A-тесте — в двух группах с одинаковым интерфейсом. Δ — изменение конверсии из отчётов, а не прирост числа событий.
Что я взял на себя как PM
Управление проектом
формирование проекта миграции и еженедельные обновления во внутренней системе управления проектами;
Коммуникация
настройку каналов коммуникации между участниками;
Отчётность
отчётность перед руководителями и другими стейкхолдерами;
Координация команд
координацию движения к результату и работу с межкомандными блокировками.
Неопределённость и план
В начале проекта стало понятно, что из-за большого количества команд и пересекающихся зон ответственности решения могут затягиваться. Не всегда было очевидно, кого подключать к конкретному вопросу, кто принимает финальное решение и кого достаточно держать в курсе.
Чтобы снизить этот риск, я составил карту стейкхолдеров, зон ответственности и принятия решений. Для каждого типа вопроса я зафиксировал:
- кого нужно подключать;
- кто принимает финальное решение;
- кого нужно информировать о прогрессе;
- какую отчётность показывать, с какой частотой и в каком формате.
Карта помогала участникам быстрее понимать маршрут принятия решения. Она также позволяла заранее замечать межкомандные зависимости, которые могли повлиять на сроки.
Затем мы провели несколько встреч с командами биллинга, определили основные этапы и оценили требуемые ресурсы.
Где проект начинал буксовать
Главной сложностью были зависимости между командами. Закрыть старую форму можно было только после модернизации платёжных сценариев внутри продуктов.
Когда разработчики переключались на другие критичные задачи, возникали взаимные блокировки: одна команда не могла продолжать работу без результата другой.
Ещё одной точкой напряжения стал пересчёт сроков. Чтобы обновить прогноз, нужно было заново собрать информацию о доступности разработчиков и сопоставить проект с квартальными целями нескольких команд.
Принятие решений
Чтобы удержать сроки, мы определили минимальный объём работ, необходимый для полного закрытия старой формы. Дополнительные проблемы оценивали по риску для пользователей, объёму трафика и стоимости исправления.
Мы разделили точки, в которых возникал этот сценарий. В форме оплаты из-за значительно большего трафика исправление включили в обязательный объём проекта. Внутри продуктов масштаб риска был ниже, поэтому эту часть оставили для отдельной проверки через эксперименты.
Другая группа решений была связана с межкомандными зависимостями. В одной из ситуаций часть задач взял разработчик из другой команды, который сам предложил помощь. После этого мы пересогласовали зоны ответственности и последовательность работ, и команды смогли продолжить проект. Я отдельно благодарен ему за готовность подключиться за пределами своей основной зоны ответственности.
Контроль сроков и рисков
Общую дорожную карту вели в Monday вместе с проектами остальных команд биллинга. Руководители видели зависимости, текущий статус и связанные с этапами артефакты.

Параллельно я поддерживал отдельную, более подробную дорожную карту проекта. Она показывала, что уже сделано, над чем мы работаем сейчас и что должно начаться следующим. Благодаря ей любой участник мог быстро восстановить контекст.
- Раз в неделю – встречи с разработчиками и Product Owner’ами: прогресс, блокировки и следующие шаги;
- Раз в месяц – отчёт перед всеми командами биллинга;
- Раз в квартал – общая презентация для стейкхолдеров.
Основными получателями оперативной отчётности были Head of Product и CPO.
Состав команды почти не менялся. Заранее договорились, что основную часть работы возьмёт один разработчик, а остальные специалисты будут подключаться на отдельных этапах. Например, бэкенд-разработчики подключались к задачам из области PCI DSS, а ближе к завершению проекта присоединились специалисты, отвечавшие за настройку и выкладку на предпродовую и продовую среды.
Сроки пересчитали один раз. После повторной оценки я сдвинул прогноз на месяц, заложив дополнительный запас. Техническую разработку завершили до обновлённого дедлайна.
Что получилось
Старую платёжную форму закрыли, а обязательные сценарии перенесли в новую. Она стала поддерживать основные типы покупок, дополнительные и индивидуальные предложения, триалы с промокодами и обновление платёжных данных. Новую форму также встроили в виджеты апгрейда и докупки внутри продуктов.
Мы исправили критичный сценарий, в котором пользователь мог случайно заменить существующую подписку и потерять накопленные лимиты. Для пользователей с неоплаченной подпиской добавили явное предупреждение о последствиях покупки нового плана.
Вместо двух реализаций формы осталась одна. Изменения, связанные с налогами, процессингом и интерфейсом, больше не требовалось повторять в двух местах. Это также упростило поиск причин платёжных инцидентов.
Первая попытка проверить новую форму через эксперимент не дала надёжного результата: данные разных метрик противоречили друг другу. После проверки аналитики эксперимент перезапустили.
Статистически значимого снижения ключевых конверсий не обнаружили. После обсуждения результатов с аналитиками новую форму выкатили на весь трафик тестируемого сценария. Затем завершили постепенный перевод трафика и окончательно закрыли старую форму.
Статистики по обновлённому MRR после того, как мы закрыли дыру с перезаписью подписок, у меня уже не было. Поэтому я не могу сказать, насколько успешно это сработало. Но сути это не меняло: форму нужно было перенести – и мы это сделали.
Что я понял о себе и роли PM
Раньше значительная часть работы PM казалась мне простой последовательностью встреч: собрать ожидания, сделать саммари и договориться со следующей группой людей. В этом проекте я увидел ценность этих обычных действий в масштабе. Когда несколько команд зависят друг от друга, общий контекст, понятные зоны ответственности и зафиксированные решения напрямую влияют на движение проекта.
Мне было сложно начинать задачи с высокой неопределённостью, и я замечал, что из-за страха откладываю первые шаги. Особенно трудно было говорить о том, что срок может измениться и потребуется повторная оценка. Я понял, что задача PM – поднимать такую неопределённость достаточно рано, даже когда готового решения ещё нет.
Ещё я понял, что PM не обязан самостоятельно устранять каждую блокировку. Его задача – сделать проблему видимой, собрать нужных людей и создать условия, в которых решение может появиться. В одном из таких случаев разработчик из другой команды сам предложил помощь и снял межкомандную блокировку.






