Estamos preparando el PDF de «Cómo leemos gráficas (percepción)». Se descargará automáticamente en cuanto esté listo.
← Lumbre

Visualización de Datos · 4.º Cómo leemos gráficas (percepción)

Portada de Cómo leemos gráficas (percepción)

Cómo leemos gráficas (percepción)

✦ Una gráfica no se lee como un texto: se ve de golpe antes de analizarla · Visualización de Datos · Análisis de Datos · en 11 minutos

Roadwise Consulting

Firmado y verificado · Biblioteca UNIV

Objetivo: Aplicar principios de percepción visual para codificar los datos en los canales que el ojo decodifica con más precisión, y evitar gráficas que engañan o fuerzan a descifrar.

11 min Visualización de Datos · Análisis de Datos 18–30 años
Más
Cómo leemos gráficas (percepción)

Herramientas de la lección

◉ Entrar a La Matrix Sorpréndeme

Sobre este contenido

Ir a

Volver a Visualización de Datos · 4.º semestre Cursos Explorar Mi cuenta Salir del modo estudio

Cómo leemos gráficas (percepción)

Jerarquía visual: cómo guiar la mirada del lector
Vídeo en español (canal Hey Jaime) sobre jerarquía visual y cómo dirigir la atención del ojo, la base de que un gráfico se entienda de un vistazo.

Ver antes de pensar

La percepción preatencional procesa en paralelo rasgos básicos —color, longitud, orientación, movimiento— sin esfuerzo ni atención consciente. Solo después llega el lento procesamiento secuencial. Una visualización eficaz deposita el mensaje en la fase preatencional: el contraste importante debe saltar solo.

Atributos preatencionales

Hay señales que el sistema visual extrae de golpe: un punto rojo entre azules, una línea inclinada entre verticales, un elemento que parpadea. Usarlos para marcar lo relevante comunica sin esfuerzo; diluirlos en adornos desperdicia el único canal que trabaja gratis.

Barras horizontales alineadas con una resaltada en color coral frente a un gráfico circular en tres dimensiones con muchas porciones.
Comparación perceptual: unas barras sobre una base común dejan ver al instante cuál es mayor, y una sola resaltada emerge sin esfuerzo; un circular tridimensional con muchas porciones obliga a comparar ángulos y áreas, mucho más lento y menos exacto.

La jerarquía de decodificación

Cleveland y McGill midieron cuán con precisión comparan las personas distintos códigos visuales. La jerarquía va de más a menos fiable: posición compartida, posición sobre una escala no alineada, longitud, ángulo y pendiente, y por debajo área, volumen y color. Codificar cantidades por posición es lo más exacto; por volumen, lo peor.

Por qué la barra gana al circular

Un gráfico de barras codifica valores por longitud sobre una base común: el ojo las compara con precisión. Un gráfico circular los codifica por ángulo y área de porciones, mucho más difíciles de juzgar. Con pocas categorías y una dominante, el circular puede servir; para comparar, la barra manda.

El efecto pop-out

Un elemento que difiere en un solo rasgo básico emerge del fondo sin buscarlo, como una letra distinta entre círculos idénticos. Provocarlo deliberadamente —resaltar una serie en color y atenuar el resto— guía la mirada hacia donde importa. Si todo resalta, nada resalta.

Principios de la Gestalt

  • Proximidad: lo cercano se percibe como grupo.
  • Semejanza: lo que comparte color o forma se asocia.
  • Cierre: completamos figuras inacabadas; el cerebro rellena huecos.
  • Continuidad: seguimos líneas suaves antes que quiebros bruscos.
  • Figura y fondo: separamos lo que miramos de lo que sostiene la mirada.

Tinta de datos y ruido visual

Tufte definió la relación entre tinta de datos —pixeles que transmiten información— y la tinta total. Un gráfico honesto maximiza la primera y borra la segunda: cuadrículas densas, bordes en tres dimensiones, sombreados y logotipos son adorno que resta claridad. Borrar lo que no informa es diseñar.

El engaño perceptual

Ciertos trucos distorsionan lo que vemos: ejes que no empiezan en cero exageran diferencias mínimas, pictogramas de tamaño creciente engañan porque juzgamos el área y no la altura, y las escalas logarítmicas sin avisar cambian por completo la historia. La percepción se deja manipular.

