Контекст
Организаторы федеральной образовательной программы по предпринимательству для студентов хотели дать участникам единое цифровое пространство: понятный онбординг, формирование команд и проектов, задания с проверкой, очки и достижения, рейтинги и призы. Условие — доступ из привычной среды, без установки тяжёлого приложения.
Задача
Собрать ядро приложения и обеспечить стабильный запуск к крупному офлайн‑событию, включая:
- онбординг с детальной регистрацией;
- создать проект/команду или присоединиться по промокоду;
- задания и достижения с начислением очков (личные и командные);
- рейтинги участников и учебных организаций;
- события и посещения с подтверждением;
- витрину призов с уровнями допуска;
- уведомления в мессенджере и базовую админку;
- продуктовую аналитику на уровне экранов и событий.
Ограничения: сжатые сроки перед форумом, пик‑нагрузки в моменты массовых активаций.
Что сделали (коротко)
- Реализовали мини‑приложение внутри Telegram с веб‑интерфейсом под мобильные устройства.
- Построили онбординг: сплэш → карусель → детальная регистрация → шаги проекта/команды (создать/вступить/пропустить).
- Сделали ядро геймификации: каталог заданий и достижений, механизм подтверждения и начисления очков, командные правила.
- Добавили рейтинги: личные и по учебным организациям.
- Реализовали события: список, детали, учёт посещения (в том числе через QR).
- Настроили витрину призов с уровнями допуска и учётом уже полученных наград.
- Подключили уведомления, админ‑интерфейсы и продуктовую аналитику с безопасной обвязкой.
- Обеспечили устойчивость под нагрузкой и предсказуемое время отклика.
Как мы это делали
Архитектура и ключевые решения
- Интерфейс: мобильный веб‑клиент, встраиваемый в Telegram mini app, с маршрутизацией экранов и нижней навигацией. Личный кабинет разбит на профиль, проект, команду и помощь.
- Аутентификация: next.js auth + telegram auth – верификация подписи данных, предоставляемых средой Telegram, на серверной стороне. На клиенте — JWT. Для локальной разработки предусмотрен безопасный тестовый режим без обращения к внешней среде.
- Данные: централизованная реляционная БД – self hosted supabase, продуманная схема для пользователей, команд, проектов, заданий, очков, событий, уведомлений и призов. Ограничения целостности и бизнес‑правила на уровне БД. Реализация атомарности и идемпотентности начисления баллов с помощью транзакций PostgreSQL.
- Интеграция с ботом: сервер‑к‑серверу эндпоинты с секретом для привязки кодов приглашений и регистрации посещений по QR.
- Производительность и устойчивость: кеширование, дедупликация запросов, очереди для логов, покрытие пограничных сценариев (повторные клики, повторная отправка форм). – Amplitude для аналитики данных пользователей
Геймификация
- Уровни пользователей, рассчитанные по количеству баллов, ачивки, доступ к призам только определенного уровня
- Типы активностей: проектные задачи, личные достижения, социальные задания, события.
- Командные правила: некоторые активности начисляют очки всем активным участникам команды.
- Реферальные сценарии: вступление по коду приглашения учитывается в достижениях и метриках.
- Призы: витрина с уровнями доступа; учёт уже полученных наград; ограничения и проверки доступны из интерфейса. – Баллы за посещение вебинаров и оффлайн-событий.
Пользовательские потоки
- Онбординг: сплэш → карусель → регистрация → выбор/создание проекта → вступление в команду (по коду) или пропуск с возвратом.
- Основные разделы: домашний экран с прогрессом и событиями; список заданий/достижений; детали активности; рейтинги; события; призы; профиль/проект/команда/помощь; уведомления.
Надёжность, безопасность, права
- Строгие проверки на входе: валидации, проверка подписей, защита от повторной обработки и гонок, токены для связи с ботом.
- Аудит и трассировка: серверные логи, клиентские батч‑логи с бережной доставкой при закрытии окна.
Наблюдаемость и аналитика
- Схема событий: единый словарь экранов и ключевых действий, базовые атрибуты обогащаются контекстом (среда, маршрут, уровень пользователя и т. п.).
- Безопасная обвязка: любые ошибки аналитики изолируются, чтобы не влиять на пользовательский сценарий; отдельная «защитная оболочка» вокруг аналитических компонентов.
Тестирование
- Компонентные тесты: покрывают ключевые интерфейсные блоки, хуки и вспомогательные утилиты; изоляция через моки.
- Playwright E2E тестирование: мобильные вьюпорты, критические пути (онбординг, навигация, переход по глубокой ссылке).
Результаты
- Единая платформа для участников: регистрация, команды, задачи, очки и призы доступны в экосистеме Telegram в боте и приложении.
- Организаторы получают прозрачные рейтинги и оперативные срезы по событиям и активности.
- Массовые активации отрабатывают стабильно благодаря продуманным ограничениям и очередям.
- Командные механики усиливают вовлечённость, а витрина призов делает прогресс осязаемым.
Скриншоты приложения
