NikitolProject c9fde121be Init commit

2025-09-17 22:22:14 +03:00

35 KiB

Raw Blame History

Вот подробно расписанное Техническое задание (ТЗ) для разработки Telegram Mini App с викторинами, QR-сканированием и внутренней валютой:

1. 🎯 Общее описание проекта

Необходимо разработать Telegram Mini App — веб-приложение, встроенное в Telegram, где пользователи могут:

Проходить викторины и получать за них внутреннюю валюту.
Сканировать QR-коды (вне приложения и внутри) для получения валюты.
Тратить накопленную валюту в магазине на призы.
Быстро открывать конкретные викторины по QR-коду.

Приложение должно быть быстрым, интуитивно понятным, мобильным и интегрированным с Telegram Web App API.

2. 🧩 Основные функциональные требования

2.1. 🎓 Викторины

Пользователь может просматривать список доступных викторин.
Каждая викторина имеет:
- Название
- Описание
- Количество вопросов
- Награду в валюте за прохождение (фиксированная или по количеству правильных ответов)
- Статус (доступна / уже пройдена / скоро доступна)
Прохождение викторины:
- По одному вопросу на экране
- Варианты ответов (один или несколько — уточнить по типу вопроса)
- Таймер на вопрос (опционально, если требуется)
- По завершению — показ результатов и начисление валюты
Повторное прохождение викторины — запрещено (или с ограничением, например, раз в N дней — уточнить).
История пройденных викторин с датой и полученной наградой.

2.2. 💰 Внутренняя валюта

Единая валюта для всей системы (например, “Коины”, “Звезды”, “Баллы” — название уточняется).
Баланс отображается в шапке приложения.
Начисляется:
- За прохождение викторин
- За сканирование QR-кодов
Не сгорает, накапливается.
История транзакций (начисления и траты).

2.3. 🛒 Магазин призов

Раздел с товарами/призами, которые можно купить за валюту.
Каждый приз имеет:
- Название
- Описание
- Изображение
- Стоимость в валюте
- Статус (доступен / закончился / скоро появится)
При покупке:
- Списание валюты
- Уведомление об успешной покупке
- Инструкция по получению приза (например, код, ссылка, инструкция “забрать в университете” и т.п.)
История покупок.

2.4. 📷 QR-сканирование

2.4.1. Сканирование через приложение

В приложении есть кнопка “Сканировать QR-код”.
При нажатии открывается камера телефона (с разрешения пользователя).
Поддержка сканирования QR-кодов, содержащих:
- Просто награду (например, reward:50)
- Ссылку на открытие конкретной викторины (например, quiz:id=123)
После сканирования:
- Если это награда — начисляется валюта, показывается уведомление.
- Если это викторина — открывается страница этой викторины с возможностью сразу начать прохождение.
Логирование всех сканирований (дата, тип, ID пользователя, результат).

2.4.2. Сканирование вне приложения (через камеру телефона)

QR-коды должны содержать ссылку вида:
https://t.me/your_bot?startapp=reward_50
или
https://t.me/your_bot?startapp=quiz_123
При открытии такой ссылки через камеру или другой сканер — открывается Telegram Mini App с параметром.
Приложение должно обработать параметр:
- Если reward_X — начислить X валюты.
- Если quiz_Y — открыть викторину с ID=Y.
Показать пользователю уведомление о результате (например: “+50 монет получено!” или “Викторина ‘Знаешь ли ты бренд?’ готова к прохождению!”).

2.5. 🔗 Глубокие ссылки (Deep Links)

Поддержка параметров startapp=... для:
- Начисления валюты
- Открытия викторины
- Перехода в магазин
- Перехода к конкретному призу
Все ссылки должны работать как из QR, так и из сообщений, постов, рекламы и т.п.

3. 🖥️ Технические требования

3.1. Платформа

Telegram Mini App (веб-приложение на React / Vue / Svelte / чистом JS — на выбор команды).
Работает внутри Telegram на iOS, Android, Desktop.
Адаптивный дизайн (мобильный first).

