- backend/.env.example: add GEMINI_API_KEY and PEXELS_API_KEY placeholders - backend/Makefile: add test-integration to PHONY targets - backend/README.md: document external API keys, import/translate commands - docs/Design.md, docs/Tech.md: reflect Iteration 1 implementation and future plans Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
129 KiB
FoodAI — Дизайн экранов (Wireframe-описания)
Навигация
Приложение использует нижнюю панель навигации (Bottom Tab Bar) с 5 вкладками:
┌─────────────────────────────────────┐
│ [Главная] [Продукты] [Меню] [Рецепты] [Профиль] │
└─────────────────────────────────────┘
Иконки вкладок: домик, корзина, календарь, книга, аватар.
Активная вкладка подсвечивается акцентным цветом. Над иконкой «Продукты» может отображаться badge с количеством продуктов с истекающим сроком.
0. Онбординг (первый запуск)
Пошаговый процесс при первом запуске. Знакомит пользователя с приложением и собирает данные для персонализации.
Шаг 1 — Приветствие (2–3 карточки, свайп)
┌─────────────────────────────────────┐
│ │
│ [Иллюстрация] │
│ │
│ Управляйте питанием │
│ с помощью камеры │
│ │
│ Сфотографируйте чек или │
│ продукты — мы распознаем │
│ их и подберём рецепты │
│ │
│ ● ○ ○ │
│ │
│ ┌───────────────────────────────┐ │
│ │ Далее │ │
│ └───────────────────────────────┘ │
│ │
│ Пропустить │
│ │
└─────────────────────────────────────┘
Шаг 2 — Параметры тела
┌─────────────────────────────────────┐
│ Расскажите о себе │
├─────────────────────────────────────┤
│ │
│ Пол │
│ [Мужской] [Женский] │
│ │
│ Возраст │
│ ┌──────────────────────────┐ │
│ │ 28 │ │
│ └──────────────────────────┘ │
│ │
│ Рост (см) │
│ ┌──────────────────────────┐ │
│ │ 178 │ │
│ └──────────────────────────┘ │
│ │
│ Вес (кг) │
│ ┌──────────────────────────┐ │
│ │ 75 │ │
│ └──────────────────────────┘ │
│ │
│ Уровень активности │
│ [Низкая] [Средняя●] [Высокая] │
│ │
│ ┌───────────────────────────────┐ │
│ │ Далее │ │
│ └───────────────────────────────┘ │
│ │
└─────────────────────────────────────┘
Шаг 3 — Цель и расчёт
┌─────────────────────────────────────┐
│ Ваша цель │
├─────────────────────────────────────┤
│ │
│ ┌───────────────────────────────┐ │
│ │ ○ Похудение │ │
│ │ Дефицит калорий │ │
│ ├───────────────────────────────┤ │
│ │ ● Поддержание веса │ │
│ │ Сбалансированное питание │ │
│ ├───────────────────────────────┤ │
│ │ ○ Набор массы │ │
│ │ Профицит калорий │ │
│ └───────────────────────────────┘ │
│ │
│ Ваша рекомендуемая норма: │
│ ┌───────────────────────────────┐ │
│ │ 2 100 ккал/день │ │
│ │ Б: 120г · Ж: 70г · У: 260г │ │
│ └───────────────────────────────┘ │
│ │
│ ┌───────────────────────────────┐ │
│ │ Далее │ │
│ └───────────────────────────────┘ │
│ │
└─────────────────────────────────────┘
Шаг 4 — Ограничения и предпочтения кухонь
┌─────────────────────────────────────┐
│ Ограничения в питании │
├─────────────────────────────────────┤
│ │
│ Есть ли аллергии или ограничения? │
│ (можно выбрать несколько) │
│ │
│ [ ] Вегетарианство │
│ [ ] Без глютена │
│ [ ] Без лактозы │
│ [✓] Без орехов │
│ [ ] Халяль │
│ [ ] Кошерное │
│ │
│ Какая кухня вам нравится? │
│ (выберите 1–3) │
│ │
│ [Русская✓] [Азиатская✓] [Европ.] │
│ [Средизем.] [Американ.] [Кавказ.] │
│ │
│ ┌───────────────────────────────┐ │
│ │ Далее │ │
│ └───────────────────────────────┘ │
│ │
└─────────────────────────────────────┘
Шаг 5 — Добавить первые продукты
┌─────────────────────────────────────┐
│ Добавьте ваши продукты │
├─────────────────────────────────────┤
│ │
│ [Иллюстрация: │
│ холодильник] │
│ │
│ Сфотографируйте содержимое │
│ холодильника или чек из магазина, │
│ и мы подберём рецепты │
│ │
│ ┌───────────────────────────────┐ │
│ │ 📷 Сфотографировать продукты │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ 🧾 Сканировать чек │ │
│ └───────────────────────────────┘ │
│ │
│ Пропустить │
│ │
└─────────────────────────────────────┘
Элементы и поведение
- Навигация: «Далее» и «Пропустить» на каждом шаге. Индикатор прогресса (точки или прогресс-бар).
- Шаг 2: все поля необязательны, но при пропуске рекомендуемая калорийность не рассчитывается (предлагается средняя 2000 ккал).
- Шаг 3: норма пересчитывается при смене цели (формула Миффлина-Сан Жеора + коэффициент активности + поправка на цель).
- Шаг 4: предпочтения кухонь влияют на будущие рекомендации, ограничения — на фильтрацию рецептов.
- Шаг 5: при выборе фото/чека — переход к экрану камеры, затем к экрану корректировки распознанных продуктов, затем — к переходному экрану «Составить меню?». При «Пропустить» — переход на главный экран.
- Повторный запуск: онбординг показывается один раз. Все данные можно изменить позже в Профиле.
1. Главный экран (Главная)
Точка входа в приложение. Сводка текущего дня, рекомендации и быстрый доступ к ключевым действиям.
┌─────────────────────────────────────┐
│ FoodAI [аватар] │
│ Привет, Алексей! │
├─────────────────────────────────────┤
│ │
│ ┌───────────────────────────────┐ │
│ │ Калории сегодня │ │
│ │ │ │
│ │ ◯◯◯◯◯◯◯◯◯ │ │
│ │ (круговой прогресс-бар) │ │
│ │ │ │
│ │ 1 240 / 2 100 ккал │ │
│ │ │ │
│ │ Б: 68/120г Ж: 45/70г У: 150/260г │
│ └───────────────────────────────┘ │
│ │
│ Быстрые действия │
│ ┌─────────┐ ┌─────────┐ ┌───────┐ │
│ │ [📷] │ │ [📷] │ │ [🔍] │ │
│ │ Скан. │ │ Распозн.│ │ Найти │ │
│ │ чека │ │ еду │ │рецепт │ │
│ └─────────┘ └─────────┘ └───────┘ │
│ │
│ Рекомендуем приготовить │
│ ┌──────────┐ ┌──────────┐ → │
│ │ [фото] │ │ [фото] │ │
│ │ Стир-фрай│ │ Омлет с │ │
│ │ с курицей│ │ овощами │ │
│ │ 350 ккал │ │ 240 ккал │ │
│ │ Курица │ │ Яйца │ │
│ │ истекает ⚠│ │ истекают⚠│ │
│ └──────────┘ └──────────┘ │
│ │
│ Сегодня в меню │
│ ┌───────────────────────────────┐ │
│ │ Завтрак 320 ккал │ │
│ │ Овсянка с ягодами [✓] │ │
│ ├───────────────────────────────┤ │
│ │ Обед 540 ккал │ │
│ │ Куриная грудка с рисом [✓] │ │
│ ├───────────────────────────────┤ │
│ │ Ужин — ккал │ │
│ │ Не запланирован │ │
│ │ [+ Подобрать блюдо] │ │
│ ├───────────────────────────────┤ │
│ │ Перекус 180 ккал │ │
│ │ Греческий йогурт [✓] │ │
│ └───────────────────────────────┘ │
│ │
│ Готовили недавно │
│ ┌────────┐ ┌────────┐ ┌────────┐ │
│ │[фото] │ │[фото] │ │[фото] │ │
│ │Карбон. │ │Цезарь │ │Борщ │ │
│ └────────┘ └────────┘ └────────┘ │
│ │
│ Скоро испортятся │
│ ┌───────────────────────────────┐ │
│ │ ⚠ Молоко — осталось 2 дня │ │
│ │ ⚠ Куриное филе — завтра │ │
│ └───────────────────────────────┘ │
│ │
├─────────────────────────────────────┤
│ [Главная] [Продукты] [Меню] [Рецепты] [Профиль] │
└─────────────────────────────────────┘
Пустое состояние главного экрана (новый пользователь)
┌─────────────────────────────────────┐
│ FoodAI [аватар] │
│ Привет! │
├─────────────────────────────────────┤
│ │
│ [Иллюстрация] │
│ │
│ Начните с добавления продуктов, │
│ чтобы мы подобрали рецепты │
│ и составили меню для вас │
│ │
│ ┌───────────────────────────────┐ │
│ │ 📷 Сфотографировать продукты │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ 🧾 Сканировать чек │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ 🔍 Посмотреть рецепты │ │
│ └───────────────────────────────┘ │
│ │
├─────────────────────────────────────┤
│ [Главная] [Продукты] [Меню] [Рецепты] [Профиль] │
└─────────────────────────────────────┘
Элементы и поведение
- Шапка: название приложения слева, аватар пользователя справа (тап — переход в профиль). Приветствие с именем пользователя.
- Карточка калорий: круговой прогресс-бар, показывающий отношение потреблённых калорий к цели. Под ним — три мини-прогресс-бара для БЖУ. Тап по карточке — переход в дневник питания. Если калории превышены — прогресс-бар красный.
- Быстрые действия: три кнопки в ряд, оформленные как квадратные карточки с иконкой и подписью. «Сканировать чек» — открывает камеру в режиме сканирования чека. «Распознать еду» — открывает камеру в режиме распознавания блюда/продуктов. «Найти рецепт» — переход в каталог рецептов.
- Рекомендуем приготовить: горизонтальная карусель из 3–5 карточек рецептов. Алгоритм приоритизации: (1) рецепты из продуктов с истекающим сроком, (2) рецепты, полностью покрываемые запасами, (3) рецепты по предпочтениям кухни пользователя. На карточке — пометка, какой продукт нужно использовать. Тап — переход в карточку рецепта. Секция не показывается, если нет продуктов в запасах.
- Сегодня в меню: список запланированных приёмов пищи. Каждый пункт — название приёма, название блюда, калорийность. Чекбокс справа — отметка «съедено» (данные добавляются в дневник). Если приём пищи не запланирован — кнопка «+ Подобрать блюдо» (открывает каталог рецептов с предустановленным фильтром по типу приёма и остатку калорий на день). Тап по блюду — переход в карточку рецепта.
- Готовили недавно: горизонтальный ряд из 3–5 последних приготовленных рецептов для быстрого повтора. Тап — переход в карточку рецепта. Секция не показывается, если нет истории.
- Скоро испортятся: предупреждения о продуктах с истекающим сроком. Показываются только при наличии таких продуктов. Тап — переход на экран «Мои продукты» с фильтром по сроку.
- Пустое состояние: для нового пользователя без продуктов и меню — мотивирующий экран с основными действиями для старта.
2. Мои продукты
Учёт всех имеющихся продуктов. Добавление через фото, чек или вручную.
┌─────────────────────────────────────┐
│ Мои продукты [+ ▾] [···] │
├─────────────────────────────────────┤
│ ┌─────────────────────────────────┐ │
│ │ 🔍 Поиск продуктов... │ │
│ └─────────────────────────────────┘ │
│ │
│ [Все] [Истекает срок] [Молочные] [Мясо] [Овощи]..│
│ │
│ Молочные продукты │
│ ┌───────────────────────────────┐ │
│ │ 🥛 Молоко 2.5% │ │
│ │ 1 л · осталось 2 дня ⚠ │ │
│ ├───────────────────────────────┤ │
│ │ 🧀 Сыр Гауда │ │
│ │ 300 г · осталось 10 дней │ │
│ ├───────────────────────────────┤ │
│ │ 🫙 Йогурт греческий │ │
│ │ 2 шт · осталось 5 дней │ │
│ └───────────────────────────────┘ │
│ │
│ Мясо и птица │
│ ┌───────────────────────────────┐ │
│ │ 🍗 Куриное филе │ │
│ │ 500 г · осталось 1 день ⚠ │ │
│ ├───────────────────────────────┤ │
│ │ 🥩 Говядина │ │
│ │ 400 г · осталось 13 дней │ │
│ └───────────────────────────────┘ │
│ │
│ Овощи и фрукты │
│ ┌───────────────────────────────┐ │
│ │ 🥕 Морковь │ │
│ │ 5 шт · без срока │ │
│ ├───────────────────────────────┤ │
│ │ 🍅 Помидоры │ │
│ │ 4 шт · осталось 4 дня │ │
│ └───────────────────────────────┘ │
│ │
│ ... │
│ │
├─────────────────────────────────────┤
│ [Главная] [Продукты] [Меню] [Рецепты] [Профиль] │
└─────────────────────────────────────┘
Выпадающее меню добавления [+ ▾]
┌───────────────────────┐
│ 📷 Сфотографировать │
│ продукты │
├───────────────────────┤
│ 🧾 Сканировать чек │
├───────────────────────┤
│ ✏️ Добавить вручную │
└───────────────────────┘
Контекстное меню экрана [···]
┌─────────────────────────────┐
│ 🔄 Очистить и перезаполнить │
├─────────────────────────────┤
│ ⚙️ Сроки хранения по │
│ умолчанию │
├─────────────────────────────┤
│ 🗑 Удалить все просроченные │
└─────────────────────────────┘
Экран редактирования продукта (тап по элементу)
┌─────────────────────────────────────┐
│ [✕] Редактирование продукта │
├─────────────────────────────────────┤
│ │
│ Название │
│ ┌───────────────────────────────┐ │
│ │ Молоко 2.5% │ │
│ └───────────────────────────────┘ │
│ │
│ Количество Единица │
│ ┌─────────────────┐ ┌─────────┐ │
│ │ 1 │ │ л ▾ │ │
│ └─────────────────┘ └─────────┘ │
│ │
│ Категория │
│ ┌───────────────────────────────┐ │
│ │ Молочные продукты ▾ │ │
│ └───────────────────────────────┘ │
│ │
│ Срок хранения (дней после покупки) │
│ ┌───────────────────────────────┐ │
│ │ 5 │ │
│ └───────────────────────────────┘ │
│ Добавлено: 13.02.2026 │
│ Годен до: 18.02.2026 (2 дня) │
│ │
│ ┌───────────────────────────────┐ │
│ │ Сохранить │ │
│ └───────────────────────────────┘ │
│ │
│ [Использовано частично] │
│ [Удалить продукт] │
│ │
└─────────────────────────────────────┘
Модальное окно «Использовано частично»
┌───────────────────────────────────┐
│ Сколько осталось? │
├───────────────────────────────────┤
│ │
│ Было: 1 л │
│ │
│ Осталось: │
│ ┌─────────────────┐ ┌───────┐ │
│ │ 0.5 │ │ л ▾ │ │
│ └─────────────────┘ └───────┘ │
│ │
│ ┌───────────────────────────┐ │
│ │ Сохранить │ │
│ └───────────────────────────┘ │
└───────────────────────────────────┘
Подтверждение «Очистить и перезаполнить»
┌───────────────────────────────────┐
│ Очистить все продукты? │
├───────────────────────────────────┤
│ │
│ Все текущие продукты будут │
│ удалены. После этого вы сможете │
│ добавить продукты заново. │
│ │
│ ┌───────────────────────────────┐ │
│ │ Очистить и сфотографировать │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ Очистить и сканировать чек │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ Просто очистить │ │
│ └───────────────────────────────┘ │
│ │
│ Отмена │
│ │
└───────────────────────────────────┘
Пустое состояние
┌─────────────────────────────────────┐
│ Мои продукты [+ ▾] │
├─────────────────────────────────────┤
│ │
│ │
│ [Иллюстрация: │
│ пустой холодильник] │
│ │
│ У вас пока нет продуктов │
│ │
│ Сфотографируйте холодильник │
│ или сканируйте чек, чтобы │
│ добавить первые продукты │
│ │
│ ┌───────────────────────────────┐ │
│ │ 📷 Сфотографировать продукты │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ 🧾 Сканировать чек │ │
│ └───────────────────────────────┘ │
│ │
├─────────────────────────────────────┤
│ [Главная] [Продукты] [Меню] [Рецепты] [Профиль] │
└─────────────────────────────────────┘
Элементы и поведение
- Шапка: заголовок «Мои продукты», кнопка «+» с выпадающим меню добавления, кнопка «···» с контекстным меню экрана.
- Строка поиска: фильтрация списка продуктов по названию.
- Горизонтальный ряд фильтров: скроллируемые chip-кнопки — «Все», «Истекает срок», категории продуктов. Chip «Истекает срок» выделен предупреждающим цветом при наличии таких продуктов.
- Список продуктов: сгруппирован по категориям с заголовками-разделителями. Каждый элемент — иконка/эмодзи категории, название, количество с единицей измерения, оставшийся срок хранения («осталось X дней»). Значок ⚠ — срок истекает в ближайшие 3 дня. Для продуктов без срока (крупы, макароны) — «без срока».
- Модель срока годности: используется «период хранения после покупки» вместо фиксированной даты. При добавлении продукта автоматически подставляется срок по умолчанию для категории (молоко — 5 дней, курица — 3 дня, и т.д.). Пользователь может скорректировать период для конкретного продукта. Дата окончания вычисляется: дата добавления + период хранения. Значения по умолчанию настраиваются в профиле.
- Свайп по элементу влево: открывает кнопки «Изменить» и «Удалить».
- Тап по элементу: открывает экран редактирования продукта с полями: название, количество, единица измерения (г/кг/мл/л/шт/пучок/упаковка), категория, период хранения. Отображается дата добавления и вычисленная дата окончания. Кнопка «Использовано частично» — открывает модальное окно для указания оставшегося количества. Кнопка «Удалить продукт» — удаляет с подтверждением.
- Очистить и перезаполнить: удаляет все продукты и сразу предлагает способ добавления заново (фото, чек или ручной ввод). Требует подтверждения. После фото/чека — стандартный флоу распознавания с корректировкой.
- Сроки хранения по умолчанию: переход к экрану настроек сроков (списком по категориям: молочные — 5 дней, мясо — 3 дня, и т.д.). Можно изменить значения.
- Удалить все просроченные: удаляет все продукты с истёкшим сроком (с подтверждением).
- Дубликаты: при добавлении продукта, который уже есть в списке, система показывает диалог: «Молоко 2.5% уже есть (1 л, осталось 2 дня). Объединить количество или добавить отдельно?»
3. Экран камеры (Сканирование чека)
Открывается при выборе «Сканировать чек».
┌─────────────────────────────────────┐
│ [✕] Сканирование чека │
├─────────────────────────────────────┤
│ │
│ │
│ ┌───────────────────┐ │
│ │ │ │
│ │ │ │
│ │ Область камеры │ │
│ │ │ │
│ │ Наведите камеру │ │
│ │ на чек │ │
│ │ │ │
│ │ │ │
│ └───────────────────┘ │
│ │
│ │
│ ┌──────────┐ │
│ │ ◉ │ │
│ │ Снять │ │
│ └──────────┘ │
│ │
│ [🖼 Из галереи] │
│ │
└─────────────────────────────────────┘
Элементы и поведение
- Шапка: кнопка закрытия «✕» слева, заголовок по центру.
- Видоискатель: занимает основную часть экрана. Рамка-подсказка для позиционирования чека.
- Кнопка съёмки: крупная круглая кнопка внизу по центру.
- Кнопка «Из галереи»: выбор уже сделанного фото из галереи телефона.
- После съёмки — экран загрузки с анимацией AI-распознавания, затем переход к экрану результатов.
- Ошибка распознавания: если фото слишком размытое или чек не читаем — сообщение «Не удалось распознать чек. Попробуйте сфотографировать ещё раз или добавьте продукты вручную» с кнопками «Переснять» и «Ввести вручную».
4. Результат распознавания чека / фото продуктов
Общий экран для результатов распознавания чека и фото продуктов. Каждый продукт можно детально скорректировать.
┌─────────────────────────────────────┐
│ [←] Распознанные продукты │
├─────────────────────────────────────┤
│ │
│ Найдено 6 продуктов │
│ │
│ ┌───────────────────────────────┐ │
│ │ [✓] Молоко 2.5% │ │
│ │ 1 [л ▾] · Молочные │ │
│ │ Хранение: 5 дн. [✎] │ │
│ ├───────────────────────────────┤ │
│ │ [✓] Куриное филе │ │
│ │ 500 [г ▾] · Мясо │ │
│ │ Хранение: 3 дн. [✎] │ │
│ ├───────────────────────────────┤ │
│ │ [✓] Помидоры │ │
│ │ 4 [шт ▾] · Овощи │ │
│ │ Хранение: 7 дн. [✎] │ │
│ ├───────────────────────────────┤ │
│ │ [✓] Рис Басмати │ │
│ │ 800 [г ▾] · Крупы │ │
│ │ Хранение: без срока [✎] │ │
│ ├───────────────────────────────┤ │
│ │ [✓] Сыр Гауда │ │
│ │ 300 [г ▾] · Молочные │ │
│ │ Хранение: 14 дн. [✎] │ │
│ ├───────────────────────────────┤ │
│ │ [?] Неизвестный товар → 49₽ │ │
│ │ Нажмите, чтобы указать │ │
│ └───────────────────────────────┘ │
│ │
│ ⚠ Молоко 2.5% уже есть в запасах │
│ (1 л, осталось 2 дня) │
│ [Объединить] [Добавить отдельно] │
│ │
│ + Добавить продукт вручную │
│ + Сделать ещё фото │
│ │
│ ┌───────────────────────────────┐ │
│ │ Добавить в мои продукты │ │
│ └───────────────────────────────┘ │
│ │
└─────────────────────────────────────┘
Инлайн-редактирование продукта (тап по [✎] или по строке)
┌───────────────────────────────────┐
│ Редактировать │
├───────────────────────────────────┤
│ │
│ Название │
│ ┌───────────────────────────────┐ │
│ │ Молоко 2.5% │ │
│ └───────────────────────────────┘ │
│ │
│ Количество Единица │
│ ┌────────────────┐ ┌───────────┐ │
│ │ 1 │ │ л ▾ │ │
│ └────────────────┘ └───────────┘ │
│ │
│ Категория │
│ ┌───────────────────────────────┐ │
│ │ Молочные продукты ▾ │ │
│ └───────────────────────────────┘ │
│ │
│ Хранение (дней после покупки) │
│ ┌───────────────────────────────┐ │
│ │ 5 │ │
│ └───────────────────────────────┘ │
│ │
│ ┌───────────────────────────────┐ │
│ │ Сохранить │ │
│ └───────────────────────────────┘ │
│ │
│ [Удалить из списка] │
│ │
└───────────────────────────────────┘
Элементы и поведение
- Шапка: кнопка «Назад», заголовок.
- Счётчик: «Найдено N продуктов» — сколько позиций распознано.
- Список продуктов: каждый элемент содержит:
- Чекбокс — для включения/исключения из добавления (по умолчанию вкл).
- Название — редактируемое поле (тап → inline edit или bottom sheet).
- Количество и единица измерения — рядом, оба редактируемые. Единица — выпадающий список (г, кг, мл, л, шт, пучок, упаковка). Система подставляет наиболее вероятную единицу по категории.
- Категория — автоматически определённая, можно сменить.
- Период хранения — автоподставлен по категории, можно скорректировать. Для крупных категорий (крупы, макароны, специи) — «без срока».
- Кнопка «✎» — открывает bottom sheet с полной формой редактирования.
- Нераспознанные товары: отмечены значком «?». Тап — открывает форму ручного ввода. Если из чека — рядом отображается цена для подсказки.
- Предупреждение о дубликатах: если распознанный продукт уже есть в запасах — жёлтое предупреждение с вариантами: «Объединить» (прибавить количество к существующему), «Добавить отдельно» (новая позиция).
- «+ Добавить продукт вручную»: добавляет пустую строку для ручного ввода.
- «+ Сделать ещё фото»: открывает камеру для дополнительного снимка (несколько полок, второй чек). Результаты добавляются в текущий список.
- CTA-кнопка «Добавить в мои продукты»: добавляет все отмеченные продукты в запасы. После подтверждения — переход к переходному экрану «Составить меню?» (а не возврат на «Мои продукты»).
5. Переходный экран «Составить меню?»
Появляется после добавления продуктов (чек/фото). Плавный переход к составлению меню.
┌─────────────────────────────────────┐
│ │
│ ✅ 6 продуктов добавлено │
│ │
│ ┌───────────────────────────────┐ │
│ │ │ │
│ │ [Иллюстрация: повар │ │
│ │ с тарелками] │ │
│ │ │ │
│ └───────────────────────────────┘ │
│ │
│ Составить меню из ваших продуктов? │
│ │
│ На какой период? │
│ [На день] [На неделю●] │
│ │
│ Какая кухня? │
│ [Любая●] [Русская] [Азиатская] │
│ [Европейская] [Средиземноморская] │
│ │
│ Сложность │
│ [Попроще●] [Средняя] [Посложнее] │
│ │
│ ┌───────────────────────────────┐ │
│ │ Составить меню │ │
│ └───────────────────────────────┘ │
│ │
│ Пропустить │
│ │
└─────────────────────────────────────┘
Элементы и поведение
- Подтверждение: сообщение об успешном добавлении продуктов.
- Период: выбор chip-кнопкой. «На день» — меню на сегодня. «На неделю» — на ближайшие 7 дней.
- Кухня: chip-кнопки с множественным выбором. «Любая» — выбрано по умолчанию. Остальные варианты отсортированы по предпочтениям из профиля.
- Сложность: три уровня. Влияет на время приготовления и количество шагов в рецептах.
- «Составить меню»: генерирует меню с учётом параметров и переходит на экран Меню с результатом (см. п.8, автогенерация).
- «Пропустить»: переход на экран «Мои продукты» (стандартное поведение).
- Экран НЕ показывается при добавлении продукта вручную — только при массовом добавлении через фото/чек.
6. Экран камеры (Распознавание еды)
Открывается при выборе «Распознать еду» — для определения блюда и калорийности по фото.
┌─────────────────────────────────────┐
│ [✕] Распознать еду │
├─────────────────────────────────────┤
│ │
│ ┌───────────────────┐ │
│ │ │ │
│ │ │ │
│ │ Область камеры │ │
│ │ │ │
│ │ Сфотографируйте │ │
│ │ блюдо или │ │
│ │ продукты │ │
│ │ │ │
│ └───────────────────┘ │
│ │
│ Режим: │
│ [ Готовое блюдо ] [ Продукты ] │
│ │
│ ┌──────────┐ │
│ │ ◉ │ │
│ │ Снять │ │
│ └──────────┘ │
│ │
│ [🖼 Из галереи] │
│ │
└─────────────────────────────────────┘
Элементы и поведение
- Аналогично экрану сканирования чека, но с переключателем режима.
- Режим «Готовое блюдо»: после съёмки приложение определяет блюдо и показывает его калорийность (переход к экрану результата распознавания блюда).
- Режим «Продукты»: после съёмки приложение определяет продукты на фото и предлагает добавить их в запасы (переход к экрану корректировки, аналогичному п.4). Поддерживает мультифото (кнопка «+ Сделать ещё фото» на экране результатов).
- Ошибка распознавания: «Не удалось определить блюдо/продукты. Попробуйте ещё раз или введите вручную» с кнопками «Переснять» и «Ввести вручную».
7. Результат распознавания блюда
Отображается после фотографирования готового блюда.
┌─────────────────────────────────────┐
│ [←] Результат │
├─────────────────────────────────────┤
│ │
│ ┌───────────────────────────────┐ │
│ │ │ │
│ │ [Фото сделанное юзером] │ │
│ │ │ │
│ └───────────────────────────────┘ │
│ │
│ Паста Карбонара │
│ ~450 г │
│ │
│ ┌───────────────────────────────┐ │
│ │ 580 ккал │ │
│ │ │ │
│ │ Б: 24 г Ж: 28 г У: 56 г │ │
│ └───────────────────────────────┘ │
│ │
│ Это верно? │
│ ┌────────────┐ ┌──────────────┐ │
│ │ Да, верно │ │ Нет, это... │ │
│ └────────────┘ └──────────────┘ │
│ │
│ Размер порции │
│ ○──────────────●───────────○ │
│ 0.5x [1x] 1.5x 2x │
│ 290 ккал 580 870 1160 │
│ │
│ Приём пищи: │
│ [Завтр.] [Обед●] [Ужин] [Перекус] │
│ │
│ ┌───────────────────────────────┐ │
│ │ Записать в дневник питания │ │
│ └───────────────────────────────┘ │
│ │
│ Похожие рецепты: │
│ ┌─────────┐ ┌─────────┐ │
│ │ [фото] │ │ [фото] │ → │
│ │ Карбон. │ │ Карбон. │ │
│ │ классич.│ │ с бекон.│ │
│ │ 520ккал │ │ 610ккал │ │
│ └─────────┘ └─────────┘ │
│ │
└─────────────────────────────────────┘
Элементы и поведение
- Фото: сделанный пользователем снимок блюда.
- Название и вес: определённое приложением название блюда и приблизительный вес порции.
- Карточка калорийности: калории и БЖУ крупным шрифтом.
- Подтверждение: «Да, верно» — подтверждает распознавание. «Нет, это...» — открывает поиск по названию блюда для ручной корректировки. После выбора — калорийность пересчитывается.
- Размер порции: слайдер от 0.5x до 2x с шагом 0.25. Калорийность и БЖУ пересчитываются при перемещении. Показывается числовое значение калорий для выбранного множителя.
- Приём пищи: chip-кнопки. Предвыбран ближайший по времени приём (до 10:00 — завтрак, 10:00–14:00 — обед, 14:00–17:00 — перекус, после 17:00 — ужин).
- CTA-кнопка «Записать в дневник питания»: добавляет блюдо в дневник выбранного дня и приёма пищи.
- Похожие рецепты: горизонтальная карусель карточек рецептов. Тап — переход в карточку рецепта. Полезно, если пользователь захочет приготовить это блюдо сам.
8. Меню (Планирование)
Календарное представление запланированных приёмов пищи.
┌─────────────────────────────────────┐
│ Меню [⚡▾] [Список пок.]│
├─────────────────────────────────────┤
│ │
│ ◁ 15 – 21 февраля 2026 ▷ │
│ │
│ Пн Вт Ср Чт Пт Сб Вс │
│ 16 17 18 19 20 21 22 │
│ ● ● ● ○ ○ ○ ○ │
│ │
│ ─── Понедельник, 16 февраля ─────── │
│ │
│ Итого: 1 840 / 2 100 ккал │
│ ████████████████████░░░░ 88% │
│ │
│ Завтрак 320 ккал │
│ ┌───────────────────────────────┐ │
│ │ [фото] Овсянка с ягодами │ │
│ │ и мёдом [···] │ │
│ └───────────────────────────────┘ │
│ │
│ Обед 640 ккал │
│ ┌───────────────────────────────┐ │
│ │ [фото] Куриная грудка │ │
│ │ с рисом и овощами │ │
│ │ [···] │ │
│ └───────────────────────────────┘ │
│ │
│ Ужин │
│ ┌───────────────────────────────┐ │
│ │ + Подобрать блюдо │ │
│ │ Осталось 880 ккал на день │ │
│ │ Рекомендуем: ужин из курицы │ │
│ │ и овощей (срок курицы ⚠) │ │
│ └───────────────────────────────┘ │
│ │
│ Перекус 300 ккал │
│ ┌───────────────────────────────┐ │
│ │ [фото] Греческий йогурт │ │
│ │ с гранолой [···] │ │
│ └───────────────────────────────┘ │
│ │
│ [+ Добавить приём пищи] │
│ │
├─────────────────────────────────────┤
│ [Главная] [Продукты] [Меню] [Рецепты] [Профиль] │
└─────────────────────────────────────┘
Кнопка автогенерации [⚡▾]
┌───────────────────────────────┐
│ ⚡ Сгенерировать меню │
├───────────────────────────────┤
│ 📋 Из шаблона │
├───────────────────────────────┤
│ 🕐 Из истории меню │
├───────────────────────────────┤
│ 💾 Сохранить как шаблон │
└───────────────────────────────┘
Экран автогенерации меню
┌─────────────────────────────────────┐
│ [←] Генерация меню │
├─────────────────────────────────────┤
│ │
│ Период │
│ [Сегодня] [Неделя●] [2 недели] │
│ │
│ Кухня (можно несколько) │
│ [Любая] [Русская✓] [Азиатская✓] │
│ [Европ.] [Средизем.] [Кавказская] │
│ │
│ Сложность │
│ [Попроще] [Средняя●] [Посложнее] │
│ │
│ Учитывать мои продукты │
│ [Вкл ●] [Выкл] │
│ │
│ Калорий в день │
│ ┌───────────────────────────────┐ │
│ │ 2 100 (рекомендуемая) │ │
│ └───────────────────────────────┘ │
│ │
│ ┌───────────────────────────────┐ │
│ │ Сгенерировать │ │
│ └───────────────────────────────┘ │
│ │
└─────────────────────────────────────┘
Контекстное меню блюда [···]
┌───────────────────────┐
│ 📖 Открыть рецепт │
├───────────────────────┤
│ 🔄 Заменить блюдо │
├───────────────────────┤
│ 📅 Перенести на др. │
│ день │
├───────────────────────┤
│ 🗑 Убрать из меню │
└───────────────────────┘
Пустое состояние
┌───────────────────────────────────┐
│ │
│ [Иллюстрация: календарь] │
│ │
│ Меню пока не составлено │
│ │
│ ┌─────────────────────────────┐ │
│ │ ⚡ Сгенерировать на неделю │ │
│ └─────────────────────────────┘ │
│ ┌─────────────────────────────┐ │
│ │ + Добавить блюда вручную │ │
│ └─────────────────────────────┘ │
│ │
└───────────────────────────────────┘
Элементы и поведение
- Шапка: заголовок «Меню», кнопка «⚡» — автогенерация и шаблоны, кнопка «Список покупок» — переход к автоматически сформированному списку.
- Навигация по неделям: стрелки влево/вправо для переключения между неделями.
- Дни недели: горизонтальный ряд с датами. Точка под датой — есть запланированные блюда. Тап по дню — прокрутка к содержимому этого дня.
- Суммарная калорийность дня: прогресс-бар с числами. Если превышена цель — красный.
- Приёмы пищи: разделены заголовками (Завтрак, Обед, Ужин, Перекус). Каждое блюдо — карточка с миниатюрой фото и названием. Кнопка «···» — контекстное меню.
- Пустые слоты: вместо пустой строки — подсказка с рекомендацией: «+ Подобрать блюдо · Осталось N ккал на день» и контекстная рекомендация (если есть продукты с истекающим сроком). Тап — переход в каталог рецептов с фильтрами: тип приёма пищи + остаток калорий + продукты с истекающим сроком.
- Long press по блюду: активирует drag-and-drop для перетаскивания между приёмами пищи и днями.
- «+ Добавить приём пищи»: добавляет дополнительный слот (второй перекус и т.д.).
- «Заменить блюдо»: открывает каталог рецептов с предустановленными фильтрами (тот же тип приёма пищи, похожая калорийность).
- Автогенерация: экран с параметрами. После генерации — отображается сгенерированное меню, каждое блюдо можно заменить или сгенерировать заново (кнопка «Перегенерировать»).
- Шаблоны: сохранение текущего меню как шаблона с названием. Загрузка шаблона — перезаписывает меню на выбранный период.
- История: список прошлых меню по неделям. Тап — подгружает меню на текущую неделю.
9. AI-рекомендации рецептов
Персонализированные рецепты, сгенерированные Gemini на основе продуктов пользователя, цели и предпочтений. Статического каталога нет — каждый запрос даёт новую подборку.
┌─────────────────────────────────────┐
│ Рецепты [🔄] │
├─────────────────────────────────────┤
│ │
│ Для вас сегодня │
│ На основе ваших продуктов │
│ │
│ ┌─────────────────────────────┐ │
│ │ [фото блюда] │ │
│ │ │ │
│ │ Куриная грудка с овощами │ │
│ │ ≈ 420 ккал · 35 мин · Лёгко│ │
│ │ Б: 48г Ж: 12г У: 18г │ │
│ │ [♡] │ │
│ └─────────────────────────────┘ │
│ │
│ ┌─────────────────────────────┐ │
│ │ [фото блюда] │ │
│ │ │ │
│ │ Рисовый суп с яйцом │ │
│ │ ≈ 310 ккал · 20 мин · Лёгко│ │
│ │ Б: 18г Ж: 8г У: 42г │ │
│ │ [♡] │ │
│ └─────────────────────────────┘ │
│ │
│ ┌─────────────────────────────┐ │
│ │ [фото блюда] │ │
│ │ │ │
│ │ Морковный суп-пюре │ │
│ │ ≈ 180 ккал · 25 мин · Лёгко│ │
│ │ Б: 4г Ж: 7г У: 26г │ │
│ │ [♡] │ │
│ └─────────────────────────────┘ │
│ │
│ ┌─────────────────────────────┐ │
│ │ + ещё 2 рецепта │ │
│ └─────────────────────────────┘ │
│ │
│ Сохранённые рецепты │
│ ┌────────┐ ┌────────┐ ┌────────┐ │
│ │[фото] │ │[фото] │ │[фото] │ │
│ │Карбон. │ │Борщ │ │Цезарь │ │
│ │♡ saved │ │♡ saved │ │♡ saved │ │
│ └────────┘ └────────┘ └────────┘ │
│ [Все сохранённые →] │
│ │
├─────────────────────────────────────┤
│ [Главная] [Продукты] [Меню] [Рецепты] [Профиль] │
└─────────────────────────────────────┘
Скелетон при загрузке (2–4 сек)
┌─────────────────────────────────────┐
│ Рецепты │
├─────────────────────────────────────┤
│ │
│ Подбираем рецепты... │
│ │
│ ┌─────────────────────────────┐ │
│ │ ░░░░░░░░░░░░░░░░░░░░░░░░░ │ │
│ │ ░░░░░░░░░░░░░░░░░░░░░░░░░ │ │
│ │ ░░░░░░░░ ░░░░░ ░░░░░░░░ │ │
│ └─────────────────────────────┘ │
│ ┌─────────────────────────────┐ │
│ │ ░░░░░░░░░░░░░░░░░░░░░░░░░ │ │
│ │ ░░░░░░░░░░░░░░░░░░░░░░░░░ │ │
│ │ ░░░░░░░░ ░░░░░ ░░░░░░░░ │ │
│ └─────────────────────────────┘ │
│ │
└─────────────────────────────────────┘
Элементы и поведение
- Кнопка [🔄] «Обновить»: принудительная перегенерация рекомендаций. Gemini + Pexels вызываются заново. Skeleton показывается на время генерации (2–4 сек).
- Карточка рецепта: фото (Pexels), название, приблизительное КБЖУ (помечено «≈»), время приготовления, сложность. Тап → карточка рецепта.
- Кнопка [♡]: сохранить рецепт. Рецепт записывается в
saved_recipes. Иконка заполняется, haptic feedback. - Секция «Сохранённые рецепты»: горизонтальный ряд последних сохранённых. Кнопка «Все сохранённые →» переходит на экран всех сохранённых. Не показывается, если нет сохранённых.
- Автоматическая генерация: при открытии вкладки (если с последней генерации прошло > 30 мин или изменились продукты).
- КБЖУ «≈»: пиктограмма «~» перед числами; тап → tooltip «Приблизительно, рассчитано AI».
10. Карточка рецепта
Детальная информация о рецепте.
┌─────────────────────────────────────┐
│ [←] [♡] [⤴] │
├─────────────────────────────────────┤
│ │
│ ┌───────────────────────────────┐ │
│ │ │ │
│ │ [Фото блюда] │ │
│ │ │ │
│ └───────────────────────────────┘ │
│ │
│ Паста Карбонара │
│ ★★★★☆ 4.6 (128 отзывов) │
│ │
│ ┌────────┐ ┌────────┐ ┌────────┐ │
│ │ 30 мин │ │Средняя │ │ Европ. │ │
│ │ Время │ │Сложн. │ │ Кухня │ │
│ └────────┘ └────────┘ └────────┘ │
│ │
│ ┌───────────────────────────────┐ │
│ │ 580 ккал на порцию │ │
│ │ Б: 24г · Ж: 28г · У: 56г │ │
│ └───────────────────────────────┘ │
│ │
│ Порций: [-] 2 [+] │
│ │
│ Ингредиенты │
│ ┌───────────────────────────────┐ │
│ │ ✅ Спагетти 200 г │ │
│ │ ✅ Бекон/панчетта 150 г │ │
│ │ ✅ Яйца 3 шт │ │
│ │ ✅ Пармезан 80 г │ │
│ │ 🔄 Пекорино 40 г │ │
│ │ → Замена: Пармезан (есть) │ │
│ │ ✅ Чёрный перец по вкусу │ │
│ └───────────────────────────────┘ │
│ Всё есть (с учётом замены) │
│ │
│ Описание │
│ Классическое итальянское блюдо │
│ из Рима. Настоящая карбонара │
│ готовится без сливок — только │
│ яйца, сыр и бекон. │
│ │
│ ┌───────────────────────────────┐ │
│ │ 🍳 Начать готовить │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ 📅 Добавить в меню │ │
│ └───────────────────────────────┘ │
│ │
│ Отзывы (128) [Написать] │
│ ┌───────────────────────────────┐ │
│ │ Мария ★★★★★ │ │
│ │ Отличный рецепт! Готовила │ │
│ │ уже 3 раза, всегда получается.│ │
│ │ 2 дня назад │ │
│ ├───────────────────────────────┤ │
│ │ Дмитрий ★★★★☆ │ │
│ │ Вкусно, но сложно с яичной │ │
│ │ смесью — первый раз свернул. │ │
│ │ 1 неделю назад │ │
│ └───────────────────────────────┘ │
│ [Показать все отзывы →] │
│ │
└─────────────────────────────────────┘
Модальное окно «Добавить в меню»
┌───────────────────────────────────┐
│ Добавить в меню │
├───────────────────────────────────┤
│ │
│ День: │
│ [Пн 16] [Вт 17] [Ср 18] ... │
│ │
│ Приём пищи: │
│ ○ Завтрак │
│ ○ Обед │
│ ● Ужин │
│ ○ Перекус │
│ │
│ ┌───────────────────────────────┐ │
│ │ Добавить │ │
│ └───────────────────────────────┘ │
└───────────────────────────────────┘
Модальное окно «Написать отзыв»
┌───────────────────────────────────┐
│ Ваш отзыв [Отправить] │
├───────────────────────────────────┤
│ │
│ Оценка: │
│ ★ ★ ★ ★ ☆ │
│ │
│ ┌───────────────────────────────┐ │
│ │ Напишите ваш отзыв... │ │
│ │ │ │
│ │ │ │
│ └───────────────────────────────┘ │
│ │
│ [📷 Добавить фото] │
│ │
└───────────────────────────────────┘
Элементы и поведение
- Шапка: кнопка «Назад», кнопка «В избранное» (♡ / ♥), кнопка «Поделиться» (⤴).
- Фото блюда: крупное фото в верхней части, может быть каруселью из нескольких фото.
- Рейтинг: звёзды, средняя оценка, количество отзывов. Тап — скролл к секции отзывов.
- Метаинформация: три chip-блока — время приготовления, сложность, тип кухни.
- Калорийность: карточка с калориями и БЖУ на одну порцию.
- Регулятор порций: «−» и «+» изменяют количество порций. Вес ингредиентов и калорийность пересчитываются пропорционально.
- Ингредиенты с заменами: список с отметками наличия: ✅ — есть в запасах, ❌ — нет в запасах, 🔄 — нет, но есть замена. Для ингредиентов с заменой — под основным продуктом строка «→ Замена: [продукт] (есть/нет)». Список возможных замен формируется системой (пекорино → пармезан, сливки → сметана и т.д.). Итог: «Всё есть», «Всё есть (с учётом замены)», «Не хватает: N продуктов» + кнопка «Добавить в список покупок».
- Описание: текстовое описание рецепта.
- CTA-кнопка «Начать готовить»: основная, акцентного цвета. Переход в режим пошаговой готовки.
- Кнопка «Добавить в меню»: открывает модальное окно выбора дня и приёма пищи.
- Отзывы: последние 2–3 отзыва. Каждый — имя, звёзды, текст, дата. Кнопка «Написать» — открывает модальное окно. «Показать все отзывы» — переход к полному списку.
11. Режим готовки
Пошаговый интерфейс для приготовления блюда с таймерами.
┌─────────────────────────────────────┐
│ [✕] Паста Карбонара Шаг 3 из 7 │
├─────────────────────────────────────┤
│ │
│ ┌───────────────────────────────┐ │
│ │ │ │
│ │ [Фото / иллюстрация │ │
│ │ текущего шага] │ │
│ │ │ │
│ └───────────────────────────────┘ │
│ │
│ Отварите спагетти │
│ │
│ Вскипятите большую кастрюлю воды, │
│ посолите. Опустите спагетти и │
│ варите согласно инструкции на │
│ упаковке (обычно 8–10 минут) │
│ до состояния аль денте. │
│ │
│ ┌───────────────────────────────┐ │
│ │ │ │
│ │ ⏱ 10:00 │ │
│ │ │ │
│ │ [ Запустить таймер ] │ │
│ │ │ │
│ └───────────────────────────────┘ │
│ │
│ │
│ │
│ ┌──────────┐ ┌─────────────┐ │
│ │ ◁ Назад │ │ Далее ▷ │ │
│ └──────────┘ └─────────────┘ │
│ │
│ ● ● ● ○ ○ ○ ○ (индикатор шагов) │
│ │
│ ┌───────────────────────────────────┐│
│ │ Активные таймеры: ││
│ │ ⏱ Бульон: 34:12 [⏸] ││
│ │ ⏱ Спагетти: 08:45 [⏸] ││
│ └───────────────────────────────────┘│
└─────────────────────────────────────┘
Состояние таймера (запущен)
┌───────────────────────────────┐
│ │
│ ⏱ 07:23 │
│ (обратный отсчёт) │
│ │
│ [ ⏸ Пауза ] [ ■ Стоп ] │
│ │
└───────────────────────────────┘
Уведомление о завершении таймера
┌─────────────────────────────────────┐
│ │
│ ┌───────────────────────────────┐ │
│ │ ✅ Спагетти готовы! │ │
│ │ │ │
│ │ Таймер «10 мин» завершён. │ │
│ │ │ │
│ │ [ Понятно ] │ │
│ └───────────────────────────────┘ │
│ │
└─────────────────────────────────────┘
Экран завершения готовки (последний шаг → «Готово!»)
┌─────────────────────────────────────┐
│ Приятного аппетита! │
├─────────────────────────────────────┤
│ │
│ [Иллюстрация] │
│ │
│ Паста Карбонара готова! │
│ 580 ккал · 2 порции │
│ │
│ ┌───────────────────────────────┐ │
│ │ 📝 Записать в дневник │ │
│ └───────────────────────────────┘ │
│ │
│ Сколько порций вы съели? │
│ [-] 1 [+] │
│ │
│ ┌───────────────────────────────┐ │
│ │ ★ Оценить рецепт │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ 📷 Поделиться фото │ │
│ └───────────────────────────────┘ │
│ │
│ [Закрыть] │
│ │
└─────────────────────────────────────┘
Элементы и поведение
- Шапка: кнопка закрытия «✕» (с подтверждением «Прервать готовку?»), название рецепта, текущий шаг из общего числа.
- Фото/иллюстрация: визуальная подсказка для текущего шага. Занимает верхнюю треть экрана.
- Заголовок шага: крупный жирный текст — краткое действие.
- Описание шага: подробная инструкция. Крупный шрифт для удобства чтения на кухне.
- Блок таймера: отображается только на шагах, где требуется ожидание. Показывает предустановленное время. Кнопка «Запустить таймер» — запускает обратный отсчёт. После запуска — кнопки «Пауза» и «Стоп». Таймер продолжает работать при переходе к другим шагам.
- Навигация между шагами: кнопки «Назад» и «Далее». Свайп влево/вправо для переключения. Точечный индикатор прогресса.
- Панель активных таймеров: фиксирована внизу экрана. Показывает все запущенные таймеры с оставшимся временем. Каждый таймер можно поставить на паузу. При завершении — push-уведомление + звуковой сигнал + модальное окно поверх текущего шага.
- Экран не гаснет: активен режим keep-screen-on.
- Экран завершения: после последнего шага кнопка «Далее» заменяется на «Готово!». По нажатию — экран завершения с действиями:
- «Записать в дневник» — добавляет блюдо в дневник. Можно выбрать количество съеденных порций.
- «Оценить рецепт» — открывает модалку отзыва.
- «Поделиться фото» — открывает камеру для фото результата, затем — системное меню «Поделиться».
- Ингредиенты автоматически списываются из запасов (если продукты были в списке «Мои продукты»).
12. Дневник питания
Учёт съеденного за день с подсчётом калорий и БЖУ.
┌─────────────────────────────────────┐
│ Дневник питания │
├─────────────────────────────────────┤
│ │
│ ◁ 15 февраля 2026 ▷ │
│ │
│ ┌───────────────────────────────┐ │
│ │ 1 420 / 2 100 │ │
│ │ ◯◯◯◯◯◯◯◯◯◯◯◯◯◯ │ │
│ │ (круговой прогресс) │ │
│ │ │ │
│ │ Б: 82/120г Ж: 51/70г У: 178/260г │
│ │ ████████░░ ███████░░ █████████░ │
│ └───────────────────────────────┘ │
│ │
│ Завтрак 320 ккал │
│ ┌───────────────────────────────┐ │
│ │ Овсянка с ягодами │ │
│ │ 1 порц. · 320 ккал │ │
│ │ Б:12 Ж:8 У:52 [···] │ │
│ └───────────────────────────────┘ │
│ │
│ Обед 640 ккал │
│ ┌───────────────────────────────┐ │
│ │ Куриная грудка с рисом │ │
│ │ 1 порц. · 640 ккал │ │
│ │ Б:45 Ж:18 У:72 [···] │ │
│ └───────────────────────────────┘ │
│ │
│ Перекус 280 ккал │
│ ┌───────────────────────────────┐ │
│ │ Йогурт греческий │ │
│ │ 1 порц. · 180 ккал │ │
│ │ Б:15 Ж:10 У:12 [···] │ │
│ ├───────────────────────────────┤ │
│ │ Банан │ │
│ │ 100 ккал │ │
│ │ Б:1 Ж:0 У:26 [···] │ │
│ └───────────────────────────────┘ │
│ │
│ Ужин │
│ ┌───────────────────────────────┐ │
│ │ + Добавить приём пищи │ │
│ └───────────────────────────────┘ │
│ │
│ Вода: 💧💧💧💧💧○○○ 5/8 стаканов │
│ │
├─────────────────────────────────────┤
│ [Главная] [Продукты] [Меню] [Рецепты] [Профиль] │
└─────────────────────────────────────┘
Модальное окно «Добавить приём пищи»
┌───────────────────────────────────┐
│ Добавить │
├───────────────────────────────────┤
│ │
│ ┌───────────────────────────────┐ │
│ │ 📷 Сфотографировать блюдо │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ 📅 Из сегодняшнего меню │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ 📖 Из каталога рецептов │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ ⭐ Из избранного │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ 🔍 Быстрый поиск продукта │ │
│ └───────────────────────────────┘ │
│ ┌───────────────────────────────┐ │
│ │ ✏️ Ввести вручную │ │
│ └───────────────────────────────┘ │
│ │
└───────────────────────────────────┘
Модальное окно «Указать порцию» (при добавлении из рецепта)
┌───────────────────────────────────┐
│ Сколько вы съели? │
├───────────────────────────────────┤
│ │
│ Паста Карбонара │
│ 1 порция = 580 ккал │
│ │
│ Количество порций: │
│ ○──────────●──────────○ │
│ 0.5 [1] 1.5 2 │
│ │
│ = 580 ккал │
│ Б: 24г · Ж: 28г · У: 56г │
│ │
│ ┌───────────────────────────────┐ │
│ │ Добавить │ │
│ └───────────────────────────────┘ │
└───────────────────────────────────┘
Элементы и поведение
- Навигация по дням: стрелки влево/вправо, тап по дате — открывает календарь.
- Карточка итогов: круговой прогресс калорий, три линейных прогресс-бара для БЖУ. Если калории превышены — красный прогресс-бар.
- Приёмы пищи: разделены по типу (Завтрак, Обед, Ужин, Перекус). Каждая запись — название блюда, количество порций, калории, БЖУ. Кнопка «···» — редактировать порцию, удалить запись (с отменой через toast). Пустой приём — кнопка «+ Добавить».
- «+ Добавить приём пищи»: открывает модальное окно с вариантами добавления:
- «Сфотографировать блюдо» — камера → распознавание → результат.
- «Из сегодняшнего меню» — список блюд из меню на сегодня.
- «Из каталога рецептов» — переход в каталог.
- «Из избранного» — список избранных рецептов.
- «Быстрый поиск продукта» — строка поиска по базе отдельных продуктов (банан, хлеб, кофе с молоком и т.д.) для быстрого добавления без рецепта.
- «Ввести вручную» — форма: название, калории, БЖУ (необязательно).
- Указание порции: при добавлении блюда из рецепта — модальное окно со слайдером от 0.5 до 3 порций. Калории и БЖУ пересчитываются.
- Трекер воды: ряд из 8 значков стаканов. Тап по пустому — отмечает выпитый стакан. Тап по заполненному — снимает отметку. Количество стаканов (норма) настраивается в профиле.
- Дневник доступен из главного экрана через тап по карточке калорий.
13. Статистика
Графики и аналитика питания за период.
┌─────────────────────────────────────┐
│ Статистика │
├─────────────────────────────────────┤
│ │
│ [Неделя] [Месяц] [3 месяца] │
│ │
│ Калории │
│ ┌───────────────────────────────┐ │
│ │ 2500 ┤ │ │
│ │ ┤ ╭─╮ │ │
│ │ 2100 ┤─ ─ ─ ┤ ├─╮─ ─ (цель) │ │
│ │ ┤ ╭─╮ │ │ │ ╭─╮ │ │
│ │ 1500 ┤╭─┤ ├─┤ │ ├─┤ ├─╮ │ │
│ │ ┤│ │ │ │ │ │ │ │ │ │ │
│ │ 0 ┤┴─┴─┴─┴─┴─┴─┴─┴─┘ │ │
│ │ Пн Вт Ср Чт Пт Сб Вс │ │
│ └───────────────────────────────┘ │
│ │
│ Среднее: 1 920 ккал/день │
│ Цель: 2 100 ккал/день │
│ │
│ БЖУ (среднее за период) │
│ ┌───────────────────────────────┐ │
│ │ │ │
│ │ ██████████████████████ │ │
│ │ Б: 28% Ж: 32% У: 40% │ │
│ │ │ │
│ │ Рекомендация: │ │
│ │ Б: 30% Ж: 25% У: 45% │ │
│ └───────────────────────────────┘ │
│ │
│ Тренды │
│ ┌───────────────────────────────┐ │
│ │ ↓ Калории: -5% к прошл. нед. │ │
│ │ ↑ Белок: +12% к прошл. нед. │ │
│ │ → Жиры: без изменений │ │
│ └───────────────────────────────┘ │
│ │
│ Самые частые блюда │
│ ┌───────────────────────────────┐ │
│ │ 1. Овсянка с ягодами — 5 раз │ │
│ │ 2. Куриная грудка — 4 раза │ │
│ │ 3. Греческий йогурт — 4 раза │ │
│ └───────────────────────────────┘ │
│ │
├─────────────────────────────────────┤
│ [Главная] [Продукты] [Меню] [Рецепты] [Профиль] │
└─────────────────────────────────────┘
Элементы и поведение
- Переключатель периода: chip-кнопки — «Неделя», «Месяц», «3 месяца».
- График калорий: столбчатая диаграмма. Пунктирная линия — цель. Столбцы выше цели выделены предупреждающим цветом. Тап по столбцу — показывает точное значение за день.
- Средние значения: числовые показатели — среднее потребление и цель.
- Диаграмма БЖУ: горизонтальный stacked bar. Показывает фактическое соотношение. Под ним — рекомендуемое соотношение для сравнения.
- Тренды: карточка с краткой аналитикой — изменения к предыдущему периоду. Стрелки вверх/вниз/вправо с цветовой кодировкой (зелёный — улучшение, красный — ухудшение, серый — без изменений).
- Самые частые блюда: рейтинг блюд за период. Тап — переход в карточку рецепта.
- Экран доступен из главного экрана через тап по прогресс-бару или из профиля.
- Пустое состояние: «Пока недостаточно данных для статистики. Записывайте приёмы пищи, и мы покажем аналитику» (показывается, если записей менее 3 дней).
14. Список покупок
Автоматически формируемый и вручную редактируемый список покупок.
┌─────────────────────────────────────┐
│ [←] Список покупок [···] │
├─────────────────────────────────────┤
│ │
│ На основе меню: 16–22 февраля │
│ │
│ Молочные продукты │
│ ┌───────────────────────────────┐ │
│ │ [ ] Пекорино 40 г │ │
│ │ [ ] Сливки 20% 200 мл │ │
│ │ [✓] Молоко 2.5% 1 л │ │
│ └───────────────────────────────┘ │
│ │
│ Мясо и рыба │
│ ┌───────────────────────────────┐ │
│ │ [ ] Лосось 400 г │ │
│ │ [ ] Бекон/панчетта 300 г │ │
│ └───────────────────────────────┘ │
│ │
│ Овощи и фрукты │
│ ┌───────────────────────────────┐ │
│ │ [ ] Авокадо 2 шт │ │
│ │ [ ] Лайм 3 шт │ │
│ │ [ ] Кинза 1 пуч. │ │
│ │ [✓] Лук репчатый 3 шт │ │
│ └───────────────────────────────┘ │
│ │
│ Добавлено вручную │
│ ┌───────────────────────────────┐ │
│ │ [ ] Хлеб │ │
│ │ [ ] Вода 5л │ │
│ └───────────────────────────────┘ │
│ │
│ [+ Добавить продукт] │
│ │
│ Итого: 12 позиций (4 куплено) │
│ │
└─────────────────────────────────────┘
Контекстное меню [···]
┌───────────────────────────────────┐
│ 🗑 Очистить купленные │
├───────────────────────────────────┤
│ 📤 Поделиться списком │
├───────────────────────────────────┤
│ 🔄 Пересчитать из меню │
└───────────────────────────────────┘
Элементы и поведение
- Шапка: кнопка «Назад», заголовок, кнопка «···» с контекстным меню.
- Подзаголовок: указание, на основе какого периода меню сформирован список.
- Группировка: продукты сгруппированы по категориям. Отдельная секция «Добавлено вручную» — для позиций, добавленных пользователем.
- Чекбоксы: тап — отмечает продукт как купленный. Купленные элементы перечёркиваются и сдвигаются вниз группы.
- Свайп влево: удалить позицию.
- Тап по элементу: редактирование (название, количество).
- «+ Добавить продукт»: ручное добавление позиции.
- Итоговая строка: общее количество позиций и сколько уже куплено.
- «Очистить купленные»: удаляет все отмеченные позиции.
- «Поделиться списком»: формирует текстовый список и открывает системное меню «Поделиться» (мессенджеры, заметки и т.д.).
- «Пересчитать из меню»: заново формирует список на основе текущего меню и запасов (с подтверждением, если есть ручные позиции).
15. Профиль
Персональные настройки, цели и параметры пользователя.
┌─────────────────────────────────────┐
│ Профиль │
├─────────────────────────────────────┤
│ │
│ ┌──────────┐ │
│ │ [Аватар] │ │
│ └──────────┘ │
│ Алексей Иванов │
│ │
│ Мои параметры │
│ ┌───────────────────────────────┐ │
│ │ Рост 178 см │ │
│ │ Вес 75 кг │ │
│ │ Возраст 28 лет │ │
│ │ Пол Мужской │ │
│ │ Активность Средняя │ │
│ └───────────────────────────────┘ │
│ │
│ Цель │
│ ┌───────────────────────────────┐ │
│ │ ● Поддержание веса │ │
│ │ ○ Похудение │ │
│ │ ○ Набор массы │ │
│ └───────────────────────────────┘ │
│ │
│ Рекомендуемая норма: 2 100 ккал │
│ Б: 120г · Ж: 70г · У: 260г │
│ │
│ Ограничения и предпочтения │
│ ┌───────────────────────────────┐ │
│ │ [ ] Вегетарианство │ │
│ │ [ ] Без глютена │ │
│ │ [ ] Без лактозы │ │
│ │ [✓] Без орехов (аллергия) │ │
│ │ [ ] Халяль │ │
│ │ [ ] Кошерное │ │
│ └───────────────────────────────┘ │
│ │
│ Любимые кухни │
│ ┌───────────────────────────────┐ │
│ │ [Русская✓] [Азиатская✓] │ │
│ │ [Европ.] [Средизем.] [Кавк.] │ │
│ └───────────────────────────────┘ │
│ │
│ ┌───────────────────────────────┐ │
│ │ 📊 Статистика │ │
│ ├───────────────────────────────┤ │
│ │ 📖 Избранные рецепты │ │
│ ├───────────────────────────────┤ │
│ │ 📝 Мои отзывы │ │
│ ├───────────────────────────────┤ │
│ │ ⏱ Сроки хранения продуктов │ │
│ ├───────────────────────────────┤ │
│ │ ⚙️ Настройки приложения │ │
│ ├───────────────────────────────┤ │
│ │ ❓ Помощь │ │
│ └───────────────────────────────┘ │
│ │
│ Версия 1.0.0 │
│ │
├─────────────────────────────────────┤
│ [Главная] [Продукты] [Меню] [Рецепты] [Профиль] │
└─────────────────────────────────────┘
Экран «Сроки хранения продуктов»
┌─────────────────────────────────────┐
│ [←] Сроки хранения по умолчанию │
├─────────────────────────────────────┤
│ │
│ Укажите, сколько дней после │
│ покупки хранятся продукты │
│ каждой категории │
│ │
│ ┌───────────────────────────────┐ │
│ │ Молочные продукты [5] дн. │ │
│ │ Мясо и птица [3] дн. │ │
│ │ Рыба и морепродукты [2] дн. │ │
│ │ Овощи и фрукты [7] дн. │ │
│ │ Хлеб и выпечка [3] дн. │ │
│ │ Яйца [14] дн. │ │
│ │ Крупы и макароны [без срока] │
│ │ Консервы [без срока] │
│ │ Специи [без срока] │
│ │ Замороженные [30] дн. │ │
│ └───────────────────────────────┘ │
│ │
│ Значения будут подставляться │
│ при добавлении новых продуктов. │
│ Для каждого продукта срок можно │
│ скорректировать индивидуально. │
│ │
└─────────────────────────────────────┘
Элементы и поведение
- Аватар и имя: фото пользователя (тап — смена фото), имя под ним.
- Мои параметры: карточка с физическими данными. Тап по любому полю — редактирование. Используются для расчёта нормы калорий.
- Цель: radio-кнопки. Смена цели пересчитывает рекомендуемую калорийность.
- Рекомендуемая норма: автоматически рассчитанные калории и БЖУ на основе параметров и цели. Формула Миффлина-Сан Жеора.
- Ограничения и предпочтения: чекбоксы. Влияют на фильтрацию рецептов — рецепты с запрещёнными ингредиентами помечаются предупреждением или скрываются.
- Любимые кухни: chip-кнопки. Влияют на порядок и приоритет рекомендаций.
- Сроки хранения продуктов: экран с настройками периодов хранения по категориям. Каждая категория — редактируемое числовое поле. Значения используются как умолчания при добавлении новых продуктов.
- Список ссылок: переходы на экраны статистики, избранных рецептов, отзывов, настроек, помощи.
- Настройки приложения (отдельный экран): уведомления (типы и время), тема (светлая/тёмная/системная), единицы измерения, норма воды (стаканов в день), язык, экспорт данных, удаление аккаунта.
Общие паттерны UI
Навигация
- Bottom Tab Bar — 5 вкладок, всегда видна (кроме режима готовки, камеры и онбординга).
- Stack navigation внутри каждой вкладки — с кнопкой «Назад» в шапке.
- Модальные окна (bottom sheets) — для фильтров, выбора, подтверждений.
Жесты
- Свайп влево по элементам списков — действия (редактировать, удалить).
- Long press — drag-and-drop в меню.
- Pull to refresh — обновление данных на списках.
Обратная связь
- Toast/snackbar — при успешных действиях (продукт добавлен, блюдо записано в дневник). Для необратимых действий (удалить запись из дневника) — toast с кнопкой «Отменить» (5 секунд).
- Скелетоны (shimmer) — при загрузке контента.
- Анимация AI-распознавания — при обработке фото. Текст: «Распознаём...» с анимированным индикатором. Среднее время — 3–5 сек.
Пустые состояния
Каждый экран со списком данных имеет пустое состояние:
- Иллюстрация — лёгкий рисунок по теме экрана.
- Текст — что здесь будет отображаться и как начать.
- CTA-кнопка — основное действие для начала работы.
Состояния ошибок
- Нет сети: баннер вверху экрана «Нет подключения к интернету». Кэшированные данные (продукты, меню, дневник) доступны оффлайн. Действия, требующие сети (распознавание фото, загрузка рецептов), показывают модалку с предложением повторить позже.
- Ошибка распознавания: «Не удалось распознать. Попробуйте ещё раз» + «Ввести вручную» как fallback.
- Ошибка сервера: «Что-то пошло не так» + «Повторить».
Цветовая система
- Акцентный цвет — для CTA-кнопок и активных элементов.
- Зелёный — в пределах нормы, продукт в наличии, ингредиент есть.
- Жёлтый/оранжевый — предупреждение (скоро истечёт срок, калории приближаются к лимиту, есть замена ингредиента).
- Красный — превышение нормы, истёкший срок, отсутствующий ингредиент без замены.
Типографика
- Заголовки — жирные, крупные.
- Тело текста — стандартный размер, с достаточным межстрочным интервалом.
- В режиме готовки — увеличенный шрифт для комфортного чтения на расстоянии.
Уведомления
- Срок годности: «Молоко 2.5% — осталось 1 день. Используйте в рецепте?» (с ссылкой на рекомендации). Утром за 1 день и за 3 дня до истечения.
- Таймер готовки: звуковой сигнал + push «Таймер завершён: [название шага]».
- Напоминание о приёме пищи: «Время обеда! В меню: Куриная грудка с рисом» (если настроено).
- Трекер воды: вечернее напоминание «Вы выпили 5 из 8 стаканов воды сегодня» (если настроено).