design-spec

[IMPORTANT] Use TaskCreate to break ALL work into small tasks BEFORE starting — including tasks for each file read. This prevents context loss from long files. For simple tasks, AI MUST ATTENTION ask user whether to skip.

Quick Summary

Goal: Create structured UI/UX design specification documents from requirements or PBIs for developer handoff.

Workflow:

1. Read Source — Extract UI requirements from PBI, story, or Figma URL
2. Determine Complexity — Quick Spec (sections 1-4) vs Full Spec (all 7 sections)
3. Build Component Inventory — List new vs existing components
4. Define States & Tokens — Interactions, design tokens, responsive breakpoints
5. Save Artifact — Output to team-artifacts/design-specs/

Key Rules:

• If Figma URL provided → auto-routes to /figma-design for context extraction
• If wireframe image provided → auto-routes to /wireframe-to-spec for structured analysis
• If screenshot provided → uses ai-multimodal for design extraction