Promotes inclusive design principles to enhance accessibility and diversity in digital products, benefiting a wider audience.
Installable skillMITBy vjrivmonUpdated Oct 27, 2026
INTENDED FORClaude CodeCodexOpenClawCursorGeminiInstall in a listed agent.
instructions.md
---
name: inclusive-design
description:
Diseño que considera la diversidad humana desde el inicio. Use cuando diseñe
para equipos diversos, mercados globales, o cuando quiera maximizar alcance.
metadata:
author: ux-ui-skills
version: "1.0"
category: frameworks
---
# Diseño Inclusivo
## Resumen
Metodología de diseño que considera todo el rango de diversidad humana con
respecto a habilidad, idioma, cultura, género, edad, y otras formas de
diferencia.
## Origen
- **Desarrollado por**: Microsoft Design
- **Framework**: Inclusive Design Principles
- **Evolución**: De "diseño para discapacidad" a "diseño para diversidad"
## Principios de Microsoft
### 1. Reconocer Exclusión
- Identificar quién está excluido
- Entender por qué están excluidos
- Examinar biases en el proceso
- Ver exclusión como oportunidad de diseño
### 2. Aprender de la Diversidad
- Incluir personas excluidas en el proceso
- Perspectivas diversas generan innovación
- Expertos en sus propias experiencias
- Co-diseño con comunidades
### 3. Resolver para Uno, Extender a Muchos
- Diseñar para necesidades específicas
- Soluciones benefician a más personas
- "Curb cut effect"
- Innovación a través de constraints
## Espectro de Exclusión
### Permanente → Temporal → Situacional
- **Un brazo**: Amputado → Lesionado → Cargando bebé
- **Sordo**: Permanente → Infección → Entorno ruidoso
- **Ciego**: Permanente → Cataratas → Conductor
- **Mudo**: Permanente → Laringitis → No puedo hablar (reunión)
### Implicación
- Diseñar para "permanente" ayuda a todos
- Todos experimentamos exclusión situacional
- Amplía el mercado potencial
- Mejora la experiencia para todos
## Aplicación en Diseño
### Proceso
- Investigación con usuarios diversos
- Personas que incluyen discapacidades
- Testing con tecnologías asistivas
- Auditorías de exclusión
### Producto Digital
- Múltiples formas de input
- Múltiples formas de output
- Configurabilidad
- Graceful degradation
### Contenido
- Lenguaje simple y claro
- Múltiples idiomas
- Evitar jerga y regionalismos
- Representación diversa en imágenes
### Visual
- No depender solo del color
- Contraste suficiente
- Escalabilidad de texto
- Iconos con labels
## Ejemplos
- **Xbox Adaptive Controller**: Para gamers con discapacidades
- **iPhone VoiceOver**: Navegación por voz desde el inicio
- **Google Live Transcribe**: Para sordos, útil en reuniones
- **YouTube Auto-captions**: Originado para accesibilidad
## Anti-patterns
- ❌ "Diseñaremos la versión accesible después"
- ❌ Asumir que usuarios tienen mismas capacidades que el equipo
- ❌ Testing solo con usuarios "típicos"
- ❌ Tratar accesibilidad como checkbox legal
- ❌ Ignorar diversidad cultural y lingüística
## Beneficios de Negocio
- 15% de población mundial tiene discapacidad
- 100% experimenta discapacidad situacional
- Mercado más amplio
- Innovación por constraints
- Mejor reputación de marca
## Métricas
- **Exclusion Audit**: ¿Quién no puede usar esto?
- **Diversity in Testing**: % de usuarios diversos
- **Accessibility Score**: WCAG compliance
- **Global Reach**: Uso por demografía
## Principios Relacionados
- [[universal-design]] - Diseño para todos
- [[wcag-perceivable]] - Web accesible
- [[postels-law]] - Flexibilidad en inputs
## Referencias
- Microsoft Inclusive Design Toolkit
- Holmes, K. (2018). "Mismatch: How Inclusion Shapes Design"
- https://inclusive.microsoft.design/
---
name: inclusive-design
description:
Diseño que considera la diversidad humana desde el inicio. Use cuando diseñe
para equipos diversos, mercados globales, o cuando quiera maximizar alcance.
metadata:
author: ux-ui-skills
version: "1.0"
category: frameworks
---
# Diseño Inclusivo
## Resumen
Metodología de diseño que considera todo el rango de diversidad humana con
respecto a habilidad, idioma, cultura, género, edad, y otras formas de
diferencia.
## Origen
- **Desarrollado por**: Microsoft Design
- **Framework**: Inclusive Design Principles
- **Evolución**: De "diseño para discapacidad" a "diseño para diversidad"
## Principios de Microsoft
### 1. Reconocer Exclusión
- Identificar quién está excluido
- Entender por qué están excluidos
- Examinar biases en el proceso
- Ver exclusión como oportunidad de diseño
### 2. Aprender de la Diversidad
- Incluir personas excluidas en el proceso
- Perspectivas diversas generan innovación
- Expertos en sus propias experiencias
- Co-diseño con comunidades
### 3. Resolver para Uno, Extender a Muchos
- Diseñar para necesidades específicas
- Soluciones benefician a más personas
- "Curb cut effect"
- Innovación a través de constraints
## Espectro de Exclusión
### Permanente → Temporal → Situacional
- **Un brazo**: Amputado → Lesionado → Cargando bebé
- **Sordo**: Permanente → Infección → Entorno ruidoso
- **Ciego**: Permanente → Cataratas → Conductor
- **Mudo**: Permanente → Laringitis → No puedo hablar (reunión)
### Implicación
- Diseñar para "permanente" ayuda a todos
- Todos experimentamos exclusión situacional
- Amplía el mercado potencial
- Mejora la experiencia para todos
## Aplicación en Diseño
### Proceso
- Investigación con usuarios diversos
- Personas que incluyen discapacidades
- Testing con tecnologías asistivas
- Auditorías de exclusión
### Producto Digital
- Múltiples formas de input
- Múltiples formas de output
- Configurabilidad
- Graceful degradation
### Contenido
- Lenguaje simple y claro
- Múltiples idiomas
- Evitar jerga y regionalismos
- Representación diversa en imágenes
### Visual
- No depender solo del color
- Contraste suficiente
- Escalabilidad de texto
- Iconos con labels
## Ejemplos
- **Xbox Adaptive Controller**: Para gamers con discapacidades
- **iPhone VoiceOver**: Navegación por voz desde el inicio
- **Google Live Transcribe**: Para sordos, útil en reuniones
- **YouTube Auto-captions**: Originado para accesibilidad
## Anti-patterns
- ❌ "Diseñaremos la versión accesible después"
- ❌ Asumir que usuarios tienen mismas capacidades que el equipo
- ❌ Testing solo con usuarios "típicos"
- ❌ Tratar accesibilidad como checkbox legal
- ❌ Ignorar diversidad cultural y lingüística
## Beneficios de Negocio
- 15% de población mundial tiene discapacidad
- 100% experimenta discapacidad situacional
- Mercado más amplio
- Innovación por constraints
- Mejor reputación de marca
## Métricas
- **Exclusion Audit**: ¿Quién no puede usar esto?
- **Diversity in Testing**: % de usuarios diversos
- **Accessibility Score**: WCAG compliance
- **Global Reach**: Uso por demografía
## Principios Relacionados
- [[universal-design]] - Diseño para todos
- [[wcag-perceivable]] - Web accesible
- [[postels-law]] - Flexibilidad en inputs
## Referencias
- Microsoft Inclusive Design Toolkit
- Holmes, K. (2018). "Mismatch: How Inclusion Shapes Design"
- https://inclusive.microsoft.design/
Imported from the listed AgentSkill.sh category. Complete supplied package files and notices are retained. Required external tools and credentials are not installed. No bundled code was executed during import. Individual agent task behavior has not been tested.
Resource notes updated 2026-10-27 · Original instructions by vjrivmon
Creates comprehensive design systems with typography, colors, components, and documentation for consistent UI development. Use when establishing design standards, building component libraries, or ensuring cross-team consistency. Keywords: design-tokens, typography, spacing, color-palette, compon...
UI design system toolkit for Senior UI Designer including design token generation, component documentation, responsive design calculations, and developer handoff tools. Use for creating design systems, maintaining visual consistency, and facilitating design-dev collaboration.
Comprehensive guide for creating professional UI/UX designs in Penpot using MCP tools. Use this skill when: (1) Creating new UI/UX designs for web, mobile, or desktop applications, (2) Building design systems with components and tokens, (3) Designing dashboards, forms, navigation, or landing page...