skills.rest
zhifengzhang-sz
zhifengzhang-szCOMMUNITY
Explore all skills by this author →
GitHub

design-shotgun

Generate multiple AI design variants from a brief into a comparison board.

Updated Feb 27, 2026
Search Tags:#design#feedback#prototype#ai-design#design-variants#comparison-board#visual-brainstorming
One-click install
npx skills add https://github.com/zhifengzhang-sz/divine-book --skill design-shotgun-zhifengzhang-sz
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-shotgun
Source: https://github.com/zhifengzhang-sz/divine-book/tree/main/.claude/skills/gstack/design-shotgun
Command: npx skills add https://github.com/zhifengzhang-sz/divine-book --skill design-shotgun-zhifengzhang-sz

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Design shotgun accelerates visual design exploration by generating multiple AI-driven design variants from a brief and letting you compare options side-by-side, reducing back-and-forth and speeding up decisions.

Core Features & Use Cases

  • Generate multiple AI design variants from a brief for UI components, landing pages, dashboards, or branding.
  • Compare variants side-by-side in a browser-based board to evaluate layout, color, typography, and overall feel.
  • Iterate with structured feedback and capture decisions for future references, ensuring a cohesive direction across teams.

Quick Start

Generate three design variants for the landing hero and open them in a side-by-side comparison board.

Frequently Asked Questions about design-shotgun

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate and compare AI design variants for a landing page?▼

To generate and compare AI design variants, provide a design brief for your landing page. The tool creates multiple visual directions and displays them side-by-side in a browser-based comparison board for evaluation.

Can I use a design brief to create multiple UI component variations at once?▼

Yes, you can create multiple UI component variations from a single design brief. The system coordinates design generation to produce diverse options for layout, color, and typography, accelerating visual brainstorming.

What is the best way to iterate on AI-generated design variants after comparing them?▼

The best way to iterate on AI-generated design variants is by applying structured feedback directly within the comparison board. This captures design decisions and ensures a cohesive direction across your team.

Does this visual brainstorming tool save design artifacts automatically?▼

Yes, the visual brainstorming tool automatically saves generated design artifacts. It organizes outputs under a project-designs directory, ensuring you can reference iterative feedback and visual directions later.

What types of design assets can I generate multiple variants for besides UI components?▼

Besides UI components, you can generate multiple AI design variants for landing pages, dashboards, and branding. This allows quick visual exploration across various digital design formats from a single brief.

Related Skills

Explore More Design & Creative Skills→
richardaumrichardaum

design-brief

Generate markdown design briefs from codebase analysis and user input.

Community
Intermediate
AlexandreLabAlexandreLab

gstack-design-shotgun

Generate multiple AI design variants and open a side-by-side comparison board.

Community
Advanced
adityasingh2400adityasingh2400
2

design-shotgun

Generate multiple AI-driven UI variants and present them on a live comparison board.

Community
Advanced
jonkikyjonkiky

design-shotgun

Generate multiple AI design variants and present them side-by-side for comparison.

Community
Advanced