skills.rest
GenEducation
GenEducationOFFICIAL
Explore all skills by this author →
GitHub

design-shotgun

Generate multiple UI design variants and compare them side by side.

Updated Mar 30, 2026
Search Tags:#design#ui#feedback#brainstorming#iteration#variants
One-click install
npx skills add https://github.com/GenEducation/GenedUIProject --skill design-shotgun-geneducation
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-shotgun
Source: https://github.com/GenEducation/GenedUIProject/tree/main/.gemini/skills/design-shotgun
Command: npx skills add https://github.com/GenEducation/GenedUIProject --skill design-shotgun-geneducation

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you get unstuck on visual decisions by creating multiple design directions, putting them side by side, and making it easy to pick one and keep moving.

Core Features & Use Cases

  • Multiple Variants: Generate several UI concepts for the same screen so you can compare styles instead of guessing.
  • Side-by-Side Review: Open a comparison board that makes tradeoffs obvious for layout, hierarchy, and polish.
  • Feedback-Driven Iteration: Collect structured reactions, then refine the chosen direction without starting from zero.
  • Use Case: Great for redesigning a page, exploring a new feature before implementation, or fixing a screen that feels wrong but is hard to describe.

Quick Start

Use the design-shotgun skill to create three visual directions for the target screen and open them in a comparison board for review.

Frequently Asked Questions about design-shotgun

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

FAQPage Schema
How do I generate multiple UI design directions for a single screen?▼

To generate multiple UI design directions, you can create several visual variants for the same screen and compare them side by side. This visual brainstorming process helps you evaluate different layouts and styles instead of guessing which works best.

What is the best way to compare UI redesign concepts side by side?▼

The best way to compare UI redesign concepts is opening a comparison board that places multiple design variants next to each other. This makes tradeoffs in visual hierarchy, layout, and polish immediately obvious for selection.

How do I collect structured feedback on UI mockups during a brainstorming session?▼

You can collect structured feedback on UI mockups by generating multiple design variants and gathering targeted reactions on each direction. This allows you to refine the chosen concept iteratively without starting from zero.

Can I use visual brainstorming for exploring a new feature mockup before implementation?▼

Yes, visual brainstorming supports exploring new feature mockups before implementation. By generating multiple design directions for the interface, you can evaluate different visual approaches and fix layouts that feel wrong but are hard to describe.

How do I refine a UI design direction without starting over from scratch?▼

You refine a UI design direction by using feedback-driven iteration on your chosen variant. After generating multiple concepts and selecting one, you apply structured feedback to iteratively improve the layout and visual hierarchy without discarding the base design.

Related Skills

Explore More Design & Creative Skills→
drt0927drt0927
5

design-shotgun

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

Community
Advanced
TheTesseractAITheTesseractAI

mockup-graduate

Transform approved design mockups into production code with dependencies and assets.

Community
Intermediate
shogo-labsshogo-labs
12

design-shotgun

Generate multiple AI design variants and open a comparison board for structured feedback.

Official
Advanced
cegit27cegit27
3

design-shotgun

Generate multiple design variants from a brief and display them in a comparison board.

Official
Advanced