design-exploration

Generate structured design briefs for UI/UX component variations.

Updated Feb 17, 2026
One-click install
npx skills add https://github.com/Celia-12/Proyecto-Mern --skill design-exploration-celia-12
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-exploration
Source: https://github.com/Celia-12/Proyecto-Mern/tree/main/frontend/.local/skills/design-exploration
Command: npx skills add https://github.com/Celia-12/Proyecto-Mern --skill design-exploration-celia-12

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill ensures that before generating design variations, the agent performs a thorough analysis of the selected component, its constraints, and possible axes of change, producing a structured design brief instead of raw file paths.

Core Features & Use Cases

  • Component comprehension: Reads source code, layout, interactions, and context.
  • Constraint identification: Distinguishes hard and soft constraints and degrees of freedom.
  • Axis selection: Chooses meaningful variation axes (structural, content, conceptual, behavioral, aesthetic) based on user intent.
  • Design brief composition: Generates a detailed brief describing analysis, constraints, axes, and concrete variation specs.
  • Delegation: Passes the brief and file paths to a design sub‑agent with clear instructions.

Quick Start

Activate the design-exploration skill when a user requests variations of a UI component.

Frequently Asked Questions about design-exploration

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

FAQPage Schema
How do I generate UI design variations from an existing component?▼

To generate UI design variations, the skill analyzes the component's source code, identifies hard and soft constraints, selects meaningful axes of change, and composes a structured design brief for a sub-agent to execute.

What is a design brief for component variation requests?▼

A design brief for component variation requests is a structured document detailing component comprehension, constraint identification, selected variation axes, and concrete design specifications passed to an executing sub-agent.

How do I identify constraints and degrees of freedom for UX exploration?▼

UX exploration constraint identification distinguishes hard constraints from soft constraints by analyzing source code, layout, interactions, and context to determine available degrees of freedom for component variations.

Can I use design exploration for structural and behavioral layout alternatives?▼

Yes, design exploration supports structural, content, conceptual, behavioral, and aesthetic variation axes based on user intent to produce distinct UI/UX component design hypotheses.

Does design variation brief generation work without external dependencies?▼

Yes, design variation brief generation operates without external dependencies, relying entirely on analyzing the provided component source code and layout context to produce distinct design hypotheses.

When should I not use automated design briefs for UI variations?▼

Automated design briefs for UI variations should not be used when a component's source code is unavailable for analysis, as the skill requires reading code to identify constraints and select variation axes.