Por qué importa el contexto

Ningún número significa nada aislado: doce por ciento es mucho o poco según la referencia. Una gráfica útil aporta comparación —objetivo, periodo anterior, media— para que la percepción tenga contra qué medir. Sin referente, el ojo no puede juzgar.

Ejemplo resuelto: comunicar ventas por región

Cuatro regiones vendieron 120, 95, 130 y 90 unidades, y quieres que se vea al instante quién lidera y quién se quedó por debajo del objetivo de 100. Paso a paso, aplicando la jerarquía perceptual:

  1. Codifica cada venta como una barra horizontal sobre una base común: posición y longitud se comparan con la máxima precisión.
  2. Ordena las barras de mayor a menor, para que el liderazgo no obligue a buscarlo.
  3. Resalta en color la región ganadora y atenúa el resto a gris: el pop-out hace que emerja sola.
  4. Añade una línea en el objetivo (100) como referente: sin comparación, los números no dicen si son buenos o malos.
  5. Borra rejilla densa, degradados y efecto tres dimensiones: toda tinta que no informa, sobra.

Conceptos erróneos frecuentes

  • Creer que un gráfico llamativo comunica mejor: el adorno compite con la señal y la ralentiza.
  • Pensar que el color es neutro: es un canal débil para magnitudes y excluye a daltónicos si es el único portador del mensaje.
  • Asumir que el lector verá lo importante: si hay que buscarlo con la mirada, el gráfico falló.
  • Confundir precisión con espectacularidad: un circular en relieve se ve atractivo y se lee peor.

¿Para qué sirve en la realidad?

En un panel clínico, un cuadro de mando empresarial o un informe público, decidir bien depende de que el dato crítico salte a la vista en segundos. Dominar la percepción es lo que separa una visualización que se mira de una que se entiende y acciona.

Según la jerarquía de Cleveland y McGill, ¿qué canal visual permite comparar cantidades con mayor precisión?

Un gráfico de barras suele permitir comparaciones más exactas que uno circular.

Cargar la mirada

El ojo sigue rutas: tiende a empezar arriba a la izquierda y a detenerse en lo brillante o grande. El diseñador puede dirigir ese recorrido ordenando elementos y reservando el énfasis para el hallazgo central, de modo que la conclusión se vea antes de leer el título.

Preatencional y decisiones

En un panel ejecutivo, la pregunta es de segundos: ¿algo va mal? Si la respuesta exige contar barras o leer etiquetas, el diseño falló. Lo urgente debe emerger preatencionalmente; el análisis fino viene después, con interacción o detalle.

Percepción

Procesamiento inmediato sin atención
preatencional
Jerarquía de precisión al comparar
cleveland mcgill
Un punto rojo entre azules
pop-out
Pixeles que transmiten información
tinta de datos
Adorno que resta claridad
ruido visual

Toca una tarjeta para ver la respuesta.

Relaciona cada objetivo de comunicación con el canal o principio que mejor lo resuelve.

      Ordena los canales de más a menos preciso para comparar cantidades:

      Arrastra cada ficha a su categoría (o tócala y luego toca la categoría). También puedes usar el teclado.

      Síntesis de percepción

      • Cómo leemos gráficas
        • Fase preatencional
          • color
            • longitud
              • orientación
                • movimiento
                • Jerarquía de precisión
                  • posición
                    • longitud
                      • ángulo
                        • área y volumen
                        • Gestalt
                          • proximidad
                            • semejanza
                              • cierre
                                • continuidad
                                • Honestidad
                                  • eje desde cero
                                    • sin adorno
                                      • con referente

                                    Tienes que comunicar en un pantallazo si una métrica crítica se salió de rango. ¿Qué canal preatencional usarías para que el problema grite, y qué sacrificarías del resto del gráfico?

                                    Tu texto se guarda sólo en este dispositivo.

                                    Las respuestas y tu progreso se guardan sólo en este dispositivo. Contenido firmado por su autoría mediante Lumbre.
                                    Más sobre esta lección
                                    Explora temas relacionados

                                    Conceptos

                                    Comentarios

                                    Inicia sesión para comentar.

                                    Todavía no hay comentarios. Sé la primera persona en opinar.