wandres.dev
VISUALIZACIÓN DE DATOS III · Elegir la representación

La jerarquía de precisión perceptual

El experimento de Cleveland y McGill de 1984, el orden medido de los canales visuales, sus extensiones y réplicas posteriores, y qué se puede y qué no se puede concluir de él.

⏱ 19 min

Que la posición se lea mejor que el ángulo no es una opinión de diseño: es un resultado experimental, publicado en 1984, replicado varias veces desde entonces, y con un error medido para cada canal. Esta es probablemente la pieza de conocimiento con mejor relación entre lo poco que cuesta aprenderla y lo mucho que cambia el trabajo de quien la sabe.

🎯 Al terminar esta lección sabrás
  • Describir el experimento de Cleveland y McGill y cómo midieron el error.
  • Enumerar el orden de precisión de los canales visuales para datos cuantitativos.
  • Situar las extensiones posteriores para datos ordinales y nominales.
  • Delimitar qué preguntas responde la jerarquía y cuáles no.

El experimento

William Cleveland y Robert McGill publicaron en 1984, en el Journal of the American Statistical Association, un artículo titulado «Graphical Perception: Theory, Experimentation, and Application to the Development of Graphical Methods». Su punto de partida es una idea sencilla y radical: leer un gráfico es realizar una tarea perceptual elemental, y esas tareas se pueden aislar, medir y ordenar.

Identificaron una lista de tareas elementales (juzgar posiciones sobre una escala común, longitudes, ángulos, áreas, volúmenes, tonos) y diseñaron experimentos donde sujetos humanos veían pares de marcas gráficas y tenían que responder a una pregunta cuantitativa: qué porcentaje representa la marca menor respecto a la mayor.

La medida del error es el detalle que hace el trabajo sólido. No usaron el error absoluto, sino una transformación logarítmica del error, del orden de log2(|estimado - real| + 1/8). La razón: los errores de estimación son multiplicativos, no aditivos, así que promediarlos en escala lineal daría un peso desproporcionado a los casos con valores grandes. El sumando de un octavo evita el logaritmo de cero cuando alguien acierta exactamente.

Con esa medida compararon representaciones concretas que difieren solo en el canal usado: un gráfico de barras agrupadas (posición sobre una escala común) contra uno apilado (longitud sin línea base común), y un gráfico de barras contra uno de tarta (ángulo). Y midieron cuánto peor lo hacía la gente con cada uno.

La jerarquía

El orden resultante, de más preciso a menos, para datos cuantitativos:

Puesto Canal Dónde aparece
1 Posición sobre una escala común Dispersión, barras, líneas con eje compartido
2 Posición sobre escalas no alineadas Pequeños múltiplos, paneles con eje propio
3 Longitud Barras apiladas, barras sin línea base común
4 Pendiente y ángulo Tarta, gráfico de pendiente, agujas
5 Área Burbujas, treemap, cartograma
6 Volumen y curvatura Cualquier gráfico en 3D
7 Sombreado y saturación de color Mapas de calor, coropletas

Tres lecturas concretas de esa tabla, que son las que se usan a diario:

Un gráfico de barras agrupadas se lee mejor que uno apilado. En el agrupado, todas las barras arrancan de la misma línea base, así que comparar es juzgar posiciones sobre una escala común, el puesto uno. En el apilado, solo la serie inferior tiene línea base común; las demás flotan, y compararlas es juzgar longitudes, el puesto tres. Ese es el respaldo experimental de lo que se afirmaba en qué gráfico para qué pregunta.

Un gráfico de barras se lee mejor que uno de tarta. Puesto uno contra puesto cuatro. No es cuestión de gusto ni de modas.

Un mapa de calor es la peor forma de comunicar una magnitud precisa y la mejor de mostrar un patrón en cien celdas. El puesto siete es el precio de la densidad.

El trabajo tuvo dos continuaciones importantes. En 1986, Jock Mackinlay extendió el ranking a datos ordinales y nominales en un artículo sobre generación automática de presentaciones gráficas, y el orden cambia: para datos nominales, después de la posición vienen el tono, la textura y la conexión, mientras que la longitud y el ángulo caen al fondo. Tiene sentido: preguntarle a alguien «cuánto vale este color» es absurdo, pero «son estos dos del mismo grupo» se responde con el color de forma inmediata.

En 2010, Jeffrey Heer y Michael Bostock replicaron los experimentos originales mediante trabajo distribuido en una plataforma de microtareas, con muchos más sujetos de los que un laboratorio permite, y confirmaron la ordenación. Además extendieron el estudio a canales que Cleveland y McGill no cubrieron, como el área rectangular de los treemaps y las variaciones de luminosidad y saturación.

Lo que la jerarquía no dice

Aquí es donde la mayoría de la gente que cita el ranking se equivoca, y donde vale la pena ser preciso.

Mide una sola tarea: estimar la razón entre dos magnitudes. No mide la velocidad de encontrar un elemento, ni la capacidad de detectar una tendencia, ni la de agrupar elementos parecidos, ni la de recordar el gráfico media hora después. Para esas tareas hay otros trabajos y otros órdenes.

No dice que los canales de abajo estén prohibidos. Dice que codifican con menos precisión. Si tu pregunta es «cuál es el máximo» y no «cuánto vale exactamente», un mapa de calor la responde perfectamente y muestra diez veces más datos que un gráfico de barras.

