66 lines
6.6 KiB
Markdown
66 lines
6.6 KiB
Markdown
<!-- Original brief from the project owner (Russian), 17 Oct 2026. Later decisions that override it are listed in CLAUDE.md → "Decisions that changed the brief". -->
|
||
|
||
# Задача: интерактивная страница «Бинго «Баланс 2.0»» для команды
|
||
|
||
## Контекст
|
||
Командная wellbeing-инициатива на 8 недель (2 ноября — 21 декабря 2026), ~20–25 участников.
|
||
Люди работают в разных компаниях (часть — подрядчики), общий аккаунт или SSO у всех не гарантирован.
|
||
Ссылку закрепляем в канале Microsoft Teams. Нужна одна веб-страница без регистрации.
|
||
|
||
## Что делает страница
|
||
1. Каждый видит свою карточку 4×4 и кликает по клеткам, которые сделал на этой неделе
|
||
(повторный клик снимает отметку).
|
||
2. Когда собран целый ряд (4 клетки одного ряда) — ряд подсвечивается + конфетти.
|
||
3. Внизу общая «батарейка команды» — растёт в реальном времени (достаточно опроса сервера раз в 15–30 сек).
|
||
4. Личная карточка обнуляется каждый понедельник в 00:00 (часовой пояс — настройка, по умолчанию Europe/Moscow).
|
||
Батарейка НЕ обнуляется — копится весь сезон.
|
||
|
||
## Подсчёт батарейки
|
||
- 1 отмеченная клетка = 1 шаг. Собранный ряд = +5 бонусных шагов.
|
||
- Снятие отметки в ту же неделю вычитает шаг (и бонус, если ряд распался).
|
||
- Цель сезона: 300 шагов (настройка). Отображение: «N из 300 шагов», процент и 10 делений по 10%.
|
||
- Больше 300 — показывать «Овердрайв!» и продолжать считать.
|
||
|
||
## Анонимность (важно)
|
||
- Никаких имён, email, логинов и аналитики/трекеров.
|
||
- Личная карточка хранится в браузере (localStorage) + анонимный случайный id устройства.
|
||
- На сервер уходят только события «клетка X отмечена / снята, неделя W, анонимный id» —
|
||
чтобы сервер не дал отметить одну клетку дважды за неделю с одного устройства.
|
||
- Публично видна только общая сумма. Сменил браузер — карточка начинается заново, это допустимо.
|
||
|
||
## Опционально (если несложно)
|
||
- Раз в неделю мини-вопрос «Твоя батарейка сейчас?» ⚡ Полная / 🔋 Средне / 🪫 На нуле —
|
||
анонимные счётчики по неделям (нужно для сравнения «до/после» в финале).
|
||
- Админ-страница по секретной ссылке: шаги по неделям, популярность каждой клетки,
|
||
распределение ответов на мини-вопрос, экспорт CSV.
|
||
|
||
## Клетки (ряд = тема)
|
||
Тело: 01 Обед без экрана · 02 Разминка между созвонами · 03 Гимнастика для глаз · 04 Сон до полуночи
|
||
Фокус: 05 Фокус-блок на одну задачу · 06 3 главных дела на день · 07 Встреча превратилась в сообщение · 08 Время залогировано в тот же день
|
||
Границы: 09 Сказать «нет» или «не сейчас» · 10 Вечер без рабочих сообщений · 11 Попросить о помощи · 12 Ноутбук закрыт вовремя
|
||
Люди и радость: 13 Офлайн с друзьями или семьёй · 14 Хобби, спорт или что-то руками · 15 «Спасибо» или помощь коллеге · 16 Мем в чат Мемопятницы
|
||
|
||
## Тексты
|
||
- Надзаголовок: PROJECT: BALANCE · СЕЗОН 2 · 2 НОЯБРЯ — 21 ДЕКАБРЯ
|
||
- Заголовок: Бинго «Баланс 2.0» (цифры «2.0» — акцентным цветом)
|
||
- Три правила: 1 Делай маленькие шаги · 2 Отмечай клетки за неделю · 3 Собрал ряд — +5 в батарейку
|
||
- Подпись батарейки: «Батарейка команды» / «N из 300 шагов · заполняем вместе до 21 декабря»
|
||
|
||
## Визуальный стиль
|
||
- Фон #12233D, клетки #1B3150 с рамкой #2A4468, скругление 20px.
|
||
- Текст #F2F5FA, второстепенный #A9B8CC.
|
||
- Цвета рядов (номер клетки, иконка и название ряда): Тело #FF8A65, Фокус #7CC4FF, Границы #B9A6FF, Люди и радость #C6F432.
|
||
- Акцент (батарейка, «2.0», кружки правил): #C6F432.
|
||
- Шрифты Google Fonts: Unbounded (заголовки), Manrope (текст). Нужна кириллица.
|
||
- Слева у каждого ряда — иконка (сердце, мишень, щит, чашка, линейные) и название ряда.
|
||
- Отмеченная клетка: заливка цветом ряда, тёмный текст, галочка в кружке справа вверху.
|
||
- Должно хорошо работать на телефоне (ряды могут стать 2×2), клетки — настоящие <button> с aria-pressed.
|
||
|
||
## Хостинг (для того, кто будет деплоить)
|
||
Данные неперсональные (анонимные счётчики), но страница будет вне корпоративной инфраструктуры —
|
||
стоит один раз уточнить, ок ли это для проекта.
|
||
Варианты:
|
||
- Cloudflare Pages + Worker с KV/D1 (бесплатный тариф хватит с запасом);
|
||
- Netlify/Vercel + serverless-функция + Supabase/Upstash;
|
||
- Firebase Hosting + Firestore.
|
||
Нагрузка мизерная: десятки пользователей, сотни событий в неделю. |