Design Artifact

Use this skill to turn a brief, flow, screenshot, or code context into a browser-openable HTML design artifact.

This is the HTML-first design control surface for standalone artifacts. It covers product prototypes, launch or narrative pages, HTML decks or storyboards, motion demos, and multi-direction explorations. It should stay focused on artifact creation rather than brand transfer or media generation.

Quick Positioning

Use this skill for:

• product surfaces, flows, and app concepts
• landing, launch, or storytelling pages that should feel like real artifacts rather than generic websites
• HTML slide decks or storyboards
• motion demos with meaningful playback or state changes
• side-by-side or toggleable exploration of a few strong design directions

Do not use this skill for: