product-design

To turn a screenshot into a runnable UI prototype, this Skill builds frontend-only code from source visuals. You provide confirmed context and the screenshot, and it generates a prototype validated through a design QA pass before handoff.

You can clone a website URL to create a frontend prototype by routing it through the URL cloning workflow. The Skill requires confirmed context and source visuals to accurately replicate the design into a runnable output.

A UX audit checks a prototype against source visuals to identify UX and accessibility risks. It summarizes current user friction from public evidence to ensure the design direction meets quality standards before sharing.

To generate design directions from a vague product brief, the Skill uses brief routing to confirm design goals and source material. It then produces clear visual directions and ideation outputs for prototyping.

Yes, you need source visuals like screenshots or mocks to build a prototype from an existing screen. The Skill requires these references alongside confirmed context to execute the screenshot-to-code build accurately.

The best way to run design QA before handoff is to validate the prototype against source visuals. The Skill checks for UX risks, accessibility issues, and visual discrepancies to ensure the runnable output matches the original brief.