feat: Add /build-from-conversation command — conversational app creation via Figma generation

[PAMulligan]

Summary

Add a new /build-from-conversation command that lets users describe an app in natural language, generates a Figma design from that description, then hands off to the existing /build-from-figma pipeline to build it.

"Talk to build" — no manual Figma work required.

Motivation

The current Aurelius pipeline requires a pre-existing Figma design. This creates a chicken-and-egg problem for users who don't have a designer or don't use Figma directly. By adding a conversation layer that generates the Figma design programmatically, we open the pipeline to anyone who can describe what they want.

Proposed Flow

User runs /build-from-conversation

→ [Phase 0] Conversation Intake (NEW)

• Structured interview: purpose, pages, style, colors, framework, requirements
• Outputs: build-spec.json + design-brief.json (NEW artifact)

→ [Phase 1] Figma Design Generation (NEW)

• Takes design-brief.json
• Uses mcp__figma__generate_figma_design to create actual Figma file
• Outputs: Figma file URL + node IDs

→ [Phase 2+] Hand off to /build-from-figma

• Existing pipeline takes over from here
• figma-intake skill can skip/fast-path since build-spec.json already exists

New Files Needed

New Skill: conversation-intake

• Location: .claude/skills/conversation-intake/SKILL.md
• Conducts structured interview (max 7 questions):
  1. What does the app do and who is it for?
  2. What pages/screens are needed?
  3. What should it look like? (minimal, bold, playful, corporate, dark, etc.)
  4. Color preferences?
  5. Framework? (only if not auto-detected from local project)
  6. Special requirements? (auth, dark mode, i18n, animations)
  7. Component reuse? (only if existing components found)
• Auto-discovers local project context (same as figma-intake Step 1)
• Outputs:
  • .claude/plans/build-spec.json (same format as figma-intake, with "source": "conversation")
  • .claude/plans/design-brief.json (NEW — style direction, color prefs, typography, layout style, component descriptions)

New Skill: design-brief-to-figma

• Location: .claude/skills/design-brief-to-figma/SKILL.md
• Takes design-brief.json + build-spec.json
• Translates the design brief into Figma MCP calls:
  • Uses mcp__figma__generate_figma_design to create the design
  • Creates pages, frames, and component structure matching the build spec
  • Applies colors, typography, spacing from the design brief
• Outputs: Figma file URL that /build-from-figma can consume

New Agent: conversation-designer

• Location: .claude/agents/conversation-designer.md
• Interprets natural language design descriptions
• Makes concrete design decisions (e.g., "a clean dashboard" → specific grid layout, card components, sidebar nav)
• Generates component visual specifications
• Used by conversation-intake and design-brief-to-figma skills

New Command: /build-from-conversation

• Location: .claude/commands/build-from-conversation.md
• Master orchestrator that:
  1. Runs conversation-intake skill
  2. Runs design-brief-to-figma skill
  3. Invokes /build-from-figma with the generated Figma URL
• Supports optional $ARGUMENTS for a brief initial description

New Artifact: design-brief.json

{
  "version": "1.0.0",
  "source": "conversation",
  "createdAt": "ISO-8601",
  "styleDirection": "minimal|bold|playful|corporate|dark|custom",
  "colorPreferences": {
    "primary": "#hex or null",
    "style": "cool-neutral|warm-neutral|vibrant|monochrome|custom",
    "userProvided": false,
    "notes": "reasoning for color choice"
  },
  "typography": {
    "style": "modern-sans|classic-serif|geometric|humanist|monospace",
    "headingStyle": "bold-clean|elegant|casual|technical",
    "notes": "reasoning"
  },
  "layoutStyle": {
    "density": "compact|comfortable|spacious",
    "maxWidth": "1280px",
    "sidebar": true,
    "notes": "reasoning"
  },
  "componentDescriptions": {
    "ComponentName": "Natural language description of appearance and behavior"
  },
  "darkMode": true,
  "animations": "none|subtle|expressive",
  "specialRequirements": []
}

Changes to Existing Files

• pipeline.config.json: Add conversation section with interview settings
• CLAUDE.md: Add /build-from-conversation to command reference, update agent/skill counts
• .claude/skills/README.md: Add new skills to catalog
• .claude/CUSTOM-AGENTS-GUIDE.md: Add conversation-designer agent
• figma-intake skill: Add fast-path — if build-spec.json already exists with "source": "conversation", skip the interview and proceed directly to token extraction

What Does NOT Change

• The entire /build-from-figma pipeline (all 9 phases)
• The /build-from-screenshot pipeline
• All existing agents, skills, scripts, hooks, templates
• The Figma MCP integration (we're adding to it, not replacing it)
• The Canva pipeline (can be removed separately if desired)
• Testing infrastructure, quality gates, parallel orchestration

Acceptance Criteria

• User can run /build-from-conversation with no prior Figma file
• Structured interview captures requirements in under 7 questions
• design-brief.json is generated with valid style direction and preferences
• A real Figma file is created via MCP from the design brief
• The generated Figma URL is passed to /build-from-figma which completes successfully
• figma-intake fast-paths when build-spec.json already exists
• The full pipeline (conversation → Figma → TDD → build → verify) works end-to-end

Labels

enhancement, pipeline