feat: add ui_design_specialist (Phase 3 UI Design) v0.2.0

- New specialist: ui_design_specialist with iterative mockup dialog
- New Phase 3 (UI Design) between Architecture and Implementation
- Relay model: orchestrator passes responses verbatim in Phase 3
- Cost-control exception for UI Design phase (unlimited subagent calls)
- Webspace mockup workflow with cache-buster and obscure dirs
- UX states coverage (loading, empty, error, partial)
- WCAG 2.1 AA accessibility guidelines
- Design tokens (CSS custom properties) in design system
- Component states (hover, focus, active, disabled, loading, error)
- Sitemap/wireframe before mockups for complex UIs
- Real content strategy (no Lorem Ipsum)
- Form validation UX in mockups
- Dark mode and i18n support (optional)
- Design handoff support (specialist available during implementation)
- Skip mechanism for non-UI projects
- Mockup state file for context compression recovery
- Multi-page mockup strategy with index.html
- task_graph.json mockup references
- Plugin version: 0.1.14 -> 0.2.0
- 47 files changed across 7 implementation blocks
- 3 review rounds with 41 corrections integrated
This commit is contained in:
Software Orchestrator
2026-06-19 21:33:21 +02:00
parent 2343f0e717
commit f6691b74f6
44 changed files with 995 additions and 40 deletions
@@ -23,6 +23,7 @@ Before making ANY assumption about framework versions, API changes, security vul
You are called at the following gates:
- After software-intake → Review requirements.md
- After spec-driven-planning → Review architecture.md, design.md, task_graph.json
- After UI design → Review ui_design.md, mockups, component_inventory.md, design system, UX states, accessibility (WCAG 2.1 AA), design tokens, component states, responsive design
- After each implementation block → Review code, tests
- Before deployment → Review Dockerfile, deployment config
- After release-audit → Final quality assessment, validate extracted patterns
@@ -30,6 +30,26 @@ Ensure that all project artifacts meet quality standards before phase transition
- [ ] Security considerations are addressed
- [ ] Patterns Library consulted for relevant patterns
### UI Design (after UI design phase)
- [ ] UI technology stack is documented and aligns with architecture.md
- [ ] At least one interactive HTML mockup is published and accessible (HTTP 200)
- [ ] User has reviewed and approved ALL mockups
- [ ] Component inventory exists with all major UI components and their states
- [ ] Responsive design is demonstrated (mobile + desktop)
- [ ] ui_design.md is written with design decisions, rationale, and design system
- [ ] Design system section includes: CSS custom properties (design tokens), typography, spacing, border-radius, shadows, animations, icon system
- [ ] UX states covered for all views (loading, empty, error, partial data)
- [ ] Accessibility: WCAG 2.1 AA basics (contrast ≥ 4.5:1, semantic HTML, ARIA labels, keyboard focus visible, alt text, form labels, skip link, heading hierarchy)
- [ ] Sitemap/user flow created and approved before mockups
- [ ] Real content used (no Lorem Ipsum)
- [ ] Multi-page mockups have an index.html for navigation
- [ ] Mockup URLs include cache-buster parameters
- [ ] Component states documented (hover, focus, active, disabled, loading, error)
- [ ] Form validation UX documented (inline validation, error messages, success state, required indicators)
- [ ] Consistency between architecture API endpoints and UI components consuming them
- [ ] Mockup URLs are reachable (HTTP 200)
- [ ] Design system consistency (colors as CSS variables, typography, spacing)
### Task Graph (after task breakdown)
- [ ] All tasks have clear dependencies
- [ ] No circular dependencies