3.2. Интеграции

Telegram Web App SDK (для получения данных пользователя, закрытия приложения, отправки данных и т.п.)
Хранение данных: Firebase / Supabase / собственный бэкенд (уточнить).
Аутентификация: через Telegram User ID (никаких логинов/паролей).

3.3. QR-сканер

Использовать библиотеку типа zxing-js/library или html5-qrcode для встроенного сканирования.
Запрос разрешения на камеру.
Обработка ошибок (камера недоступна, QR не распознан и т.п.).

3.4. Безопасность

Все действия пользователя привязаны к его Telegram User ID.
Проверка на сервере при начислении валюты (чтобы нельзя было подделать запросы).
Валидация QR-данных на стороне сервера (если QR генерируется динамически).

3.5. Производительность

Быстрая загрузка приложения (< 2 сек).
Минимизация размера бандла.
Кэширование статики.
Lazy loading для изображений и неосновных экранов.

4. 🎨 UI/UX требования

Чистый, современный дизайн, адаптированный под Telegram.
Минимум анимаций, но с приятными микро-интеракциями.
Интуитивная навигация (вкладки: Викторины, Магазин, Профиль, Сканер).
Уведомления о начислениях и действиях (всплывающие тосты).
Темная/светлая тема — по системным настройкам пользователя.

5. 📊 Административная часть (опционально, но желательно)

Панель администратора (отдельная или встроенная) для:
- Создания/редактирования викторин
- Настройки наград
- Генерации QR-кодов с наградами/викторинами
- Просмотра статистики (пользователи, активность, сканирования, покупки)
- Управления товарами в магазине

6. 📅 Этапы разработки (ориентировочно)

Этап	Описание	Срок
1. Прототип и дизайн	Создание wireframe, дизайн-макетов, согласование	3–5 дней
2. Ядро приложения	Настройка Telegram Mini App, авторизация, навигация	3 дня
3. Викторины	Создание, прохождение, начисление валюты	5 дней
4. QR-сканирование	Встроенное + обработка deep links	4 дня
5. Магазин и валюта	Баланс, покупки, история	4 дня
6. Админка (если нужно)	CRUD для контента	5 дней
7. Тестирование и фиксы	QA, оптимизация, багфиксы	3–5 дней
8. Деплой и запуск	Публикация, настройка бота, генерация QR	2 дня

7. ✅ Ожидаемый результат

Работающее Telegram Mini App, доступное по ссылке через бота.
Возможность проходить викторины и получать валюту.
Возможность сканировать QR-коды как внутри приложения, так и через камеру телефона — с начислением валюты или открытием викторины.
Магазин с обменом валюты на призы.
Адаптивный интерфейс, быстрая работа, интуитивная навигация.
Документация по генерации QR-кодов и deep links.

8. 📌 Дополнительно (уточнить заказчику)

Название валюты?
Будут ли викторины с таймером?
Можно ли повторно проходить викторины? С каким интервалом?
Типы вопросов: только один правильный ответ, или множественный выбор?
Как пользователь получает призы из магазина? (физически, цифровой код, купон и т.п.)
Нужна ли аналитика (Google Analytics, Яндекс.Метрика)?
Нужна ли панель администратора? Если да — какие права доступа?

9. 📬 Контакты и поддержка

После сдачи — техническая поддержка на 14–30 дней.
Возможность доработок по отдельному соглашению.

✅ Готово к передаче команде разработки.

Если нужно — могу подготовить дизайн-макеты, структуру API, примеры QR-ссылок или спецификацию для бэкенда.

🧩 ДОПОЛНЕННОЕ ТЕХНИЧЕСКОЕ ЗАДАНИЕ (v2.0)

🔁 Обновления по ответам заказчика

