Design Mockup Generation

This skill translates strategic directions into design mockups by applying a structured AI prompting framework to generate at least three distinct visual options. It outputs the generated artifacts, prompts, and comparison notes for review.

The best way to visualize multiple design directions is to generate a minimum of three distinct mockup options for each direction. This skill automatically provides carousel-ready comparison notes alongside the generated artifacts to facilitate rapid decision-making.

Yes, you can generate visual mockups for specific page sections. This skill handles design exploration tasks for hero sections, features, testimonials, and CTAs by producing distinct visual concepts for each specified element.

Generated design artifacts and prompts are organized systematically under the .agent/artifacts directory, separated by conversation ID. This structure ensures that the mockup outputs, AI prompts, and comparison documentation remain grouped and easily accessible.

No external dependencies are required to generate visual concepts with AI prompting. The skill operates independently to apply its structured prompt framework and output the resulting mockups and comparison documentation.