No escala. La posición es el canal más preciso y también el que consume más espacio: cada dato necesita su sitio. Con cien mil puntos no hay posiciones distinguibles y la precisión del canal deja de importar, porque el problema pasa a ser el solapamiento. Ahí ganan el color y la densidad, que están al final de la lista.

No cubre la combinación de canales. Un gráfico real codifica varias variables a la vez, y hay interferencias: usar el tamaño y el color en las mismas marcas hace que el tamaño se lea peor de lo que la lista sugiere.

Y una consecuencia cuantitativa que sí está medida y que conviene tener presente: la ley potencial de Stevens, de 1957, dice que la magnitud percibida crece como una potencia de la magnitud física, con un exponente que depende del canal. Para la longitud el exponente está cerca de uno, así que percibimos las longitudes casi sin sesgo. Para el área ronda 0,7, lo que significa que subestimamos sistemáticamente las diferencias de área.

Eso tiene una implicación directa sobre lo que se decía en la escala de raíz cuadrada: escalar el radio por la raíz del valor es la corrección geométrica, la que hace que el área sea proporcional al dato. No es la corrección perceptual, porque el lector sigue subestimando. En cartografía se propusieron desde los años setenta compensaciones que exageran ligeramente los símbolos grandes para contrarrestar el efecto; siguen siendo discutidas, porque corrigen la percepción a costa de que el área ya no sea proporcional al dato. La lectura práctica es más simple: si necesitas que el lector estime magnitudes, no las codifiques con área.

Del ranking a las decisiones de código

La jerarquía se convierte en decisiones concretas en el momento de escribir el gráfico:

Reserva la posición para la variable de la que trata la frase. Si la pregunta es sobre el importe, el importe va en un eje. No en el tamaño de un círculo ni en la intensidad de un color.

Si necesitas comparar valores entre series, no apiles. Agrupa, o usa pequeños múltiplos con escala compartida, que es el puesto dos y sigue siendo bueno.

Cuando uses un canal de la mitad baja, etiqueta. Un treemap con los valores escritos dentro de los rectángulos grandes convierte una lectura de área imprecisa en una lectura de texto exacta para los elementos que importan, y deja el área haciendo lo que hace bien: mostrar el reparto de un vistazo.

No uses dos canales para lo mismo. Codificar el valor a la vez con la altura de la barra y con la intensidad del color no aporta precisión: la altura ya es el puesto uno y el color no puede mejorarla. Sí es útil cuando el color codifica otra variable, o cuando cumple una función de accesibilidad y no puede ser el único canal.

La jerarquía es una escala de precisión, no una norma de estilo, y aplicarla como norma produce gráficos peores

El uso más habitual del ranking de Cleveland y McGill es también el más equivocado: tratarlo como una lista de lo que está bien y lo que está mal. «La tarta es el puesto cuatro, así que la tarta está prohibida.» Eso no es lo que dice el experimento, y usarlo así lleva a decisiones malas de tres formas.

Primera: ignora la densidad. El experimento midió pares de marcas aisladas. Un gráfico real tiene cientos o miles. En cuanto la densidad sube, el canal más preciso deja de serlo porque las marcas se solapan y la precisión teórica del canal es irrelevante frente al hecho de que no ves nada. Un mapa de calor de mil celdas comunica más que un gráfico de barras de mil barras, aunque el color esté en el puesto siete y la posición en el uno.

Segunda: ignora la tarea real. Casi ninguna lectura de gráfico consiste en estimar la razón entre dos marcas. Consiste en detectar una anomalía, en localizar el mayor, en ver si hay tendencia, en comparar la forma de dos curvas. Para localizar rápidamente un valor extremo entre cien, el color lo hace mejor que la posición, porque un color distinto salta a la vista sin búsqueda y una barra un poco más alta hay que buscarla.

Tercera: ignora que el lector puede leer las etiquetas. Si los cuatro sectores de una tarta llevan su porcentaje escrito, la precisión del canal angular pasa a ser secundaria: la lectura exacta la da el texto y el gráfico aporta la impresión de reparto. El ranking mide la decodificación visual, y el texto es un canal aparte que no aparece en la lista.

La forma correcta de usar la jerarquía es como presupuesto: tienes un canal de puesto uno y hay que gastarlo bien. Dáselo a la variable de la que trata la frase del gráfico. Las variables secundarias se van a canales peores, y eso está bien, porque son secundarias.

Y el corolario que vale para todo el nivel: el ranking te dice cuánto cuesta cada decisión de codificación, no qué gráfico hacer. Un gráfico que codifica la variable principal con área y la secundaria con posición no está prohibido por ninguna norma: simplemente ha gastado su mejor canal en lo que menos importa, y ese es el error. Formularlo así, como asignación de un recurso escaso, evita a la vez el dogmatismo y el descuido.

⚔️ Reto práctico

Reproduce el experimento a pequeña escala. Genera diez pares de valores con razones conocidas y dibújalos tres veces: como barras con línea base común, como sectores de una tarta y como círculos con área proporcional. Pide a cinco personas que estimen la razón de cada par en las tres versiones y calcula el error logarítmico medio de cada representación. El orden que obtengas va a ser el de la tabla, y haberlo medido tú cambia cómo defiendes una decisión de diseño en una reunión.