Wireframes defining structure and hierarchy before visual design — three screens covering the full proposed flow, mirroring the Hi-Fi page composition.
Screen A — Replenishment List (Triage)
AI surfaces critical runs at top · mode tabs with counts for fast triage
A · AI BANNERB · MODE TABS
β
JD
/
A
B
Needs attention43
620
577
C
Critical
At risk
AI Match
In range
A
AI Banner above the fold — proactive summary "X products analyzed · Y need attention" with primary "Accept all" + secondary "Review flagged". First-glance triage time drops from ~2min to <10s.
B
Mode tabs with counts — "Needs attention" defaults open with the urgent count baked into the pill. Lower-priority modes ("Products", "Auto-approved") are one click away but never block triage.
C
Row urgency rail + status pill — 3px left rail signals risk pre-attentively (critical / warning / match / in-range). Pill text reinforces the same signal — color is never the only channel (WCAG).
Screen B — AI Product Review (Core Moment)
Inline AI recommendation + coverage diagnosis per row · 7-column structure
D · AI RECE · ACTION BAR
β
JD
/
D
All 4● Critical 1● At risk 1✦ AI 2
Critical
2%
● High
92%
At risk
32%
● Med
78%
In range
82%
● High
95%
E
D
AI Recommendation column + confidence — pre-filled qty with confidence pill (High/Med/Low). One-tap accept; user can override into the editable input on the right. 620-row review collapses to ~43 manual decisions.
D₂
Coverage sparkline + bar — current trend (sparkline) + percentage (bar) tells the story in one glance. Replaces text-only "X / Y units" metric that forced mental math.
E
Aggregate impact bar — running total of units, coverage lift and override count. Sarah commits with full context, not blind submit.
Screen C — Canvas Dashboard (Beta)
Toggle into a focused analytics view from the same screen — no context switch, no second tab
F · TOGGLEG · KPI CARDSH · GAUGE
β
JD
F
Dashboard
G
↑ 2.1%
↓ 3.1%
↑ 8.5%
AI-Guided
High
✓ Ordered
Override
Medium
⚠ Override
AI-Guided
High
✓ Ordered
AI-Skip
High
— Skipped
H
F
Mode toggle (Dashboard ⇄ Table) — same screen, different view. Sarah switches without losing filters or scroll. Removes the "open another tab" friction.
G
3 KPI cards with sparklines — AI Performance / Stock Coverage / Units Ordered. Trend at a glance, not buried in a separate analytics tool.
H
Health Index gauge — distribution of stock health across all SKUs (Critical / Low / Moderate / Well-Stocked). Single mental model for "how healthy is the chain right now".