Продуктовые лендинги: путь от первого экрана до оплаты
Как я вёл страницы курсов как продукт: продуктовая логика и структура, метрики на пути до оплаты, тексты вместе с редактором и UX-ревью макетов в паре с дизайнерами
- Product Manager
- 2026
3%+
конверсия лендингов курсов в оплату
10+
продуктовых страниц запустил и обновил
5–7 → 2–3
дня от постановки задачи до выхода страницы
Контекст и задача
Специфика EdTech
Продукт нужно постоянно продвигать: новые курсы и потоки выходят каждый сезон, и у каждого своя страница. Лендинг здесь главный инструмент выхода на рынок: он объясняет продукт, снимает сомнения и ведёт к оплате.
Задача
Растить метрики на всём пути пользователя до старта обучения: конверсию лендинга в заявку и в оплату, конверсию на шаге платежа и скорость, с которой человек доходит до целевого действия.
Моя роль
Отвечал за продуктовую логику и структуру страниц и за их метрики. Вместе с редактором писал тексты. В паре с дизайнером: дизайнер собирал макеты, я смотрел их с точки зрения пользовательского опыта, давал фидбэк и проводил ревью.
Подход: метрики на всём пути до оплаты
Лендинг — один шаг в цепочке, и оценивать его нужно по тому, что происходит дальше. Решения об эффективности страниц мы принимали по трём группам метрик.
Конверсии на ключевых этапах
Регистрация, заявка, выбор тарифа, оплата: на каком шаге теряются люди.
Цикл сделки
Как быстро человек доходит от первого визита до целевого действия. У короткого курса окно продаж маленькое, и долгий цикл — это потерянные деньги.
Скорость релизов
Сколько проходит от постановки задачи до выхода страницы. Чем быстрее релиз, тем больше гипотез успеваем проверить за сезон.
Те же три группы метрик подходят любому продукту, который продаётся через страницу: SaaS, сервисам по подписке, маркетплейсам.
Каждая страница показывает, чему научишься
Уникальные страницы под каждый курс. Курсы разные, и страница каждого показывает то, чему человек научится. Шаблон здесь не работает: продукт должен быть виден с первого экрана.
Figma Motion Ninja. Курс про моушн-дизайн в Figma. Статичная страница не передаёт главного — что ученик научится делать живые интерфейсы. Поэтому первый экран повторяет работу в Figma: курсоры дизайнеров двигают плашки, рамка выделения тянется за текстом. Группа курса набрана полностью.
Как работали с дизайнером. Я собирал структуру и логику страницы и вместе с редактором писал тексты, дизайнер делал макет. Дальше я смотрел макет глазами пользователя: понятно ли с первого экрана, что это за курс, сколько он стоит и что нажать, и давал фидбэк до того, как страница уходила в сборку.
› Посмотреть прокрутку всей страницы Figma Motion Ninja
Vibe Coding Master: страница как результат курса
Обещание результата. Главное обещание страницы — после курса у тебя будет живой сервис в продакшене, который можно положить в портфолио или запустить как свой проект. Первый экран сделан как редактор кода, а программа разложена по шагам сборки сервиса: от описания идеи до запуска с лендингом и метриками.
Доверие. Курс ведёт практикующий разработчик с опытом в дизайне, и страница показывает это фактами: компании, проекты и запущенные продукты.
Повторная покупка. На странице сразу предложение взять второй курс на 20% выгоднее: короткий курс становится первой покупкой в цепочке.
› Посмотреть прокрутку всей страницы
Путь до оплаты: что меняли на шаге покупки
Дедлайны, которые работают. Цена росла по ступеням, и у каждой ступени на странице была своя плашка с датой. Для короткого курса дата старта оказалась более сильным дедлайном, чем цена: основная часть продаж приходила под старт.
Кнопка всегда под рукой. Кнопка участвовать остаётся на экране после первого экрана и ведёт сразу к тарифам.
Шаг оплаты. Выделили поле промокода, чтобы человек не уходил искать скидку, убрали оплату частями там, где она только путала, и добавили выбор плательщика: человек или компания со счётом.
Вейтлист, когда набор закрыт. Если набор закрыт, страница переключается в режим вейтлиста. Конверсия из вейтлиста в оплату обычно высокая, поэтому вейтлист работает как прогрев перед следующим потоком.
Пакеты курсов. Бонус за второй курс и пакеты из нескольких курсов одним платежом поднимают выручку с одного покупателя.
Главная и меню: каталог для меняющейся линейки
Проблема. Линейка перешла с больших программ на короткие курсы и менялась почти каждую неделю. В меню были равнозначные ссылки без иерархии, а главная работала как манифест сезона и почти не помогала понять, какой курс подходит.
Решение. Навигацию построили вокруг направлений и отдельных входов: мероприятия, бесплатные продукты, корпоративное обучение, архив. На главной после первого экрана появился каталог курсов. Новый курс добавляется в своё направление, и меню остаётся прежним.
› Посмотреть главную целиком
Корпоративное направление: отдельный вход для компаний
Проблема. Компании регулярно приходили с запросами на обучение команд, но входа для них на сайте не было. Запросы попадали через личные сообщения и общую почту, их нельзя было посчитать, а форма на сайте подходила только тем, кто уже решил купить.
Решение. Перезапустил направление через отдельную страницу для компаний: ситуации, в которых заказчик узнаёт свою команду, форматы обучения, как устроен процесс, опыт работы с продуктовыми командами и форма заявки. Короткие курсы сделали предложение проще: отправить команду учиться на месяц легче, чем на квартал.
› Посмотреть страницу для компаний целиком
Что не сработало
Страницы жили дольше продуктов. Лендинги больших программ продолжали показывать даты и цены, по которым уже нельзя было купить: человек приходил из поиска и упирался в неработающее предложение. Теперь у каждой страницы есть состояние — идёт набор, вейтлист или курс снят, — и меню показывает только живые продукты.
Ошибки оплаты были не видны. Часть платежей срывалась без понятного сообщения, и мы не видели, сколько покупок теряем на этом шаге. Добавили повторную попытку, журнал ошибок и понятные сообщения покупателю. Шаг оплаты теперь смотрим как отдельный этап воронки.
Вейтлист ничего не давал взамен. Форма просила контакты, но не называла ни даты старта, ни ориентира по цене, и тех, кто не хочет оставлять контакт непонятно за что, мы теряли. Предложил давать вейтлисту ранний доступ к цене, место в группе с фидбэком и ориентир по дате.
Что из этого работает в любом продукте
- 01
Лендинг оценивают по оплатам. Хороший первый экран ничего не стоит, если человек теряется на шаге платежа.
- 02
Страница должна показывать продукт. Чем ближе страница к тому, что человек получит, тем меньше ей приходится объяснять.
- 03
Дедлайн должен быть настоящим. Для короткого продукта дата старта работает сильнее скидки.
- 04
Закрытый набор продолжает продавать. Вейтлист превращает закрытую продажу в прогрев следующего потока.
- 05
У каждой страницы есть срок жизни. Прошлые даты и цены отталкивают человека, который пришёл из поиска.
- 06
Ревью макета глазами пользователя дешевле переделки. Вопрос понятно ли, что нажать, заданный до сборки, экономит дни работы.
«В последний квартал Илья самостоятельно запускал продуктовые страницы, активно используя дизайн-систему и AI-инструменты, что ускорило релизы в 2 раза и позволило уменьшить затраты на дизайн и разработку.»