7.6 KiB
Спринты
Документ для планирования и отслеживания работ по прототипу мобильного приложения Клиники УГН.
Как вести
- Каждый спринт — отдельный заголовок
## Спринт N · даты - Задачи — чекбоксы
- [ ] описание, ставим- [x]когда готово - По завершении спринта — короткое резюме в блоке Итоги
- Нерешённое переносится в следующий спринт
Спринт 1 · 19 апр 2026
Цель: развернуть прототип ЛОР-клиники из дизайн-бандла Claude Design и закрыть базовые пробелы.
План
- Распаковать дизайн-бандл, перенести на Vite + React (20 экранов)
- iOS / Android рамки + Tweaks-панель (экраны, устройство, компоновка, акцент, шрифт, плотность, масштаб)
- Экран результата эндоскопии: 2×2 снимков, заключение, рекомендации, PDF, полноэкранный просмотр
- Статьи: список с фильтрами по тегам + детальная страница (hero, body-блоки, автор, связанные)
- Главная 2: универсальный поиск, тайлы, статистика клиники
- Поиск: врачи / услуги / симптомы / статьи / приёмы с реальной фильтрацией
- Контакты: телефон, два адреса с мокапами зданий и мини-карт
- Цены: поиск + пиллы-категории, группировка, диапазон
- Развернуть на публичный URL (surge / netlify) и отправить коллегам
- Собрать первичный фидбек по прототипу
Итоги
заполнить в конце спринта
Спринт 2 · 19 апр 2026
Цель: превратить одиночный чат в центр всех коммуникаций с клиникой — AI-помощник, врач, администратор.
Итоги. Закрыт. Чат стал списком из трёх диалогов (AI-помощник, врач, администратор), каждая карточка ведёт в отдельную конверсацию с разными UI-акцентами. Таббар автоматически скрывается в подэкранах chat:<id>.
План
- Экран
chat— список диалогов: AI-помощник (featured), врач, администратор - Данные: три чата в
data.js(kind, участники, сообщения, online, непрочитанные, время последнего сообщения) - AI-помощник: расширенный диалог с напоминаниями о лекарствах, чипсы с подсказками ответов
- Чат с регистратурой: запросы справок, переносы приёмов, счета
- Экран
chat:<id>— конверсация: разный аватар/статус/UI-акценты для AI, врача, оператора - Видеозвонок-кнопка только у врача; suggested replies только у AI
- Переадресация: сурджен в «Восстановлении» →
chat:doctor-syndaev - Tweaks: добавить три варианта чата в список экранов
Задел на Спринт 3
- Экран онбординга (первый запуск)
- Пустые состояния для всех вкладок
- Анимации переходов между экранами
- Реальные аватары врачей и иконки
- Сравнение результатов эндоскопии с предыдущим
- Раздел «Программа лояльности» (бонусы, уровни)
- Детальная карточка услуги (с описанием и подготовкой)
- Форма обратной связи / отзыв о враче
- Тёмная тема
Итоги
заполнить в конце спринта
Спринт 3 · 20 апр 2026
Цель: применить новую палитру из дизайн-системы (скрин от 20.04) и добавить её как 4-й вариант в Tweaks.
Входные цвета: #ffffff #fffde4 #f2fee6 #d4f6f8 #e9e4d4 #ffa39c #63bac3 #29aee3 #93908f — sky-blue primary + coral accent + warm pastels.
План
- Расширить схему
ACCENT_OPTIONS: добавитьaccent,accentDark,accent50(чтобы палитра меняла и красный акцент, а не только primary + warm) - Обновить
applyTheme— устанавливать--c-accent,--c-accent-dark,--c-accent-50из палитры - Проставить accent-поля в существующих палитрах (тил/терра/марин) → сохранить текущий красный
#E04E44 - Добавить 4-ю палитру Лагуна: primary
#29AEE3, accent#FFA39C, warm#E9E4D4 - Пристроить три оставшихся цвета из скрина:
#f2fee6→success-50,#93908f→fg-4,#63bac3→primary-300(с видимым применением в бордере Clinic Stats card на Home V2) - Добавить 5-ю палитру Бриз — вариант Лагуны с приглушённым primary
#63BAC3(яркий#29AEE3переехал в p300, warm/accent/success/fg-4 наследуются от Лагуны) - Визуальная проверка всех экранов в новой палитре: кнопки, чипы, CTA, прогресс восстановления, успех-галочка, таббар-бейджи
Спринт 4 · 20 апр 2026
Цель: служебные экраны для разработчиков — визуализация дизайн-системы прямо в прототипе, чтобы переключая палитру сразу видеть все цвета и их применение.
План
- Пробросить текущую палитру через
ctx.palette(чтобы dev-экраны могли прочитать все поля) - Экран DEV · Палитра: таблица всех цветов (primary / warm / accent / status / neutrals / text), у каждой строки — свотч, название роли, CSS-переменная, hex-код, краткое описание применения
- Экран DEV · Примеры: реальные компоненты (кнопки, чипы, карточки, текстовая иерархия, статусы) с подписями «какая CSS-переменная используется»
- Добавить оба экрана в SCREEN_OPTIONS Tweaks
- Динамический рендер: при переключении палитры значения hex обновляются автоматически
Итоги
заполнить в конце спринта