Accessibility & UX

Patrones WCAG 2.2 AA y estados UX (cargando/vacío/error) para componentes de Power Platform.

Por korchard333 · korchard333/claude-power-platform-community

Probado · Funciona ★ 8.8/10

Accessibility & UX — Patrones WCAG 2.2 AA y estados UX (cargando/vacío/error) para componentes de Power Platform.

Qué hace

Proporciona guía de accesibilidad WCAG 2.2 AA, patrones de accesibilidad de React/Fluent UI y especificaciones de diseño UX (estados de carga, vacío y error, formularios, navegación, puntos de interrupción responsivos) para Power Platform Code Apps, Canvas Apps y controles PCF. SKILL.md es explícitamente solo un resumen — los detalles de implementación reales residen en siete subarchivos vinculados que deben leerse antes de codificar. Se activa al construir componentes accesibles, revisión WCAG, accesibilidad de formularios, navegación por teclado y diseño de estados de UI.

Informe de la prueba

Construyó un formulario de inicio de sesión accesible a partir de sus react-patterns.md y ux-patterns.md: obtuvo el cableado aria-describedby+role=alert y la regla de spinner inline-vs-full-page que un intento de línea base omitió — aunque el propio enlace cruzado de la habilidad a ../code-apps/fluent-ui.md se rompe si solo copias esta carpeta de habilidad.

Probado el: 2026-07-14 · Claude Code 2.x (agent harness)

Instalación

git clone https://github.com/korchard333/claude-power-platform-community
cd claude-power-platform-community
mkdir -p ~/.claude/skills
cp -r .claude/skills/accessibility-ux ~/.claude/skills/accessibility-ux

Comandos y prompts de ejemplo

  • /accessibility-uxPatrones WCAG 2.2 AA y estados UX (cargando/vacío/error) para componentes de Power Platform.

Los skills se activan con peticiones en lenguaje natural, sin comandos que memorizar. Tras instalarlo, prompts como estos lo activan (en inglés):

  • Build me an accessible data table with sortable columns for Canvas.
  • Review this login form for WCAG 2.2 AA compliance issues please.
  • Design the loading and empty states for our contacts list page.