Пункт	Ответ	Влияние на ТЗ
1. Название валюты	Звезды ✨	Все упоминания “валюты” → “Звёзды”. UI: иконка звезды, анимация при начислении.
2. Таймер в викторинах	Да, может быть	Добавить в модель викторины поле `hasTimer: boolean`, `timerPerQuestion: number (сек)`.
3. Повторное прохождение	Да, с интервалом	Добавить в модель викторины: `canRepeat: boolean`, `repeatCooldownHours: number`. Хранить дату последнего прохождения у пользователя.
4. Типы вопросов	Один или несколько ответов	Вопросы имеют поле `type: "single"
5. Получение призов	Физически + цифровые инструкции	В модели приза — поле `deliveryType: "physical"
6. Аналитика	Не нужна	Исключить GA/YM. Можно добавить внутреннюю аналитику в админку.
7. Админка	Да, с ролями: Админ → Операторы	Добавить систему ролей. Админ может управлять операторами и балансами. Оператор — только контент.

🖼️ 1. ДИЗАЙН-СТРУКТУРА (Wireframe + Навигация)

📱 Основные экраны:

1. Главная (Викторины)

Шапка: аватарка пользователя, баланс ⭐ (например: “1250 ⭐”)
Список викторин (карточки):
- Название
- Превью-картинка
- Награда (⭐)
- Таймер (если есть)
- Кнопка “Начать” / “Повторить через 3ч” / “Пройдено”
Кнопка “Сканировать QR” внизу или в шапке

2. Экран викторины (вопрос)

Прогресс: 3/10
Таймер (если включен): обратный отсчет
Текст вопроса
Варианты ответов (радио / чекбоксы)
Кнопка “Далее” (активна после выбора)
Кнопка “Назад” (если не первый вопрос)

3. Результаты викторины

“Вы набрали 8/10!”
“+250 ⭐ начислено!” (анимация звезды)
Кнопка “В магазин” / “К викторинам”

4. Магазин

Список призов (карточки):
- Название
- Изображение
- Цена в ⭐
- Кнопка “Купить” (если хватает звезд) / “Недостаточно ⭐”
При покупке — модалка с инструкцией получения приза

5. Профиль

Имя, ID, аватар
Баланс ⭐
История:
- Начисления (викторины, QR)
- Покупки
Кнопка “Сканировать QR”

6. QR-сканер (встроенный)

Fullscreen камера
Оверлей с рамкой
Кнопка “Отмена”
При успешном сканировании — модалка с результатом

7. Админка (отдельный вход / скрытый URL)

Авторизация по Telegram ID (белый список админов/операторов)
Вкладки:
- Управление викторинами (CRUD)
- Управление призами (CRUD)
- Управление пользователями (поиск, ручное начисление/списание ⭐ — только для админа)
- Управление операторами (назначение/удаление — только для админа)
- Статистика (количество прохождений, сканирований, покупок)

🌐 2. СПЕЦИФИКАЦИЯ API (если используется бэкенд)

Предполагаем, что бэкенд на Node.js / Python / Go, с REST API.

🧑‍💻 Авторизация

Все запросы — с user_id из Telegram WebApp initData (проверяется на бэкенде)

🎯 Викторины

GET /quizzes — список всех активных викторин
GET /quizzes/{id} — детали викторины + вопросы
POST /quizzes/{id}/submit — отправка ответов → возвращает результат + начисленные ⭐
GET /quizzes/{id}/can-repeat — проверка, можно ли повторить (возвращает { canRepeat: true, nextAvailableAt: timestamp })

🛍️ Магазин

GET /rewards — список призов
POST /rewards/{id}/purchase — списание ⭐, создание записи о покупке
GET /user/purchases — история покупок пользователя

⭐ Баланс и транзакции

GET /user/balance — текущий баланс
GET /user/transactions — история (сортировка по дате)
POST /admin/grant-stars — (только админ) ручное начисление/списание (тело: { user_id, amount, reason })

📷 QR и Deep Links

POST /qr/validate — принимает payload (например, “reward:50” или “quiz:123”), возвращает действие + данные

👨‍💼 Админка (требуется роль)

POST /admin/quizzes — создание викторины
PUT /admin/quizzes/{id} — редактирование
DELETE /admin/quizzes/{id}
POST /admin/rewards — создание приза
POST /admin/operators — назначение оператора (тело: { telegram_id, name })
DELETE /admin/operators/{id}
GET /admin/analytics — статистика (кол-во пользователей, прохождений, сканирований, выданных ⭐ и т.п.)

