skills.rest
ambrovia
ambroviaOFFICIAL
Explore all skills by this author →
GitHub

design

Generate and critique UI design variants using a 9-dimension rubric.

Updated Jun 12, 2026
Search Tags:#design#ui#prototyping#ux#design-system#component-viewer
One-click install
npx skills add https://github.com/ambrovia/agent-skills-pipeline --skill design-ambrovia
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design
Source: https://github.com/ambrovia/agent-skills-pipeline/tree/main/skills/design
Command: npx skills add https://github.com/ambrovia/agent-skills-pipeline --skill design-ambrovia

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires vite, react, react-dom, and includes scripts (resource) components.

What problem does it solve?

This skill solves the problem of "vibe coding" and design stagnation by enforcing a structured, multi-variant design process that prevents premature convergence on a single, unvetted UI idea.

Core Features & Use Cases

  • Multi-Variant Generation: Forces the creation of 1-3 distinct design variants based on specific constraints and theses to ensure breadth of exploration.
  • Objective Critique: Implements a 9-dimension rubric to score designs, ensuring visual hierarchy, density, and state strategies are evaluated against project standards.
  • Integrated Review: Provides a Vite-based component viewer with a first-party annotation overlay, allowing founders to provide spatial feedback directly on rendered components.

Quick Start

Run the design skill on the current work package to generate three distinct UI variants for review.

Frequently Asked Questions about design

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

FAQPage Schema
How do I prevent design stagnation and avoid premature convergence on a single UI idea?▼

Multi-variant exploration prevents design stagnation by forcing the generation of 1-3 distinct UI variants based on specific constraints before implementation. This structured process ensures broad aesthetic and functional exploration.

What is the best way to standardize UI/UX design across new surfaces and interaction flows?▼

Standardizing UI/UX design requires a configured design system and a 9-dimension critique rubric to evaluate visual hierarchy, density, and state strategies. This ensures aesthetic and functional quality across new surfaces, primitives, and interaction flows.

How do I collect spatial feedback directly on rendered React components?▼

You can collect spatial feedback using a Vite-based component viewer with a first-party annotation overlay. This integrated review mechanism allows founders to provide spatial feedback directly on rendered React components.

Do I need a configured design system to use multi-variant UI exploration?▼

Yes, a configured design system is required for multi-variant UI exploration. The process enforces adherence to a 9-dimension critique rubric to ensure generated variants meet established project design standards.

How does a 9-dimension critique rubric evaluate UI design variants?▼

A 9-dimension critique rubric scores UI design variants by evaluating visual hierarchy, density, and state strategies against project standards. This objective critique mechanism ensures aesthetic and functional quality across all generated variants.

Related Skills

Explore More Design & Creative Skills→
catalinakarstulovic2-aicatalinakarstulovic2-ai

shadcn-ui

Generate copy-paste React UI components styled with Tailwind CSS.

Community
Advanced
zts212653zts212653
2.6k

pencil-design

Convert .pen design files into React/Tailwind components.

Community
Intermediate
devturcodevturco

react-patterns

Identify and fix React 19 performance issues in Vite and Cloudflare Workers components.

Community
Advanced
791994545791994545
4

prototype

Build disposable terminal apps or multi-variant UI prototypes for design testing.

Community
Intermediate