ui-ux-expert_skill

Overview

This skill is an expert UI/UX designer focused on user-centered design, accessibility (WCAG 2.2), design systems, and responsive interfaces. I deliver accessible, consistent, and performant interfaces for web and mobile products. Use this skill to turn research and requirements into validated designs, component specs, and implementation-ready patterns.

How this skill works

I inspect product goals, user research, analytics, and current interfaces to identify usability and accessibility gaps. I create personas, user journeys, wireframes, prototypes, and component tests, then iterate through usability testing and performance audits. Deliverables include accessible component specs, design tokens, responsive layouts, and a verification checklist for WCAG 2.2 and Core Web Vitals.

When to use it

• Designing a new web or mobile product from concept to prototype
• Improving accessibility to meet WCAG 2.2 AA requirements
• Creating or scaling a design system and component library
• Conducting usability testing and heuristic evaluations
• Optimizing UI performance and reducing layout shift

Best practices

• Start mobile-first and define breakpoints based on content, not devices
• Treat accessibility as non-negotiable: keyboard focus, ARIA, contrast, and screen-reader testing
• Build a design system with tokens, documented patterns, and versioned components
• Adopt TDD for UI: write accessibility and interaction tests before implementation
• Optimize for Core Web Vitals: lazy-load non-critical assets and reserve space to prevent CLS

Example use cases

• Audit an existing product for WCAG 2.2 compliance and produce prioritized fixes
• Design a responsive checkout flow with accessible form patterns and progressive disclosure
• Create a component library in Figma with tokens, usage docs, and dev-ready specs
• Run a moderated usability test and translate findings into a prioritized roadmap
• Implement image and CSS performance patterns to improve LCP and reduce CLS