skills.rest
gwpjp
gwpjpCOMMUNITY
Explore all skills by this author →
GitHub

ui-designer

Coordinates multidisciplinary teams to produce unified UI design specifications and recommendations.

3|Updated Jan 31, 2026
Search Tags:#workflow#react#coordination#ui-design#design-patterns#design-systems#theme-compliance
One-click install
npx skills add https://github.com/gwpjp/Web3-Claude --skill ui-designer-gwpjp
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: ui-designer
Source: https://github.com/gwpjp/Web3-Claude/tree/main/.claude/skills/ui-designer
Command: npx skills add https://github.com/gwpjp/Web3-Claude --skill ui-designer-gwpjp

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill coordinates UI design work across multiple specialized sub-agents to ensure cohesive interfaces, consistent design language, and efficient collaboration.

Core Features & Use Cases

  • Orchestrates dialogue between theme-ui-specialist and react-specialist to align on design-system decisions.
  • Reads and references design-patterns.md, theme-reference.md, and component-reference.md to guide layout, theming, and component choices.
  • Manages design-system conformance, accessibility considerations, and responsive patterns across projects.
  • Use Case: When starting a new UI module, invoke the design workflow to produce a unified design specification and hand off to implementation sub-agents for coding.

Quick Start

  • Review design patterns and theme references in the .claude/docs and .claude/skills/ui-designer/design-patterns.md
  • Invoke the design-dialogue to obtain unified recommendations
  • Delegate tasks to /theme-ui-specialist and /react-specialist to implement the UI changes

Frequently Asked Questions about ui-designer

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

FAQPage Schema
How do I coordinate UI design across multiple sub-agents for a React web interface?▼

To coordinate UI design across sub-agents, this Skill orchestrates dialogue between theme-ui and react specialists, ensuring cohesive interfaces and consistent design language. It aligns layout, theming, and component decisions by referencing design-patterns.md and theme-reference.md.

How do I maintain design-system conformance and theme compliance in React?▼

To maintain design-system conformance and theme compliance, this Skill validates component choices and layout patterns against project-rules.md and theme-reference.md. It manages accessibility considerations and responsive patterns to generate unified, actionable recommendations.

What's the best way to start a new UI module and hand off to implementation sub-agents?▼

To start a new UI module, invoke the design workflow to read design-patterns.md and component-reference.md, producing a unified design specification. This specification is then handed off to implementation sub-agents for coding the React interface.

Do I need specific reference files to generate unified UI design recommendations?▼

Yes, generating unified UI design recommendations requires access to design-patterns.md, theme-reference.md, component-reference.md, project-rules.md, and relevant source files. These references ensure cohesive interfaces and consistent interaction patterns across web interfaces.

Can I use this workflow to align layout and interaction patterns across design systems?▼

Yes, you can use this workflow to align layout and interaction patterns across design systems. It orchestrates dialogue between specialized sub-agents to manage responsive patterns, accessibility considerations, and component decisions, ensuring cohesive interfaces.

Related Skills

Explore More Design & Creative Skills→
gwpjpgwpjp
3

analyze-theme

Audit MUI components and theme config for hardcoded values and generate violation reports.

Community
Basic
sddevelopment-besddevelopment-be
13

delegate

Delegate tasks to specialist agents when domain expertise is required.

Official
Advanced
HieubkavHieubkav

ui-styling

Create accessible UI styling with shadcn/ui and Tailwind CSS for React applications.

Community
Advanced
fabioabrfabioabr

prs-writer

Convert Markdown documents into standalone HTML presentations using templates.

Community
Advanced