ui-ux

Audit web application interfaces for WCAG 2.1 AA accessibility and usability issues.

3|Updated Aug 3, 2025
One-click install
npx skills add https://github.com/CleanExpo/Synthex --skill ui-ux-cleanexpo
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: ui-ux
Source: https://github.com/CleanExpo/Synthex/tree/main/.claude/skills/ui-ux
Command: npx skills add https://github.com/CleanExpo/Synthex --skill ui-ux-cleanexpo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Identifies and resolves usability and accessibility barriers in the SYNTHEX product so users can complete tasks reliably, access content regardless of ability, and experience consistent, predictable interactions.

Core Features & Use Cases

  • Accessibility Audits: Perform WCAG 2.1 AA checks including colour contrast, ARIA labels, keyboard navigation, and motion preference handling.
  • User Flow & Interaction Analysis: Map journeys, surface friction points, validate touch targets, loading and error states, and ensure predictable interaction patterns.
  • Form and Feedback Optimization: Evaluate inline validation, error messages, success states, toasts, and optimistic updates to reduce user friction.
  • Use Case: Run a full audit of the onboarding or scheduling flow to produce a prioritized list of accessibility and usability fixes with severity and remediation guidance.

Quick Start

Run a full WCAG 2.1 AA accessibility and UX audit for the /dashboard onboarding flow and produce a prioritized findings report with recommendations.

Frequently Asked Questions about ui-ux

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

FAQPage Schema
How do I perform a WCAG 2.1 AA accessibility audit for a web application flow?

A WCAG 2.1 AA accessibility audit evaluates color contrast, ARIA roles, keyboard navigation, and motion preferences across user flows. This process identifies barriers and outputs a prioritized findings report with severity levels and specific remediation guidance for each issue.

What is the best way to identify usability friction in user flows and forms?

Identifying usability friction involves mapping user journeys to validate touch targets, loading states, and error handling. Evaluating form interactions like inline validation and success toasts surfaces predictable interaction patterns and reduces user friction across the application.

Can I validate keyboard navigation and ARIA labels for specific web pages?

Keyboard navigation and ARIA validation check that interactive elements are accessible without a mouse and have correct labels. This ensures users accessing content regardless of ability can complete tasks reliably and experience consistent interactions across pages and components.

How does interaction pattern validation handle error states and inline form validation?

Interaction pattern validation evaluates inline validation, error messages, success states, and optimistic updates to optimize form feedback. This ensures users receive immediate, clear feedback that reduces friction and makes interactions predictable throughout the user journey.

When do I need to check touch target and colour contrast requirements?

Check touch target and colour contrast requirements when optimizing user experience for accessibility and usability. These checks satisfy WCAG 2.1 AA standards, ensuring content is accessible regardless of ability and that interaction patterns remain consistent across devices.