16. AI design
The AI features are built on the CLI (section 3): the editor's own AI runs Claude Code with the same skills that a user running Claude Code in a terminal gets.
The AI features are built on the CLI (section 3): the editor’s own AI runs Claude Code with the same skills that a user running Claude Code in a terminal gets. See AI-001.
| ID | Requirement | P | Type | Ver. | M |
|---|---|---|---|---|---|
| AI-1 | Claude Code shall be the primary AI backend. Non-interactive claude --print --output-format stream-json with the user’s own account; command and model are settings (ud.ai.claude.command, ud.ai.models.*). Same integration as Project Board and Software Board. |
Must | interface | test | 0.7 |
| AI-2 | The extension shall install Claude Code skills for design. “Let Claude Code Design in This Folder” writes skills under .claude/skills/ (AI-001 §3): ui-designer (the ud CLI, UDX, the design loop), ui-designer-design-system, ui-designer-from-code, ui-designer-to-code and ui-designer-review. Skills are versioned and updated on extension update with a diff prompt if edited locally. |
Must | interface | demonstration | 0.1 |
| AI-3 | The design system shall be summarised for agents. ud system prints a compact digest of the file and its libraries: variables with modes, styles, components with properties and descriptions, spacing and type scales, usage guidelines from descriptions. Skills load it first so agents use the system instead of raw values. |
Must | functional | test | 0.4 |
| AI-4 | An AI panel shall design with the user. Prompt with the selection as context, attach images (screenshots, sketches) and files; Claude works through ud on the live editor; each turn’s changes form one undo step and are highlighted; follow-up turns refine. |
Must | functional | demonstration | 0.7 |
| AI-5 | AI panel changes shall be reviewable before they are kept. Scope: the AI panel (AI-4) and quick actions (AI-10). By default a panel turn runs on a scratch branch of the document (a proposal); the panel shows a visual before/after and a change list; Accept applies as one undo step, Discard drops it. “Apply directly” is a setting. External agents (Claude Code in a terminal, other MCP clients, LM tools) write to the live document or to disk and are not covered; they can opt in with ud mcp install --proposal auto, which gives each session one proposal that is accepted or discarded in the panel. |
Must | functional | test | 0.7 |
| AI-6 | AI shall generate screens from a description. Text (and optionally a reference image or a .pb requirement) to one or more frames built from the design system’s components and variables, laid out with auto layout, named, and checked with ud lint and ud render before returning. |
Must | functional | demonstration | 0.7 |
| AI-7 | AI shall create designs from code. From a component file, route or running page, propose frames that match the implementation using the design system (with EXP-6 when a page is running). | Should | functional | demonstration | 0.7 |
| AI-8 | AI shall implement designs as code. “Implement with Claude” turns a frame or component into code in the workspace using the code map (DEV-4), project conventions (CLAUDE.md) and generated snippets; changes shown as a diff before applying. | Should | functional | demonstration | 0.7 |
| AI-9 | AI shall review designs. Consistency with the design system, accessibility, hierarchy, spacing, copy; findings as comments pinned to nodes with optional fix proposals. | Should | functional | demonstration | 0.7 |
| AI-10 | Quick AI actions shall exist. Rename layers, fill with realistic content, translate text, generate variants of a component (states, sizes), suggest auto layout, write component descriptions, generate alt text. | Should | functional | demonstration | 0.7 |
| AI-11 | AI features shall use the same MCP server as external agents. The AI panel runs Claude Code with ud mcp (CMD-7) attached, so the editor’s AI and a user’s own Claude Code session call the same Figma-named tools and the same skills. |
Must | interface | test | 0.7 |
| AI-12 | The extension shall contribute language model tools. The Figma-named tools of CMD-1 (use_figma, get_metadata, get_screenshot, get_design_context, get_variable_defs, search_design_system) registered through vscode.lm.registerTool for Copilot agent mode and other VS Code chat agents; the VS Code Language Model API (vscode.lm) is an alternative backend for the AI panel. |
Should | interface | test | 0.7 |
| AI-13 | AI shall be optional and use the user’s accounts. ud.ai.enabled turns every AI surface off; no keys of SoftForge; no design data sent to SoftForge servers. |
Must | constraint | inspection | 0.7 |
| AI-14 | AI runs shall be bounded and cancellable. Streamed progress, Cancel, time and step limits; a failed or cancelled run is rolled back as one undo step (with “Apply directly”) or its proposal is dropped (default). Tools allowed to the agent: ud and read-only workspace tools (Read, Grep, Glob); writing code only in AI-8 after review. |
Must | constraint | test | 0.7 |
| AI-15 | Models shall be routed by tier. Design (generation, from code, implement): opus. Assistant (chat, edits of the selection): sonnet. Quick (rename, content, alt text): haiku. Each a setting; aliases follow new releases. |
Should | constraint | inspection | 0.7 |