ms2sato UX Design Standards
Five principles for a multi-agent management UI where one user orchestrates many parallel AI agents.
Principles
1. Sequential Flow Over Hub-and-Spoke
Process multiple items in sequence (A → done → B) instead of forcing return to a central hub between each item. Example: Review Queue (#405) — owner reviews one PR then advances to the next without returning to a queue list.
2. Parallel Awareness Without Parallel Attention
Surface state changes passively (badges, activity indicators, memos) without requiring active monitoring. Pull, not push — no popups for routine updates. Example: Session sidebar shows agent state (idle/active/asking) via color-coded indicators; agents write memos the user reads asynchronously.
3. Interruption Hierarchy
Distinguish urgency: Blockers (agent asking question, error) → prominent indicator, unmissable from any screen. Action needed (PR ready, acceptance done) → badge on next glance. Informational (task completed, CI passed) → passive, on demand. Completions are not blockers.
4. Action Proximity
Actions available where the user already is — inline over page-level, contextual creation, progressive disclosure. Example: Worktree creation from session breadcrumb (#402) — no navigation to a management page.
5. Glanceable Status, Opt-in Detail
Summaries in lists, full detail on click. Summarize semantically ("Agent completed PR #42"), not by truncation. Two-level pattern: Level 1 = summary in lists, Level 2 = detail on expand. Example: Session sidebar shows name, state icon, and memo preview without terminal output.
Applying to Acceptance Criteria
When writing criteria for user-facing features, verify each principle:
- "User can process items sequentially without returning to the list" (P1)
- "State change visible from session list without opening the session" (P2)
- "Blocker visually distinct from completion" (P3)
- "Action available inline without page navigation" (P4)
- "Status understandable from list view without expanding" (P5)
See ux-design-standards.md for full rationale, design guidelines, and codebase examples.