skills.rest
ihj04982
ihj04982COMMUNITY
Explore all skills by this author →
WebsiteGitHub

design-lab

Generate five UI design variations and implementation plans with feedback collection.

Updated Feb 10, 2026
Search Tags:#feedback#design system#prototyping#implementation plan#ui design#design variations
One-click install
npx skills add https://github.com/ihj04982/my-cursor-settings --skill design-lab-ihj04982
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: design-lab
Source: https://github.com/ihj04982/my-cursor-settings/tree/main/skills/design-lab
Command: npx skills add https://github.com/ihj04982/my-cursor-settings --skill design-lab-ihj04982

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill streamlines the UI design process by enabling rapid exploration of multiple design variations, gathering targeted feedback, and generating actionable implementation plans.

Core Features & Use Cases

  • Design Exploration: Generates five distinct UI variations for a component or page.
  • Interactive Feedback: Provides a Figma-like overlay for users to comment directly on design elements.
  • Plan Generation: Creates a detailed implementation plan and updates design memory.
  • Use Case: Redesigning a complex dashboard component to improve usability and visual appeal, allowing stakeholders to compare options and provide specific feedback before development begins.

Quick Start

Use the design-lab skill to explore UI variations for the user profile page.

Frequently Asked Questions about design-lab

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

FAQPage Schema
How do I generate multiple UI design variations for a component?▼

Generating UI design variations involves creating five distinct design options for a specific component or page, allowing stakeholders to compare different visual approaches and provide targeted feedback before implementation begins.

Can I collect feedback directly on UI design elements during prototyping?▼

Yes, collecting feedback on UI design elements utilizes an interactive overlay where users can comment directly on specific parts of the design, streamlining the review process and ensuring actionable critique.

Does this UI design workflow support framework detection for Next.js and Vite?▼

Yes, the UI design workflow supports framework detection for Next.js and Vite, automatically inferring the visual language and analyzing styling systems like Tailwind or Material UI to ensure design consistency.

How do I create an implementation plan after finalizing a UI design?▼

Creating an implementation plan after finalizing a UI design involves generating a detailed development roadmap and updating design memory, bridging the gap between visual exploration and code execution.

What is the best way to ensure design system consistency across multiple variations?▼

Ensuring design system consistency across multiple variations requires analyzing the existing styling system, such as Tailwind or Material UI, to infer the visual language and apply it uniformly across all generated options.

Related Skills

Explore More Design & Creative Skills→
SouleymaneSy7SouleymaneSy7
2

shadcn

Manage UI components and design systems with the shadcn/ui library.

Community
Advanced
eddieluengeddielueng
1

popular-web-designs

Generate HTML and CSS from cataloged web design system templates.

Community
Basic
timequitytimequity
6

brainstorming

Convert rough ideas into detailed designs through Socratic dialogue.

Official
Basic
powxenvpowxenv

design-lab

Generate five UI design variations and collect interactive feedback.

Community
Advanced