🔗 3. ПРИМЕРЫ QR-ССЫЛОК И DEEP LINKS

Все ссылки ведут на одного Telegram-бота (например, @MyQuizBot).

🎁 Начисление звезд:

https://t.me/MyQuizBot?startapp=reward_50
https://t.me/MyQuizBot?startapp=reward_100

🧠 Открытие викторины:

https://t.me/MyQuizBot?startapp=quiz_123
https://t.me/MyQuizBot?startapp=quiz_456

🛒 Переход в магазин / к призу:

https://t.me/MyQuizBot?startapp=shop
https://t.me/MyQuizBot?startapp=reward_789  // ID приза

При открытии приложение парсит startapp, определяет тип и выполняет действие.

👮 4. СТРУКТУРА АДМИНКИ + РОЛИ

🧑‍💼 Роли:

Роль	Права
Администратор	Полный доступ: CRUD викторин и призов, управление операторами, ручное изменение балансов пользователей, просмотр аналитики
Оператор	Только CRUD викторин и призов. Без доступа к финансам и пользователям.

🔐 Авторизация в админке:

Только по белому списку Telegram ID (хранится в БД или .env).
При открытии админки — проверка: если user.id есть в списке админов/операторов → показать соответствующий интерфейс.

📊 Аналитика в админке (внутренняя, без GA):

Графики:
- Активные пользователи (день/неделя/месяц)
- Количество прохождений викторин
- Количество сканирований QR
- Выдано ⭐ всего / потрачено в магазине
- ТОП-3 популярных викторин / призов

🗃️ 5. СТРУКТУРА БАЗЫ ДАННЫХ (основные сущности)

👤 Пользователи (`users`)

telegram_id (PK)
username
first_name, last_name
stars_balance
created_at

📚 Викторины (`quizzes`)

id (PK)
title
description
image_url
reward_stars
has_timer: boolean
timer_per_question: int (сек)
can_repeat: boolean
repeat_cooldown_hours: int
is_active: boolean
created_by (operator_id)
created_at

❓ Вопросы (`questions`)

id
quiz_id
text
type: “single” | “multiple”
options: JSON [{id, text, is_correct}]
order_index

📊 Попытки прохождения (`quiz_attempts`)

id
user_id
quiz_id
score
stars_earned
completed_at
answers: JSON (лог выбранных вариантов)

🎁 Призы (`rewards`)

id
title
description
image_url
price_stars
delivery_type: “physical” | “digital”
instructions: text
stock: int (0 = бесконечно)
is_active
created_by
created_at

🛒 Покупки (`purchases`)

id
user_id
reward_id
stars_spent
purchased_at
status: “pending” | “delivered” | “cancelled”

📷 Сканирования QR (`qr_scans`)

id
user_id
type: “reward” | “quiz” | “shop”
value: “50”, “123”, etc.
scanned_at
source: “in_app” | “external”

👮 Админы и операторы (`admins`)

telegram_id (PK)
role: “admin” | “operator”
name
added_by (admin who added)
added_at

Ниже — детальное текстовое описание Figma-макетов для вашего Telegram Mini App, которое вы (или дизайнер) сможете легко перенести в Figma. Я опишу все экраны, компоненты, состояния, цвета, типографику и поведение — как будто вы открываете готовый Figma-файл.

🎨 FIGMA-МАКЕТЫ: Telegram Mini App “Звёздные Викторины”

📱 Формат: Mobile (375x812 — iPhone 13/14), адаптивный под Telegram Web App
🎨 Стиль: Telegram-совместимый, минималистичный, с акцентами на звёзды и геймификацию

🌈 Глобальные стили

Цвета:

