Enhances usability by promoting consistent behaviors and appearances in design systems, improving user experience and trust.
Installable skillMITBy vjrivmonUpdated Oct 27, 2026
INTENDED FORClaude CodeCodexCursorChatGPTGeminiInstall in a listed agent.
instructions.md
---
name: consistency-principle
description:
Comportamientos y apariencias consistentes mejoran la usabilidad. Use cuando
establezca patrones de diseño, defina guidelines, o evalúe coherencia del
sistema.
metadata:
author: ux-ui-skills
version: "1.0"
category: design-principles
---
# Principio de Consistencia
## Resumen
La usabilidad mejora cuando elementos similares funcionan de manera similar en
todo el sistema. La consistencia reduce el aprendizaje, previene errores, y crea
confianza.
## Origen
- **Concepto**: Principio fundamental de diseño de interfaces
- **Documentado por**: Ben Shneiderman (8 Golden Rules), Jakob Nielsen
- **Año**: ~1980s
## Tipos de Consistencia
### Consistencia Interna
- Mismo sistema, mismas reglas
- Botones iguales en todas las pantallas
- Terminología uniforme
- Comportamientos predecibles
### Consistencia Externa
- Convenciones de plataforma (iOS, Android, Web)
- Patrones de industria
- Estándares de accesibilidad
- Expectativas de otros productos
### Consistencia Visual
- Colores con significado consistente
- Tipografía con jerarquía clara
- Espaciado y layout uniforme
- Iconografía coherente
### Consistencia Funcional
- Mismas acciones, mismos resultados
- Shortcuts que funcionan igual
- Flujos predecibles
- Feedback consistente
## Aplicación en Diseño
### Design Systems
- Tokens de diseño documentados
- Componentes reutilizables
- Guidelines de uso
- Patrones de interacción definidos
### UX Writing
- Voz y tono consistente
- Terminología estandarizada
- Mensajes de error uniformes
- CTAs con lenguaje predecible
### Interacciones
- Gestos con significado fijo
- Animaciones con timing consistente
- Estados (hover, active, disabled) uniformes
- Feedback visual predecible
## Ejemplos
- **Material Design**: Sistema completo de Google
- **Apple HIG**: Guidelines para iOS/macOS
- **Stripe**: Consistencia en productos, docs, dashboard
- **Slack**: Patrones uniformes en toda la app
- **Notion**: Blocks que funcionan igual en todos lados
## Anti-patterns
- ❌ Botones de diferentes colores para misma acción
- ❌ Terminología mixta ("Guardar" vs "Salvar")
- ❌ Navegación que cambia de posición
- ❌ Gestos con significados diferentes
- ❌ Estilos de fecha/hora inconsistentes
## Métricas
- **Style Guide Compliance**: Adherencia a guidelines
- **User Expectation Match**: Comportamiento vs expectativa
- **Learnability Score**: Velocidad de aprendizaje
- **Error Rate by Inconsistency**: Errores por confusión
## Principios Relacionados
- [[nielsen-consistency]] - Heurística de consistencia
- [[jakobs-law]] - Expectativas de otros sitios
- [[similarity]] - Gestalt: similitud visual
## Referencias
- Shneiderman, B. (1987). "Designing the User Interface"
- Nielsen, J. (1994). "Heuristic Evaluation"
- https://www.nngroup.com/articles/consistency-and-standards/
---
name: consistency-principle
description:
Comportamientos y apariencias consistentes mejoran la usabilidad. Use cuando
establezca patrones de diseño, defina guidelines, o evalúe coherencia del
sistema.
metadata:
author: ux-ui-skills
version: "1.0"
category: design-principles
---
# Principio de Consistencia
## Resumen
La usabilidad mejora cuando elementos similares funcionan de manera similar en
todo el sistema. La consistencia reduce el aprendizaje, previene errores, y crea
confianza.
## Origen
- **Concepto**: Principio fundamental de diseño de interfaces
- **Documentado por**: Ben Shneiderman (8 Golden Rules), Jakob Nielsen
- **Año**: ~1980s
## Tipos de Consistencia
### Consistencia Interna
- Mismo sistema, mismas reglas
- Botones iguales en todas las pantallas
- Terminología uniforme
- Comportamientos predecibles
### Consistencia Externa
- Convenciones de plataforma (iOS, Android, Web)
- Patrones de industria
- Estándares de accesibilidad
- Expectativas de otros productos
### Consistencia Visual
- Colores con significado consistente
- Tipografía con jerarquía clara
- Espaciado y layout uniforme
- Iconografía coherente
### Consistencia Funcional
- Mismas acciones, mismos resultados
- Shortcuts que funcionan igual
- Flujos predecibles
- Feedback consistente
## Aplicación en Diseño
### Design Systems
- Tokens de diseño documentados
- Componentes reutilizables
- Guidelines de uso
- Patrones de interacción definidos
### UX Writing
- Voz y tono consistente
- Terminología estandarizada
- Mensajes de error uniformes
- CTAs con lenguaje predecible
### Interacciones
- Gestos con significado fijo
- Animaciones con timing consistente
- Estados (hover, active, disabled) uniformes
- Feedback visual predecible
## Ejemplos
- **Material Design**: Sistema completo de Google
- **Apple HIG**: Guidelines para iOS/macOS
- **Stripe**: Consistencia en productos, docs, dashboard
- **Slack**: Patrones uniformes en toda la app
- **Notion**: Blocks que funcionan igual en todos lados
## Anti-patterns
- ❌ Botones de diferentes colores para misma acción
- ❌ Terminología mixta ("Guardar" vs "Salvar")
- ❌ Navegación que cambia de posición
- ❌ Gestos con significados diferentes
- ❌ Estilos de fecha/hora inconsistentes
## Métricas
- **Style Guide Compliance**: Adherencia a guidelines
- **User Expectation Match**: Comportamiento vs expectativa
- **Learnability Score**: Velocidad de aprendizaje
- **Error Rate by Inconsistency**: Errores por confusión
## Principios Relacionados
- [[nielsen-consistency]] - Heurística de consistencia
- [[jakobs-law]] - Expectativas de otros sitios
- [[similarity]] - Gestalt: similitud visual
## Referencias
- Shneiderman, B. (1987). "Designing the User Interface"
- Nielsen, J. (1994). "Heuristic Evaluation"
- https://www.nngroup.com/articles/consistency-and-standards/
Platform guidance
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...