Authoring Stitch Prompts

Quick Start

1. Collect context – accept natural language, specs, or referenced files describing the screen/app. 1.5. Discover design context (optional) – check for design-intent/:
   • If exists: Extract Project Type, Design System from design-intent/memory/constitution.md
   • If not found: Scan codebase for framework hints (package.json)
   • Falls back gracefully to standalone mode
   • See WORKFLOW.md for details.
2. Parse essentials – identify app type, screen focus, layout elements, and visual cues.
3. Detect split points – analyze if input contains multiple screens or distinct intents (>2). Apply smart defaults: split if >2 screens/intents, else combine. Users can request regeneration with different approach.
4. Filter aggressively – strip ALL non-UI concerns (backend, auth, APIs, caching, error handling, performance metrics, code-level specs). Focus EXCLUSIVELY on visual layout, components, colors, typography, spacing, and interaction patterns.
5. Condense – rewrite into one atomic Stitch directive using "Design/Create/Add…" phrasing.
6. Structure output – follow the Stitch prompt template (directive sentence → bullet list → 3–6 style cues → constraints). If design context was discovered, inject project-appropriate style cues. Do NOT use multi-section headings.
7. Validate – ensure UI nouns are present, word count <250, NO technical implementation terms, and format matches EXAMPLES.md structure before returning the prompt.

Use this Skill whenever users need Stitch-ready wording, prompt refinements, or style-consistent rewrites.