okhp3-replit-design-pipeline

Topics in the source

• okhp3-replit-design-pipeline
• Scope
• The decision tree: start here
• Phase 1 — Extract (when component already exists)
• Phase 2 — Sandbox (when component does not yet exist)
• Phase 3 — Variant exploration
• When to use a DESIGN subagent
• Variant labelling on canvas

OverKill Hill P³ · overkillhill.com · github.com/OKHP3 Replit's design canvas exposes five interlocking skills: mockup-sandbox, mockup-extract, mockup-graduate, design-exploration, and the design (DESIGN subagent) skill. None of them explains the full loop as a decision tree. This skill does. -- | In scope | Out of scope | |---|---| | Decision tree: extract vs. build from scratch | Canvas callback schemas — read the canvas skill | | Full pipeline narration: extract → sandbox → variant → graduate | Sandbox setup and URL patterns — read mockup-sandbox | | DESIGN subagent brief anatomy | Import tracing during extraction — read mockup-extract | | Variant labelling on canvas | Production wiring — read mockup-graduate | | Graduation decision gate | Launching subagents — read the design skill | -- The golden rule: if the component exists in the codebase, extract it. Never rebuild from memory. You will get dimensions, colours, spacing, opacity values, and font sizes wrong. The real source code has the correct values. -- Read the mockup-extract skill (read .local/skills/mockup-extract/SKILL.md) for the full process. The high-level steps are: 1. Locate the target component file in the main a

This is an excerpt. Refer to the complete source and its current requirements.