Agent skill

universal-design

Diseño que funciona para todos sin necesidad de adaptación. Use cuando diseñe productos para audiencias diversas o cuando busque máximo alcance.

Stars 163
Forks 31

Install this agent skill to your Project

npx add-skill https://github.com/majiayu000/claude-skill-registry/tree/main/skills/data/universal-design-vjrivmon-setup-software-ia

Metadata

Additional technical details for this skill

author
ux-ui-skills
version
1.0
category
frameworks

SKILL.md

Diseño Universal

Resumen

Diseño de productos y entornos que sean utilizables por todas las personas, en la mayor medida posible, sin necesidad de adaptación o diseño especializado.

Origen

  • Autor: Ronald Mace (NC State University)
  • Año: 1997
  • Centro: Center for Universal Design
  • Contexto: Arquitectura accesible

Los 7 Principios

1. Uso Equitativo

  • Útil para personas con diversas capacidades
  • Mismo método de uso cuando posible
  • Equivalente cuando no es posible
  • Sin segregar usuarios

2. Flexibilidad de Uso

  • Acomoda preferencias y habilidades
  • Facilita precisión y accuracy
  • Ofrece adaptabilidad al ritmo
  • Permite múltiples métodos

3. Uso Simple e Intuitivo

  • Fácil de entender
  • Independiente de experiencia
  • Independiente de conocimiento
  • Independiente de idioma

4. Información Perceptible

  • Comunica eficazmente
  • Múltiples modos (visual, auditivo, táctil)
  • Contraste adecuado
  • Compatible con técnicas/dispositivos

5. Tolerancia al Error

  • Minimiza riesgos de acciones accidentales
  • Warnings de peligros
  • Fail-safe features
  • Desalienta acciones inconscientes en tareas críticas

6. Bajo Esfuerzo Físico

  • Uso eficiente y cómodo
  • Mínima fatiga
  • Posición corporal neutral
  • Fuerzas de operación razonables

7. Tamaño y Espacio Apropiado

  • Apropiado para approach, reach, manipulation
  • Independiente de tamaño corporal
  • Independiente de postura
  • Independiente de movilidad

Aplicación en Diseño Digital

Uso Equitativo

  • Una URL para todos (no versiones "accesibles")
  • Responsive design
  • Progressive enhancement
  • Sin barreras de entrada

Flexibilidad

  • Dark mode / light mode
  • Tamaños de fuente ajustables
  • Keyboard + mouse + touch
  • Velocidad de animación configurable

Simple e Intuitivo

  • Iconos universales
  • Navegación consistente
  • Lenguaje simple
  • Onboarding claro

Información Perceptible

  • Alt text en imágenes
  • Captions en videos
  • Transcripts de audio
  • High contrast options

Tolerancia al Error

  • Undo disponible
  • Confirmaciones para acciones destructivas
  • Autoguardado
  • Mensajes de error claros

Bajo Esfuerzo

  • Gestos simples
  • Clicks mínimos
  • Formularios cortos
  • Autocompletado

Espacio Apropiado

  • Touch targets de 44px+
  • Spacing generoso
  • Scrolling natural
  • Zoom funcional

Ejemplos

  • OXO Good Grips: Diseñado para artritis, útil para todos
  • Rampas de acera: Para sillas de ruedas, útiles para todos
  • Puertas automáticas: Accesibles, convenientes para todos
  • Subtítulos: Para sordos, útiles en espacios ruidosos

Anti-patterns

  • ❌ Diseñar para "usuario promedio"
  • ❌ Accesibilidad como afterthought
  • ❌ Versiones separadas para "discapacitados"
  • ❌ Asumir capacidades uniformes
  • ❌ Ignorar edge cases como casos raros

Principios Relacionados

  • [[inclusive-design]] - Diseño que incluye
  • [[wcag-perceivable]] - Web accesible
  • [[accessibility]] - Accesibilidad digital

Referencias

Didn't find tool you were looking for?

Be as detailed as possible for better results