Назначение	HEX	Применение
Primary (Звёзды)	`#FFD700`	Иконки валюты, кнопки, акценты
Background	`#F5F5F5` (светлая) / `#1E1E1E` (тёмная)	Автоматически по системной теме
Text Primary	`#000000` / `#FFFFFF`	Основной текст
Text Secondary	`#757575` / `#B0B0B0`	Подписи, описания
Success	`#4CAF50`	Успешные действия
Error	`#F44336`	Ошибки, недостаточно звёзд
Border / Divider	`#E0E0E0` / `#333333`	Разделители

Типографика:

Основной шрифт: SF Pro Display (iOS) / Roboto (Android) — системные
Заголовки: SemiBold 20–24px
Текст: Regular 16px
Мелкий текст: Regular 12–14px

Иконки:

Использовать Telegram UI Icons или Material Icons
Кастомные иконки: звезда ⭐, QR-сканер, таймер, магазин, профиль

📱 ЭКРАНЫ

🖼️ ЭКРАН 1: Главная — Список викторин

Статус-бар:

Telegram-стиль: имя бота + кнопка “Назад” (если не корень)

Шапка:

Аватар пользователя (слева, круглый, 32x32)
Приветствие: “Привет, [Имя]!”
Баланс: “1250 ⭐” — большая жёлтая звезда рядом, крупный шрифт 20px SemiBold

Кнопка “Сканировать QR”:

Фиксированная внизу экрана
Иконка сканера + текст “Сканировать QR”
Цвет: Primary (жёлтый), закруглённые углы

Список карточек викторин:

Каждая карточка:

Обложка (16:9, закруглённые углы)
Наложение: градиент тёмный → прозрачный снизу
Название (белый, SemiBold, поверх градиента)
Награда: “+250 ⭐” (жёлтая звезда + текст, справа внизу)
Таймер (если есть): иконка часов + “30 сек/вопрос” (серый текст)
Статус-бейдж:
- “Начать” — зелёная кнопка
- “Повторить через 3ч” — серая кнопка с иконкой часов
- “Пройдено ✅” — зелёная галочка

Поведение:

При нажатии “Начать” → переход на экран первого вопроса
При нажатии “Повторить через...” → тост: “Доступно через 3 часа”

🖼️ ЭКРАН 2: Вопрос викторины

Прогресс-бар:

Сверху: “Вопрос 3 из 10” + ProgressBar (10 сегментов, текущий — жёлтый)

Таймер (если включен):

Круговой таймер вокруг номера вопроса или отдельно сверху
Обратный отсчёт: “00:25” — крупно, жёлтым, если <10 сек — мигает красным

Текст вопроса:

Центрирован, крупный шрифт 18px SemiBold, отступы по бокам

Варианты ответов:

Кнопки-карточки (по 1 на строку)
Одиночный выбор: радиокнопка слева + текст
Множественный: чекбокс + текст
При выборе — подсветка рамки Primary-цветом
Неактивные — серые

Кнопка “Далее”:

Снизу, активна только если выбран хотя бы один ответ
При нажатии — переход к следующему вопросу / результатам

Кнопка “Назад”:

Только если вопрос не первый — в шапке слева

🖼️ ЭКРАН 3: Результаты викторины

Фон:

Градиентный (жёлтый → оранжевый) или анимированная звёздная анимация

Текст:

“🎉 Поздравляем!” — крупно, 28px
“Вы набрали 8 из 10!” — 20px SemiBold
“+250 ⭐ начислено!” — с анимацией “всплывающей звезды” (можно сделать через CSS/JS позже)

Кнопки:

“К викторинам” — Outline-стиль
“В магазин” — Solid Primary (жёлтая)

Анимация:

При открытии — звёзды “падают” сверху (визуальный эффект праздника)

🖼️ ЭКРАН 4: Магазин призов

Шапка:

“Магазин призов” + иконка 🛒

Сетка карточек (2 колонки):

Каждая карточка:

Изображение товара (1:1, закруглённые углы)
Название (SemiBold 16px)
Цена: “500 ⭐” (жёлтая звезда + крупный текст)
Статус: “В наличии” / “Закончился” (серый/красный бейдж)
Кнопка: “Купить” (активна, Primary) / “Недостаточно ⭐” (серая, неактивна)

