recipe-manager/.harness/visual-redesign-execution-b...

4.2 KiB

Recipe Manager — Visual Redesign Execution Board

Created: 2026-03-26 Owner: Main Orchestrator Status: ACTIVE

Objective

Make the Recipe Manager visually compelling (color, imagery, hierarchy, polish) while preserving existing functionality and performance.

Success Criteria (Release Gate)

  • Site has a cohesive visual identity (palette, typography, spacing, elevation)
  • Key pages use imagery/graphics effectively (home, list, detail, add/edit)
  • Accessibility AA contrast and keyboard focus states pass
  • Mobile and desktop responsive layouts pass QA
  • Lighthouse: no major regressions from current baseline

Task Backlog

T01 — Baseline Visual Audit

Priority: P0 Owner: agent-ui-audit Dependencies: none Deliverables:

  • before screenshots (desktop/mobile)
  • UX/UI audit notes with prioritized issues
  • measurable acceptance checklist Acceptance:
  • screenshots committed under docs/visual-audit/before/
  • issues categorized by severity and page

T02 — Design System & Theme Tokens

Priority: P0 Owner: agent-design-system Dependencies: T01 (can start in parallel with assumptions) Deliverables:

  • color palette tokens
  • typography scale tokens
  • spacing/radius/shadow tokens
  • component style baseline Acceptance:
  • global token file in frontend
  • docs page: "Visual Style Guide"

T03 — Visual Asset Pack

Priority: P0 Owner: agent-assets Dependencies: none Deliverables:

  • curated image set (legal/source documented)
  • icon strategy and selected icon library
  • placeholder/empty-state graphics Acceptance:
  • assets stored under frontend/public/assets/
  • asset attribution/source notes in docs

T04 — Homepage Redesign

Priority: P1 Owner: agent-core-ui Dependencies: T02, T03 Deliverables:

  • hero section with imagery + CTA
  • feature blocks with icons/graphics
  • stronger visual hierarchy and footer polish Acceptance:
  • home page updated and responsive
  • visual QA checklist for home complete

T05 — Recipe List Visual Upgrade

Priority: P1 Owner: agent-core-ui Dependencies: T02, T03 Deliverables:

  • card-based grid/list with images
  • chips/badges (time/category/difficulty)
  • improved filters/search affordance
  • empty/loading states Acceptance:
  • list page supports responsive card layout
  • no regression in filtering/search behavior

T06 — Recipe Detail Visual Upgrade

Priority: P1 Owner: agent-core-ui Dependencies: T02, T03 Deliverables:

  • hero image + metadata badges
  • ingredients/instructions styled sections
  • sticky quick-action area where appropriate Acceptance:
  • detail page visually upgraded with readability improvements
  • print/share/favorite flows still functional

T07 — Add/Edit Form UX Polish

Priority: P2 Owner: agent-core-ui Dependencies: T02 Deliverables:

  • grouped sections + better hierarchy
  • image upload preview experience
  • improved validation states Acceptance:
  • add/edit remains fully functional
  • visual consistency with theme tokens

T08 — Motion, Accessibility, Perf Pass

Priority: P1 Owner: agent-qa-polish Dependencies: T04, T05, T06, T07 Deliverables:

  • hover/focus/transition polish
  • contrast + keyboard nav checks
  • image optimization/lazy loading review Acceptance:
  • accessibility checklist complete
  • Lighthouse/perf review documented

T09 — Final QA + Before/After Pack

Priority: P1 Owner: agent-qa-polish Dependencies: T08 Deliverables:

  • before/after screenshot comparison
  • release checklist + regression notes Acceptance:
  • docs/visual-audit/after/ populated
  • final signoff section completed

Orchestration Plan

Wave 1 (parallel): T01, T02, T03 Wave 2 (parallel): T04, T05, T06 (after T02/T03) Wave 3: T07 (after T02), T08 (after wave 2 + T07) Wave 4: T09

Agent Assignment & Status

  • agent-ui-audit: T01 — QUEUED
  • agent-design-system: T02 — QUEUED
  • agent-assets: T03 — QUEUED
  • agent-core-ui: T04/T05/T06/T07 — QUEUED
  • agent-qa-polish: T08/T09 — QUEUED

Reporting Protocol

Each agent reports:

  1. task id
  2. files changed
  3. screenshots path
  4. blockers
  5. ready-for-review flag

Notes