controlled-ux-designer

Provides UI/UX design advice with accessibility and best-practice focus.

Updated Jun 24, 2026
One-click install
npx skills add https://github.com/udsy19/.claude --skill controlled-ux-designer
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: controlled-ux-designer
Source: https://github.com/udsy19/.claude/tree/main/skills/controlled-ux-designer
Command: npx skills add https://github.com/udsy19/.claude --skill controlled-ux-designer

SYSTEM DOCUMENTATION & REQUIREMENTS

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

What problem does it solve?

This Skill provides expert UI/UX design guidance for creating accessible, unique, and functional interfaces, helping you make informed design decisions.

Core Features & Use Cases

  • Design Decision Protocol: Always ask before making design decisions, ensuring collaboration and adherence to best practices.
  • Foundational Principles: Follows principles like simplicity, material honesty, and functional layering for cohesive design.
  • Visual Design Standards: Offers comprehensive guidance on color, typography, layout, and animation to ensure a consistent and accessible design.
  • Interaction Design: Focuses on purposeful animation, immediate feedback, and consistent behavior for an engaging user experience.
  • Styling Implementation: Details on component libraries, styling engines, and responsive design for effective implementation.
  • Accessibility Standards: Ensures compliance with WCAG 2.1 AA guidelines and best practices for accessibility.
  • Design Process & Testing: Provides a workflow for understanding context, exploring options, implementing iteratively, and validating designs.
  • Examples: Includes practical examples of button design, typography hierarchy, and color palette suggestions.

Quick Start

Use the controlled-ux-designer skill to guide design decisions for a new product feature.

Frequently Asked Questions about controlled-ux-designer

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

FAQPage Schema
How do I design UI/UX interfaces that meet WCAG 2.1 AA accessibility standards?

To design accessible UI/UX interfaces meeting WCAG 2.1 AA standards, apply foundational principles like simplicity and functional layering while validating color contrast, typography, and interaction feedback against accessibility guidelines.

What's the best way to establish visual design standards for a new product feature?

Establish visual design standards for a product feature by defining consistent color palettes, typography hierarchies, and layout structures, guided by a design decision protocol that ensures collaborative and informed choices.

How does interaction design improve user experience in interface development?

Interaction design improves user experience by focusing on purposeful animation, immediate feedback, and consistent behavior, ensuring that interface elements respond intuitively during product development workflows.

Do I need prior knowledge of design principles to use this UI/UX design guidance?

Yes, you need a solid understanding of design principles and best practices, as this UI/UX design guidance requires foundational knowledge to effectively apply its accessibility and interaction standards.

When should I apply functional layering and material honesty in interface design?

Apply functional layering and material honesty in interface design when creating cohesive product features, ensuring that visual elements remain simple and purposeful while maintaining accessibility compliance.

Can I get practical examples for typography hierarchy and color palette suggestions?

Yes, practical examples for typography hierarchy, color palette suggestions, and button design are included to demonstrate how to implement accessible and consistent visual design standards effectively.