# Photo-First Asset Strategy (Correction Wave)

Date: 2026-03-27  
Scope: Art direction + asset structure only (no page redesign)

## 1) Decision

Move Recipe Manager from **illustration-first** to **photo-first** for food storytelling.

- Primary storytelling media: real food photography
- Secondary/support media: restrained UI icons
- Legacy custom illustrations: fallback/decorative only

## 2) Deprecation matrix (from T03)

### Deprecate as primary visuals
- `/assets/hero/hero-kitchen-light.svg`
- `/assets/hero/hero-fresh-produce.svg`
- `/assets/food/curated/*`
- `/assets/category/illustrations/*`

These are visually clean but feel stylized/childlike relative to modern recipe products.

### Retain
- `/assets/category/icon-*.svg` (small utility icons)
- `/assets/food/placeholder-recipe*.svg` (safe local fallback)
- `/assets/empty-state/*.svg` (temporary until photo-backed empty states are added)

## 3) Page-level photo strategy

### Homepage
- Use one high-quality hero photo (landscape, 16:9 or 3:2) with warm food context.
- Optional supporting strip of 2–3 photos for social proof/variety.
- Avoid illustrated hero artwork for main CTA section.

### Recipe list/grid
- Recipe cards should show photo thumbnails (4:3 preferred).
- If recipe has no image, use deterministic placeholder fallback.
- Keep overlays minimal (chip badges + subtle gradient for text legibility).

### Recipe detail
- Hero image near top (16:9 preferred) with metadata chips.
- Support additional gallery images only if available; do not require for MVP.
- Fallback to placeholder for legacy/imported entries without images.

## 4) Asset architecture

New canonical path for photo-first pipeline:
- `frontend/public/assets/photos/manifest.json`
- `frontend/public/assets/photos/{hero,list,detail,category,empty-state,credits}/`

Manifest-first model:
- UI consumes slots by semantic keys, not hardcoded filenames.
- Each slot can specify:
  - `localPath` (vendored file in repo)
  - `remoteCandidate` (approved source candidate)
  - `license`
  - `attributionRequired`
  - `status`

## 5) Sourcing and licensing policy

Recommended source order:
1. **Pexels** (free commercial use, attribution generally not required)
2. **Unsplash** (free use under Unsplash License; attribution recommended)
3. **Owned/internal photos** (best legal clarity)

Guardrails:
- Validate license terms at download time and record snapshot metadata.
- Avoid editorial-only assets and recognizable private persons unless releases are clear.
- Keep a source record in manifest and, when required, add attribution notes in `assets/photos/credits/`.

## 6) Icon direction (explicit)

- Standardize on `lucide-react` for UI actions/navigation.
- Icon role: functional affordance only (filter, search, timer, servings, favorite).
- Style: 18–20px for controls, 24px section accents, stroke 1.75–2.0, no emoji, no decorative food doodles.

## 7) Implementation readiness

This correction wave is implementation-ready for Wave 2.5 UI workers because:
- deprecations are explicit,
- photo slots are defined via manifest,
- legal/source workflow is documented,
- fallback behavior is preserved.

Ready-for-implementation: **YES**