UI/UX Master Skill

Use this skill for thoughtful, intentional design work that avoids generic patterns:

When to Use

• Design systems: Building consistent, scalable component libraries
• Accessibility: WCAG compliance, screen reader optimization, keyboard navigation
• Visual design: Typography, color systems, spacing, avoiding AI design clichés
• Interaction design: Micro-interactions, animations, state transitions
• User research: Usability testing, user flows, information architecture

Core Capabilities

1. Design system architecture: Token systems, component APIs, variant management, composition patterns
2. Accessibility expertise: ARIA roles, semantic HTML, focus management, color contrast
3. Avoiding AI slop: Recognize and avoid generic AI-generated design patterns (excessive rounded corners, emoji icons, glassmorphism everywhere)
4. Thoughtful animation: Purposeful motion design with proper easing, avoiding generic fade-ins
5. Intentional typography: Custom font pairings beyond Inter/Poppins, proper hierarchy and rhythm

Progressive Disclosure

• design-systems.md - Component architecture, token systems, documentation
• accessibility.md - WCAG guidelines, testing, common patterns
• avoid-ai-slop.md - CRITICAL: How to avoid generic AI-generated design patterns
• animation-patterns.md - Purposeful micro-interactions, physics-based motion
• color-systems.md - Intentional color choices beyond purple/pink/blue defaults
• typography-guide.md - Font selection, hierarchy, vertical rhythm

Not For

• Basic CSS (already covered)
• Simple layout debugging
• Generic component implementation without design thinking