Wireframe Blocks
Wireframe Blocks
Two-layer structure mapping:
- Layer 1 (Executive Snapshot): Alert bar + executive cards + critical path signal
- Layer 2 (Morning Ops Brief): priorities, deadlines, overnight activity, schedule, pipeline pulse
Desktop (12-column)
Row 1
- Col 1-12: Global Alert Bar
Row 2 (cards)
- Col 1-2: Foundation
- Col 3-4: Funding
- Col 5-6: Comms
- Col 7-8: Ops Health
- Col 9-10: Pipeline Pulse
- Col 11-12: Reliability
Row 3
- Col 1-7: Today Focus Panel
- Col 8-12: Deadlines (7d/14d tabs)
Row 4
- Col 1-7: Overnight Activity Feed
- Col 8-12: Critical Path (30-day)
Row 5
- Col 1-12: Pipeline Detail Table (board/grants/pilots)
Mobile (stacked)
- Alert Bar
- Today Focus
- Deadlines
- Snapshot cards (horizontal swipe)
- Overnight Feed
- Critical Path
- Pipeline Detail
Component States
- Loading skeleton
- Empty state with guidance text
- Error state with retry + source path hint
Color Semantics
- Red = blocker/urgent
- Yellow = warning/degraded
- Green = healthy/on track
- Blue = informational