majiayu000 Principio de Conexión Uniforme
Resumen
Los elementos conectados por propiedades visuales uniformes (líneas, colores, texturas) se perciben como más relacionados que elementos no conectados.
Origen
- Autores: Stephen Palmer y Irvin Rock
- Año: 1994
- Fuente: "Rethinking Perceptual Organization"
Fundamento Psicológico
Las conexiones visuales explícitas son interpretadas como indicadores de relación. Una línea entre dos elementos es más fuerte que proximidad o similitud solas para comunicar conexión. El cerebro interpreta la línea como un "puente" entre elementos.
Aplicación en Diseño
Líneas y Conectores
- Org charts con líneas jerárquicas
- Flow charts con conexiones direccionales
- Timelines con línea continua
- Tree views con branches conectados
Diagramas y Flujos
- User flows con conexiones claras
- Process diagrams con flechas
- Mind maps con líneas de relación
- Network graphs con edges
UI Connections
- Tooltips con arrows apuntando al elemento
- Popovers conectados visualmente a triggers
- Lines en forms conectando labels a campos
- Step indicators conectados en wizards
Data Visualization
- Line charts conectando puntos
- Sankey diagrams con flujos
- Chord diagrams con relaciones
- Node graphs con edges
Ejemplos
- Figma: Lines de conexión entre frames
- GitHub: Network graph de branches
- Miro: Conectores entre sticky notes
- Google Analytics: Flow visualization
- Notion: Database relation arrows
Anti-patterns
- ❌ Relaciones implícitas que deberían ser explícitas
- ❌ Líneas que cruzan muchos elementos confusamente
- ❌ Conexiones sin dirección cuando importa
- ❌ Demasiadas conexiones que crean ruido visual
- ❌ Líneas de diferentes estilos para mismo tipo de relación
Métricas
- Relationship Recognition: Usuarios identifican conexiones
- Flow Comprehension: Entendimiento de diagramas
- Visual Clutter Score: Conexiones vs legibilidad
- Direction Clarity: Comprensión de dirección de flujo
Principios Relacionados
- [[proximity]] - Proximidad sin conexión es más débil
- [[continuity]] - Líneas siguen caminos naturales
- [[common-fate]] - Elementos conectados que se mueven juntos
Referencias
- Palmer, S.E. & Rock, I. (1994). "Rethinking Perceptual Organization"
- Ware, C. (2012). "Information Visualization: Perception for Design"
- https://www.interaction-design.org/literature/article/laws-of-proximity-uniform-connectedness-and-continuation