Кейсы · TrenerBot

Как мы превратили идею сервиса для тренеров в работающий Telegram-продукт.

Telegram-native платформа для сопровождения учеников персональными фитнес-тренерами.

28+
экранов
3
роли пользователей
Telegram Mini App
платформа
React
технология
Интерфейс TrenerBot — главный экран тренера с календарём тренировок
Интерфейс TrenerBot — календарь тренировок ученика с запланированным занятием
Интерфейс TrenerBot — админ-панель со списком тренеров и статусами подписки

01 · Контекст

Что за продукт

Telegram-native платформа для сопровождения учеников персональными фитнес-тренерами.

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

Клиент / продуктTrenerBot
Год2026
ПлатформаTelegram Mini App

02 · Проблема

Работа тренера была разбросана по инструментам

Тренер общается с учеником в Telegram, план хранит в таблице, замеры — в заметках, а видео и файлы — где придётся. Информация теряется, ученик не видит целостной картины, а тренер тратит время на ручную сборку контекста.

Разрозненный workflow

03 · Продуктовая идея

Объединить ключевые сценарии сопровождения внутри Telegram.

Вместо отдельного приложения, которое пришлось бы устанавливать и продвигать, продукт живёт там, где уже идёт общение тренера и ученика. Telegram Mini App даёт полноценный интерфейс, а бот — точку входа и уведомления.

Ключевой принцип — один сценарий «назначил → выполнил → увидел прогресс» без переключения между инструментами.

04 · Роли

3 роли — 3 набора сценариев

Тренер

Trainer Mini App

  • Список учеников и их статус
  • Программы и тренировки
  • Отчёты и прогресс
  • Настройки и уведомления

Ученик

Student Mini App

  • Текущая тренировка
  • Программа на период
  • Обратная связь тренеру
  • Профиль и замеры

Администратор

Admin

  • Управление пользователями
  • Контроль состояния сервиса
  • Служебные сценарии

05 · Архитектура

Два Mini App, бот и backend — одна система

Тренер и ученик работают в разных приложениях с общими сущностями. Бот связывает их и доставляет уведомления, backend хранит данные и отвечает за бизнес-логику.

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

06 · UX

28+ экранов, сгруппированных по задачам

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

Dashboard
Сводка по ученикам и задачам
Clients
Список, карточка, статус
Workouts
Программы, упражнения, подходы
Profiles
Профиль тренера и ученика
Settings
Параметры и интеграции
Notifications
События и напоминания
Admin
Служебные экраны

07 · Дизайн-система

От хаоса стилей к системе

Before

Цвета и стили задавались на месте, компоненты дублировались.

Audit

73HEX-цветов до аудита

Инвентаризация: 73 HEX-цвета и 1960+ inline color values.

System

Токены цвета, типографики, отступов; правила состояний.

Components

Единый набор компонентов на antd / antd-mobile.

73
HEX-цветов до аудита
1960+
inline color values

08 · Разработка

Стек, на котором это работает

Технологии выбирались под задачу Mini App: быстрая сборка, предсказуемое состояние, готовые mobile-компоненты, нативная интеграция с Telegram и серверная часть, спроектированная под эти сценарии.

  • React
  • Vite
  • Redux Toolkit
  • antd / antd-mobile
  • Recharts
  • dnd-kit
  • Telegram Apps SDK
  • Telegram Bot API
  • Backend / Database

Технологии показаны после контекста и продуктовых решений — как следствие, а не как витрина.

09 · Продуктовые решения

Что мы сознательно не стали делать в MVP

MVP решает одну задачу — сопровождение ученика тренером внутри Telegram. Всё, что не усиливает этот сценарий, сознательно вынесено за границы первой версии.

Marketplace
Видеозвонки
AI-генерация
Wearables
Полноценная CRM
Границы MVP

Границы MVP зафиксированы до проектирования: без marketplace, видеосвязи, AI и интеграций с носимыми устройствами. Это позволило довести продукт до работающего состояния, а не до бесконечного бэклога.

10 · Что это значит для вас

Мы не продаём TrenerBot. Мы продаём компетенции, доказанные им.

Каждый этап кейса — это отдельная услуга, которую можно применить к вашему продукту.

Есть похожая задача?

Расскажите о своём продукте — покажем, какие решения из этого кейса применимы к нему.