При нажатии “Купить”:
→ Открывается модалка:

Подтверждение покупки
“Вы уверены, что хотите купить ‘Футболку бренда’ за 500 ⭐?”
Кнопки: “Отмена” / “Купить” (красная)
→ При подтверждении: списание ⭐, переход на экран инструкции

🖼️ ЭКРАН 5: Инструкция получения приза

Заголовок: “Как получить приз?”

Текст:

“Приходите в наш офис по адресу: ул. Ленина, 10 с 10:00 до 18:00 и назовите код: STAR-7B2F”
(или для цифрового: “Ваш промокод: DIGI-9X8A. Используйте его на сайте example.com”)

Кнопка: “Скопировать код” + иконка буфера обмена
Кнопка: “Назад в магазин”

🖼️ ЭКРАН 6: Профиль

Шапка:

Большой аватар (80x80)
Имя + username
“ID: 123456789”

Блок “Баланс”:

Крупно: “1250 ⭐”
Кнопка “История” справа

История (вкладка):

Вкладки: “Начисления” / “Покупки”
Список:
- “Викторина ‘Бренды’ — +250 ⭐ — 12 мая 14:30”
- “QR-сканирование — +50 ⭐ — 12 мая 10:15”
- “Покупка: Футболка — -500 ⭐ — 11 мая 16:00”

Кнопка “Сканировать QR” — внизу

🖼️ ЭКРАН 7: QR-сканер (встроенный)

Фон:

Полноэкранный поток с камеры (черный, если камера не готова)

Оверлей:

Центральная рамка (квадрат, 240x240, с анимированными углами)
Подсказка: “Наведите на QR-код”
Кнопка “Отмена” — в шапке

При сканировании:
→ Звук + вибрация → переход на модалку:

Успех!
“+50 ⭐ получено!”
(или “Открыта викторина ‘Знаешь ли ты бренд?’ — нажмите ‘Начать’”)
Кнопки: “ОК” / “Начать”

🖼️ ЭКРАН 8: Админка — Вход (скрытый)

Защищённый URL: /admin — открывается только если Telegram ID в белом списке

Экран входа:

Логотип приложения
“Добро пожаловать, [Имя]!”
“Ваша роль: Администратор / Оператор”
Кнопка “Перейти в панель”

🖼️ ЭКРАН 9: Админка — Главная

Меню (слева или вкладки сверху):

Викторины
Призы
Пользователи (только админ)
Операторы (только админ)
Аналитика

Главная статистика (дашборд):

4 карточки:
- Пользователей: 1 250
- Пройдено викторин: 3 842
- Выдано ⭐: 250 000
- Куплено призов: 1 024

Графики:

Линейный график: активность по дням (прохождения, сканирования, покупки)

🖼️ ЭКРАН 10: Админка — Создание викторины (форма)

Поля:

Название (текстовое поле)
Описание (textarea)
Обложка (загрузка изображения)
Награда (число, ⭐)
Таймер: чекбокс “Включить таймер” → поле “сек/вопрос”
Повтор: чекбокс “Разрешить повтор” → поле “часов до повтора”
Вопросы (динамический список — кнопка “+ Добавить вопрос”)

Вопрос:

Текст вопроса
Тип: селект “Один ответ” / “Несколько ответов”
Варианты: текст + чекбокс “Правильный”
Кнопка “Удалить вопрос”

Кнопка: “Сохранить викторину”

🧩 Компоненты для переиспользования (в Figma — Components)

Карточка викторины
Карточка приза
Кнопка Primary / Secondary / Disabled
Модальное окно
Строка истории транзакции
Прогресс-бар вопросов
Таймер (круговой и линейный)
Бейдж статуса (Пройдено / Недоступно / В наличии)

📲 Адаптивность

Все экраны должны масштабироваться под разные размеры экранов (от 320px до 430px шириной)
Отступы: 16px по бокам, 12–24px между элементами
Шрифты: не менее 14px для читаемости

🎁 Бонус: Анимации (опционально, для delight)

