Разработка MVP игры на технологии Telegram MiniApp для MC2 Софтвер
Команда SimbirSoft приняла участие в разработке MVP игры с социальным взаимодействием с использованием технологии встроенных мини-приложений в Telegram.
Клиент
MC2 Софтвер — компания-разработчик сайтов и приложений для мобильных платформ и умных устройств.
Задача
Бизнес-задачи проекта:
-
Запуск минимально жизнеспособного продукта (MVP) для быстрого выхода на рынок и проверки концепции игры.
-
Повышение виральности и привлечение новых пользователей за счет механик приглашения друзей и объединения в кланы.
-
Создание работающей игровой экономики с возможностью монетизации через внутренние покупки (Telegram Stars).
Задачи в контексте frontend-разработки (клиентская часть приложения):
-
Настройка проекта с нуля и создание библиотеки компонентов (Storybook) для ускорения разработки.
-
Интеграция с Telegram и картографическим сервисом MapBox для отображения точек интереса (POI).
-
Реализация игровой логики: заработок валюты, покупка бойцов, захват точек.
-
Разработка функций виральности: приглашение друзей, создание кланов, кнопка «Поделиться».
-
Создание внутриигрового магазина с оплатой через Telegram Stars.
-
Использование серверных действий (server actions) для защиты запросов к программному интерфейсу (API).
Задачи в контексте backend-разработки (серверная часть приложения):
-
Разработка системы профилей игроков с поддержкой часовых поясов и нескольких персонажей.
-
Реализация географической привязки и бизнес-логики захвата точек для генерации валюты.
-
Создание системы обмена внутриигровой валюты на реальные деньги.
-
Обеспечение сбора аналитики активности пользователей.
-
Настройка мониторинга и сквозного тестирования (e2e) ключевых процессов.
Решение
Для реализации MVP игры была сформирована компактная кросс-функциональная команда из четырех специалистов: backend-разработчик (он же DevOps), frontend-разработчик, дизайнер и менеджер проекта. Такой подход обеспечил высокую скорость коммуникации и принятия решений.
Главной договоренностью между Frontend- и Backend-разработчиками было поддержание актуальной API-документации. Она служила источником для генерации контрактов данных, HTTP-клиента и запросов к API по кастомизированным шаблонам. Для генерации использовали swagger-typescript-api, что позволило автоматизировать этот процесс и исключить ошибки ручного написания типов.
Архитектура и ключевые технологические решения:
На клиентской части приложения основой стал NextJS, что позволило использовать серверные действия (server actions) для скрытия запросов к API от клиента и повышения безопасности. Для управления состоянием на клиенте применен @tanstack/react-query. Все запросы к API строились на автоматически сгенерированных контрактах — это обеспечивалось инструментом swagger-typescript-api, который на основе актуальной OpenAPI-спецификации создавал типобезопасный HTTP-клиент. Такой подход исключил расхождения между frontend- и backend-частями и ускорил разработку.
Для ускорения верстки и обеспечения единообразия интерфейса на первом этапе была создана библиотека базовых UI-компонентов в Storybook. Интеграция с платформой Telegram выполнена через @telegram-apps/sdk-react, что дало полную поддержку возможностей мини-приложений. В качестве картографического сервиса выбран MapBox с кастомной стилизацией для отображения списка точек интереса (POI).
Backend-разработка велась с фокусом на ключевые игровые механики: система профилей, географическая привязка реальных объектов к виртуальным, логика захвата точек и генерации валюты. Отдельно проработана система обмена внутриигровой валюты на реальные средства.
Для обеспечения надежности и наблюдаемости сервиса были внедрены:
-
сбор метрик приложения в Prometheus,
-
логирование в Grafana,
-
трассировка критических участков кода в Jaeger.
Аналитика активности пользователей реализована в два этапа: сначала через генерацию CSV-отчетов напрямую из базы данных, затем — через создание веб-интерфейса администратора. Каждый ключевой бизнес-процесс покрыт сквозными тестами (e2e).
Планирование и этапы:
Разработка велась итеративно с января по август 2025 года.
-
База: верстка базовых UI-компонентов, создание Storybook, «глупых» экранов.
-
Карты: подключение и стилизация MapBox, парсинг и отображение POI.
-
Игровая логика: реализация заработка валюты, покупки бойцов, захвата точек, интеграция с backend.
-
Социальные механики: разработка функционала приглашения друзей, кнопки «Поделиться», создания и управления кланами.
-
Монетизация: создание внутриигрового магазина с приемом платежей через Telegram Stars.
Результаты
-
Успешно запущен MVP игры в Telegram MiniApp с полным циклом игровой экономики: заработок валюты, покупка бойцов, захват точек, обмен на реальные средства через Telegram Stars.
-
Реализованы виральные механики (приглашение друзей, кланы, кнопка «Поделиться») для органического роста аудитории.
Технические результаты:
-
Разработано масштабируемое приложение на NextJS.
-
Настроена инфраструктура мониторинга (Prometheus, Grafana, Jaeger) и сквозное тестирование (e2e) ключевых бизнес-процессов.
-
Проведено тестирование и отладка на различных устройствах.
Технологии
NextJS, tailwind, tanstack-query, mapbox-gl, shadcn, storybook, swagger-typescript-api.
