Написать Frontend часть для Web приложения в telegram

Нужно написать игру кликер в телеграм, которая будет в концепции Hamster Kombat, бекенд часть почти готова(для нее есть все доки), требуется фронт, есть примерный дизайн. Стек разработки можете предлагать самостоятельно. Рассмотрю все отклики. В дальнейшем потребуется поддержка и сопровождение проекта.



Начальный экран загрузки
- Логотип игры
- Анимация загрузки (может быть связана с основной тематикой игры)
---

Подписка на канал
├── Кнопка перехода в канал для подписки
├── Кнопка "Продолжить" / "Играть"
├── Скрипт автоматической проверки подписки
Добавить уведомление или подсказку о необходимости подписки, если пользователь пытается продолжить игру без неё.

---

Главный экран игры
├── Всплывающее модальное окно при возвращении пользователя в игру , показывающее, сколько монет пользователь заработал, пока был вне игры.
├── Всплывающее модальное окно с ежедневными наградами для стимулирования частого возвращения в игру
---

Главная страница
├── Лидербоард по лигам (описание внизу)
├── Модальное окно: уведомление о получении достижения
│ ├── Название достижения
│ ├── За что получено достижение
├── Меню баланса (отображает текущий баланс)
│ ├── Шкала энергии под меню баланса
├── Интерактивная планета
│ ├── Получение монет при нажатии
├── Панель внизу страницы с иконками ( должна быть на всех страницах приложения)
│ ├── Home - вернуть на главную страницу
│ ├── Boosts - страница улучшений
│ │ ├── Улучшение 1: Multitap
│ │ │ ├── Модальное окно: подтверждение покупки
│ │ ├── Улучшение 2: Passive Income
│ │ │ ├── Модальное окно: подтверждение покупки
│ │ ├── Улучшение 3: Energy Regen
│ │ │ ├── Модальное окно: подтверждение покупки
│ │ ├── Улучшение 4: Energy Limit
│ │ │ ├── Модальное окно: подтверждение покупки
│ ├── Friends - страница друзей
│ │ ├── Отображение количества приглашенных пользователей
│ │ ├── Отображение монет за приглашение
│ │ ├── Кнопка "Invite Friends"
│ │ ├── Кнопка "Copy Link"
│ ├── Tasks - страница заданий
│ │ ├── Задание 1
│ │ │ ├── Награда за задание
│ │ ├── Задание 2
│ │ │ ├── Награда за задание
│ ├── Achievements - страница достижений
│ │ ├── Список достижений
│ │ │ ├── Условие для выполнения достижения
│ │ │ ├── Награда за выполнение достижения
│ ├── Config - страница настроек (переместить в верхний правый угол)
│ ├── Переключатель вибрации
│ ├── Переключатель языка


Лидерборд по лигам размещен рядом с меню баланса, при нажатии открывается отдельная страница с начальной лигой, также есть возможность переключения между ними чтобы смотреть кто находится в топе следующих лиг.
отметка о текущей позиции игрока и их ближайших конкурентах, чтобы игрок знал, на какое место ему нужно стремиться.
├── Лига Бронзовая (0-100K монет)
│ ├── Топ пользователей по текущему балансу монет
│ ├── Место
│ ├── Имя пользователя
│ ├── Баланс монет
├── Лига Серебряная (100K - 500K монет)
│ ├── Топ пользователей по текущему балансу монет
│ ├── Место
│ ├── Имя пользователя
│ ├── Баланс монет
├── Лига Золотая (500K - 3M монет)
│ ├── Топ пользователей по текущему балансу монет
│ ├── Место
│ ├── Имя пользователя
│ ├── Баланс монет
├── Лига Платиновая (3M - 15M монет)
│ ├── Топ пользователей по текущему балансу монет
│ ├── Место
│ ├── Имя пользователя
│ ├── Баланс монет
├── Лига Алмазная (15M - 50M монет)
│ ├── Топ пользователей по текущему балансу монет
│ ├── Место
│ ├── Имя пользователя
│ ├── Баланс монет

Читайте на 123ru.net