При начислении ⭐ — анимация “+50 ⭐” всплывает и исчезает
При открытии викторины — плавный переход
При сканировании QR — эффект “затухания” + звук

35 KiB Raw Blame History Unescape Escape

1. 🎯 Общее описание проекта

2. 🧩 Основные функциональные требования

2.1. 🎓 Викторины

2.2. 💰 Внутренняя валюта

2.3. 🛒 Магазин призов

2.4. 📷 QR-сканирование

2.4.1. Сканирование через приложение

2.4.2. Сканирование вне приложения (через камеру телефона)

2.5. 🔗 Глубокие ссылки (Deep Links)

3. 🖥️ Технические требования

3.1. Платформа

3.2. Интеграции

3.3. QR-сканер

3.4. Безопасность

3.5. Производительность

4. 🎨 UI/UX требования

5. 📊 Административная часть (опционально, но желательно)

6. 📅 Этапы разработки (ориентировочно)

7. ✅ Ожидаемый результат

8. 📌 Дополнительно (уточнить заказчику)

9. 📬 Контакты и поддержка

🧩 ДОПОЛНЕННОЕ ТЕХНИЧЕСКОЕ ЗАДАНИЕ (v2.0)

🔁 Обновления по ответам заказчика

🖼️ 1. ДИЗАЙН-СТРУКТУРА (Wireframe + Навигация)

📱 Основные экраны:

1. Главная (Викторины)

2. Экран викторины (вопрос)

3. Результаты викторины

4. Магазин

5. Профиль

6. QR-сканер (встроенный)

7. Админка (отдельный вход / скрытый URL)

🌐 2. СПЕЦИФИКАЦИЯ API (если используется бэкенд)

🧑‍💻 Авторизация

🎯 Викторины

🛍️ Магазин

⭐ Баланс и транзакции

📷 QR и Deep Links

👨‍💼 Админка (требуется роль)

🔗 3. ПРИМЕРЫ QR-ССЫЛОК И DEEP LINKS

🎁 Начисление звезд:

🧠 Открытие викторины:

🛒 Переход в магазин / к призу:

👮 4. СТРУКТУРА АДМИНКИ + РОЛИ

🧑‍💼 Роли:

🔐 Авторизация в админке:

📊 Аналитика в админке (внутренняя, без GA):

🗃️ 5. СТРУКТУРА БАЗЫ ДАННЫХ (основные сущности)

👤 Пользователи (users)

📚 Викторины (quizzes)

❓ Вопросы (questions)

📊 Попытки прохождения (quiz_attempts)

🎁 Призы (rewards)

🛒 Покупки (purchases)

📷 Сканирования QR (qr_scans)

👮 Админы и операторы (admins)

🎨 FIGMA-МАКЕТЫ: Telegram Mini App “Звёздные Викторины”

🌈 Глобальные стили

Цвета:

Типографика:

Иконки:

📱 ЭКРАНЫ

🖼️ ЭКРАН 1: Главная — Список викторин

🖼️ ЭКРАН 2: Вопрос викторины

🖼️ ЭКРАН 3: Результаты викторины

🖼️ ЭКРАН 4: Магазин призов

🖼️ ЭКРАН 5: Инструкция получения приза

🖼️ ЭКРАН 6: Профиль

🖼️ ЭКРАН 7: QR-сканер (встроенный)

🖼️ ЭКРАН 8: Админка — Вход (скрытый)

🖼️ ЭКРАН 9: Админка — Главная

🖼️ ЭКРАН 10: Админка — Создание викторины (форма)

🧩 Компоненты для переиспользования (в Figma — Components)

📲 Адаптивность

🎁 Бонус: Анимации (опционально, для delight)

35 KiB

Raw Blame History

👤 Пользователи (`users`)

📚 Викторины (`quizzes`)

❓ Вопросы (`questions`)

📊 Попытки прохождения (`quiz_attempts`)

🎁 Призы (`rewards`)

🛒 Покупки (`purchases`)

📷 Сканирования QR (`qr_scans`)

👮 Админы и операторы (`admins`)