От записи экрана до готового демо.

Показать продукт.
Без сложного монтажа.

Tapely — стартап, который помогает превращать запись экрана в понятный продуктовый ролик. Такие видео нужны для демонстрации возможностей сервиса, инструкций, онбординга и базы знаний. Пользователю важно быстро записать действия в интерфейсе, убрать паузы и выделить главное.

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

От идеи до работающего сервиса

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

1. Разработали лендинг и вход в продукт

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

2. Создали и опубликовали расширение Chrome

   Разработали расширение для записи вкладки браузера с сохранением движений курсора и кликов. Настроили подключение к аккаунту и передачу записи в веб-сервис. Подготовили релиз и опубликовали расширение Tapely в Chrome Web Store.

   Tapely в Chrome Web Store

3. Собрали веб-редактор записей

   Реализовали монтаж на таймлайне: обрезку лишних фрагментов, зум и следование за курсором. Добавили оформление фона, рамку браузера, работу с курсором и кликами, вертикальный формат. Готовый ролик можно экспортировать в WebM или MP4 в зависимости от тарифа.

4. Подключили S3-хранилище и проекты

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

5. Разработали административную панель

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

6. Интегрировали ЮKassa и платные тарифы

   Связали регистрацию и выбор платного тарифа с оплатой через ЮKassa. Настроили обработку статусов платежа и активацию платных возможностей после подтверждения успешной оплаты. Добавили учёт лимитов экспорта и месячного периода тарифа.

Записать. Смонтировать.
Показать продукт.

• Запущен сервис с полным пользовательским сценарием: записать экран в Chrome, отредактировать видео в браузере и скачать готовый продуктовый ролик.
• Курсор, клики, зум и оформление помогают направлять внимание зрителя на нужные действия в интерфейсе. Один инструмент подходит для демо, инструкций и обучающих материалов.
• У продукта есть основа для коммерческой работы: бесплатный и платный тарифы, оплата через ЮKassa, хранение проектов и административное управление.

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