AR 15 M4
03cceea13d
- PNG логотипа извлечён из PDF (PyMuPDF + Pillow), прозрачный фон (numpy) - Инвертированный логотип: CSS filter brightness(0) invert(1) на прозрачном PNG - Исправлено название: «Клиника ухо, горло, нос им. проф. Е.Н.Оленевой» - PostgreSQL переведён на порт 5433 (5432 занят на хосте) - next.config.ts: turbopack.root для монорепо - docs/SPRINTS.md: Sprint 1 помечен ✅ ЗАВЕРШЁН Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
282 lines
16 KiB
Markdown
282 lines
16 KiB
Markdown
# План спринтов — Брендбук О!Клиника
|
||
|
||
> Недельные спринты. Каждый спринт = 1 рабочая неделя.
|
||
> Базовая дата начала: уточняется при старте разработки.
|
||
|
||
---
|
||
|
||
## Обозначения
|
||
|
||
- **FE** — задача фронтенда (Next.js)
|
||
- **BE** — задача бэкенда (NestJS + Prisma)
|
||
- **DB** — изменения схемы базы данных
|
||
- **Design** — дизайн-решения, требующие согласования
|
||
|
||
---
|
||
|
||
## Sprint 1 — Инициализация проекта + страница «Логотип» ✅ ЗАВЕРШЁН
|
||
|
||
**Цель:** Рабочее окружение, monorepo, базовая архитектура, первая живая страница брендбука — «Логотип».
|
||
|
||
### Задачи — инфраструктура
|
||
- [x] FE: Инициализация Next.js 16 (App Router, Tailwind 4, TypeScript) в `apps/web`
|
||
- [x] BE: Инициализация NestJS 11 в `apps/api`
|
||
- [x] DB: PostgreSQL 16 + Prisma 7, схема User + ExperimentalComponent
|
||
- [x] Настройка Docker Compose (порт 5433 — 5432 занят на хосте)
|
||
- [x] Настройка monorepo (pnpm workspaces)
|
||
- [x] Создание `.env.example`
|
||
- [x] Git: создание веток `develop` и `sprint/1`, подключён remote git.pirogov.ai
|
||
- [x] FE: Layout с боковой навигацией (все разделы, статус «скоро»)
|
||
- [x] FE: Fira Sans подключён через next/font/google, CSS-токены бренда в globals.css
|
||
|
||
### Задачи — страница «Логотип»
|
||
- [x] Design: PNG логотипа извлечён из PDF программно (PyMuPDF + Pillow)
|
||
- [x] FE: Прозрачная версия логотипа (удалён белый фон через numpy)
|
||
- [x] FE: Страница `/foundation/logo`
|
||
- [x] FE: Иерархия версий (Основной / Общий) с реальным изображением из PDF
|
||
- [x] FE: Цветовые варианты: светлый / инвертированный (CSS filter) / на форме
|
||
- [x] FE: Охранная зона с визуализацией отступов
|
||
- [x] FE: Таблица минимальных размеров (до 46 р. и от 48 р.)
|
||
- [x] FE: 6 правил недопустимого использования
|
||
- [x] FE: Placeholder «Скачать вектор» (кнопка неактивна)
|
||
|
||
### Фактические результаты
|
||
- Брендбук запущен локально на `http://localhost:3001`
|
||
- Название клиники исправлено: «Клиника ухо, горло, нос им. проф. Е.Н.Оленевой»
|
||
- Инвертированный логотип корректно отображается (белый на тёмном фоне)
|
||
|
||
### Технические решения Sprint 1
|
||
- PostgreSQL запущен на порту **5433** (5432 занят на хосте)
|
||
- Логотип хранится как PNG с прозрачным фоном (`public/logo/logo-transparent.png`)
|
||
- Инверсия логотипа: CSS `filter: brightness(0) invert(1)` на прозрачном PNG
|
||
- Next.js запускается на порту **3001** (3000 занят на хосте)
|
||
|
||
---
|
||
|
||
## Sprint 2 — Цвета, типографика и оффлайн элементы (Brand Foundation)
|
||
|
||
**Цель:** Секция «Фундамент бренда» — цвета, оба шрифта, а также первый оффлайн-раздел.
|
||
|
||
### Задачи — цвета
|
||
- [ ] Design: Зафиксировать HEX-эквиваленты всех цветов бренда (053M, 073M, 066M, 050M, 081M, 080M)
|
||
- [ ] FE: Создать CSS-переменные / дизайн-токены для всей цветовой палитры
|
||
- [ ] FE: Страница «Цвета» — палитра с кодами Oracal/Pantone, HEX, RGB, HSL, копирование в клик
|
||
- [ ] FE: Проверка контрастности пар цветов (WCAG AA/AAA)
|
||
- [ ] FE: Экспорт токенов в JSON (Figma-compatible)
|
||
|
||
### Задачи — типографика
|
||
- [ ] FE: Страница «Типографика» — раздел DINPro (бренд/оффлайн) + раздел Fira Sans (веб)
|
||
- [ ] FE: Шкала размеров для обоих шрифтов: h1–h6, body, caption, label, overline
|
||
- [ ] FE: Чёткое указание: где DINPro, где Fira Sans
|
||
- [ ] FE: Живые примеры текста обоими шрифтами
|
||
|
||
### Задачи — оффлайн элементы (справочный раздел)
|
||
- [ ] FE: Раздел «Оффлайн элементы» в навигации брендбука
|
||
- [ ] FE: Страница «Форма сотрудников» — фото, правила размещения логотипа, таблица размеров
|
||
- [ ] FE: Страница «Бейджи» — размеры 70×30 мм, варианты, состав текста
|
||
- [ ] FE: Страница «Внутренняя навигация» — шаблоны табличек, материалы, цвета Oracal
|
||
- [ ] FE: Страница «Брендирование транспорта» — макет трамвая, цветовая схема
|
||
- [ ] FE: Страница «Печатные материалы» — листовки, визитки, Telegram-бот
|
||
|
||
**Результат спринта:** Разделы «Цвета», «Типографика» и «Оффлайн элементы» полностью готовы.
|
||
|
||
---
|
||
|
||
## Sprint 3 — Базовые компоненты: кнопки и поля ввода
|
||
|
||
**Цель:** Все варианты кнопок и форм-контролов в брендбуке.
|
||
|
||
### Задачи
|
||
- [ ] FE: Компонент Button (все варианты: primary/secondary/ghost/danger, размеры, состояния)
|
||
- [ ] FE: Компонент Input (text, password, focus/error/disabled)
|
||
- [ ] FE: Компонент Textarea
|
||
- [ ] FE: Компонент Select
|
||
- [ ] FE: Компонент Checkbox и Radio
|
||
- [ ] FE: Компонент Toggle/Switch
|
||
- [ ] FE: Страница брендбука «Компоненты → Кнопки» с документацией
|
||
- [ ] FE: Страница брендбука «Компоненты → Форм-контролы»
|
||
- [ ] FE: Копирование HTML/CSS кода компонента в один клик
|
||
|
||
**Результат спринта:** Раздел «Базовые компоненты — кнопки и ввод» готов.
|
||
|
||
---
|
||
|
||
## Sprint 4 — Карточки (Cards)
|
||
|
||
**Цель:** Все типы карточек, используемых на сайте.
|
||
|
||
### Задачи
|
||
- [ ] FE: Карточка врача (DoctorCard) — фото, имя, специализация, кнопка записи
|
||
- [ ] FE: Карточка услуги / заболевания
|
||
- [ ] FE: Карточка новости — превью, дата, заголовок, анонс, читать далее
|
||
- [ ] FE: Карточка отзыва — автор, текст, рейтинг (звёзды), дата
|
||
- [ ] FE: Карточка цены — услуга, стоимость, описание
|
||
- [ ] FE: Бейджи, теги, алерты (inline и toast)
|
||
- [ ] FE: Страница «Компоненты → Карточки» с документацией
|
||
|
||
**Результат спринта:** Все карточки задокументированы и показаны в брендбуке.
|
||
|
||
---
|
||
|
||
## Sprint 5 — Hero-блок и CEO-текст
|
||
|
||
**Цель:** Ключевые верхние блоки страниц.
|
||
|
||
### Задачи
|
||
- [ ] FE: Hero-блок вариант 1 — фон + заголовок + CTA
|
||
- [ ] FE: Hero-блок вариант 2 — иллюстрация сбоку
|
||
- [ ] FE: Hero-блок вариант 3 — с встроенной формой записи
|
||
- [ ] FE: Блок CEO-текст — фото руководителя, цитата, подпись
|
||
- [ ] FE: Блок «Преимущества клиники» — иконки + текст
|
||
- [ ] FE: Страница «Блоки → Hero и вступление»
|
||
- [ ] Design: Согласование вариантов Hero под разные страницы
|
||
|
||
**Результат спринта:** Hero и CEO-секция полностью задокументированы.
|
||
|
||
---
|
||
|
||
## Sprint 6 — Врачи и профиль врача
|
||
|
||
**Цель:** Блоки и компоненты, связанные с врачами.
|
||
|
||
### Задачи
|
||
- [ ] FE: Блок «Наши врачи» — сетка карточек с фильтром по специализации
|
||
- [ ] FE: Блок «Врач — профиль» (полная страница): фото, биография, специализации, расписание
|
||
- [ ] FE: Компонент «Расписание / слоты записи»
|
||
- [ ] FE: Компонент навигации (header menu, breadcrumbs)
|
||
- [ ] FE: Пагинация
|
||
- [ ] FE: Страница «Блоки → Врачи»
|
||
|
||
**Результат спринта:** Все блоки о врачах готовы.
|
||
|
||
---
|
||
|
||
## Sprint 7 — Отзывы и новости
|
||
|
||
**Цель:** Контентные блоки сайта.
|
||
|
||
### Задачи
|
||
- [ ] FE: Блок отзывов — карусель
|
||
- [ ] FE: Блок отзывов — статичная сетка
|
||
- [ ] FE: Блок рейтинга (звёзды + количество отзывов)
|
||
- [ ] FE: Блок новостей — сетка превью (3 в ряд)
|
||
- [ ] FE: Блок новостей — горизонтальный список
|
||
- [ ] FE: Блок «Последние новости» для сайдбара
|
||
- [ ] FE: Блок услуг / заболеваний — иконки + список
|
||
- [ ] FE: Страница «Блоки → Отзывы и новости»
|
||
|
||
**Результат спринта:** Контентные блоки задокументированы.
|
||
|
||
---
|
||
|
||
## Sprint 8 — Формы контакта и модальные окна
|
||
|
||
**Цель:** Все формы и диалоги взаимодействия с пациентом.
|
||
|
||
### Задачи
|
||
- [ ] FE: Форма записи — короткая (имя, телефон)
|
||
- [ ] FE: Форма записи — расширенная (имя, телефон, специализация, врач, дата)
|
||
- [ ] FE: Форма записи в модальном окне
|
||
- [ ] FE: Контактная форма (имя, email, сообщение)
|
||
- [ ] FE: Блок «Контакт» — карта + адрес + часы работы
|
||
- [ ] FE: Модальное окно — информационное
|
||
- [ ] FE: Модальное окно — подтверждение
|
||
- [ ] FE: Страница «Блоки → Формы и контакты»
|
||
|
||
**Результат спринта:** Все формы и диалоги готовы.
|
||
|
||
---
|
||
|
||
## Sprint 9 — Страницы: Главная и Заболевание
|
||
|
||
**Цель:** Первые две полноразмерные страницы в брендбуке.
|
||
|
||
### Задачи
|
||
- [ ] FE: Страница «Главная» — сборка из утверждённых блоков
|
||
- [ ] FE: Страница «Заболевание» — Hero (мини), описание, врачи по теме, форма
|
||
- [ ] FE: Раздел «Страницы» в навигации брендбука
|
||
- [ ] FE: Адаптивность страниц (desktop / tablet / mobile)
|
||
- [ ] Design: Ревью и согласование страниц
|
||
|
||
**Результат спринта:** 2 страницы задокументированы в брендбуке.
|
||
|
||
---
|
||
|
||
## Sprint 10 — Страницы: Врачи, Врач, Цены
|
||
|
||
**Цель:** Три страницы с ключевым контентом.
|
||
|
||
### Задачи
|
||
- [ ] FE: Страница «Все врачи» — фильтры, сетка, пагинация
|
||
- [ ] FE: Страница «Врач (профиль)»
|
||
- [ ] FE: Страница «Цены» — фильтры, таблица, форма
|
||
- [ ] FE: Таблица цен с сортировкой
|
||
- [ ] FE: Адаптивность всех трёх страниц
|
||
- [ ] Design: Ревью страниц
|
||
|
||
**Результат спринта:** Ещё 3 страницы в брендбуке.
|
||
|
||
---
|
||
|
||
## Sprint 11 — Страница Контакты и Экспериментальная секция (MVP)
|
||
|
||
**Цель:** Последняя страница + запуск механизма экспериментов.
|
||
|
||
### Задачи
|
||
- [ ] FE: Страница «Контакты»
|
||
- [ ] BE + DB: Модели `Component`, `Page`, `Block` в Prisma
|
||
- [ ] BE: CRUD API для компонентов (`/api/components`)
|
||
- [ ] BE: CRUD API для страниц (`/api/pages`)
|
||
- [ ] FE: Секция «Эксперименты» в брендбуке
|
||
- [ ] FE: Форма создания нового экспериментального компонента
|
||
- [ ] FE: Список экспериментальных компонентов со статусами
|
||
|
||
**Результат спринта:** Все страницы готовы, эксперименты — базовый функционал.
|
||
|
||
---
|
||
|
||
## Sprint 12 — Деплой, полировка, документация
|
||
|
||
**Цель:** Финальный релиз и публикация.
|
||
|
||
### Задачи
|
||
- [ ] BE + FE: Полный smoke-тест всего брендбука
|
||
- [ ] FE: Мобильная адаптация — финальная проверка всех страниц
|
||
- [ ] FE: Accessibility-аудит (WCAG AA)
|
||
- [ ] Деплой: настройка CI/CD, публикация на сервере
|
||
- [ ] Docs: Создание `docs/deployment.md`
|
||
- [ ] Docs: Обновление README.md финальными инструкциями
|
||
- [ ] Design: Финальный ревью брендбука
|
||
|
||
**Результат спринта:** Брендбук задеплоен и доступен по URL.
|
||
|
||
---
|
||
|
||
## Сводная таблица
|
||
|
||
| Спринт | Тема | Ключевой результат |
|
||
|--------|---------------------------------------|-----------------------------------------|
|
||
| 1 | Инициализация + Логотип | Брендбук запускается, страница Логотипа готова |
|
||
| 2 | Цвета, Типографика, Оффлайн элементы | Фундамент + оффлайн раздел готовы |
|
||
| 3 | Кнопки и форм-контролы | Базовые компоненты готовы |
|
||
| 4 | Карточки | Все карточки задокументированы |
|
||
| 5 | Hero и CEO-текст | Ключевые блоки страниц готовы |
|
||
| 6 | Врачи | Блоки о врачах готовы |
|
||
| 7 | Отзывы и новости | Контентные блоки готовы |
|
||
| 8 | Формы и модальные окна | Все формы задокументированы |
|
||
| 9 | Страницы: Главная, Заболевание | 2 страницы в брендбуке |
|
||
| 10 | Страницы: Врачи, Цены | 3 страницы в брендбуке |
|
||
| 11 | Контакты + Эксперименты MVP | Все страницы + система экспериментов |
|
||
| 12 | Деплой и полировка | Брендбук живёт в продакшне |
|
||
|
||
---
|
||
|
||
## Backlog (вне основных спринтов)
|
||
|
||
- Тёмная тема
|
||
- Экспорт компонентов в Figma
|
||
- Drag-and-drop конструктор страниц
|
||
- История версий экспериментальных компонентов
|
||
- Мультиязычность (если потребуется)
|
||
- Раздел «Логотип»: активация кнопки скачивания SVG (после получения вектора)
|