Destacamos Microsoft Clarity como un producto diseñado con casos de uso prácticos y reales, por expertos en productos que comprenden los desafíos que enfrentan empresas como Switas. Funciones como los clics de ira y el seguimiento de errores de JavaScript resultaron invaluables para identificar las frustraciones y los problemas técnicos de los usuarios, lo que permitió mejoras específicas que impactaron directamente en la experiencia del usuario y las tasas de conversión.
Jerarquía visual
La jerarquía visual es la disposición de los elementos en una pantalla de manera que su importancia relativa sea evidente de inmediato, incluso antes de leerlos. Se crea mediante el tamaño, el grosor, el color, el contraste, el espaciado, la posición y la agrupación, y determina el orden en que la atención se desplaza por la página. Dado que las personas escanean en lugar de leer, la jerarquía suele ser la única comunicación que se produce antes de decidir si quedarse o irse.
Una jerarquía funcional responde a tres preguntas clave en los primeros instantes de la carga de una página: ¿De qué trata esta página?, ¿Qué puedo hacer aquí? y ¿Dónde debo mirar a continuación? Cuando la jerarquía es clara, un visitante que escanea la página sin leer una frase completa puede orientarse correctamente. Cuando es plana, todos los elementos compiten por igual, la vista no tiene un camino a seguir y el visitante debe leer para comprender, algo que muchos no harán.
La jerarquía se crea tanto por la restricción como por el énfasis. Dar protagonismo a algo requiere restar protagonismo a otras cosas, razón por la cual la jerarquía se degrada previsiblemente en organizaciones donde múltiples partes interesadas reclaman un lugar en la página. El mecanismo está bien documentado: cada trimestre se promueve un nuevo elemento, nunca se degrada nada, y después de dos años la página tiene seis puntos focales que compiten entre sí y carece por completo de jerarquía. Restablecerla requiere una decisión explícita sobre la prioridad, que sea de índole organizativa más que visual.
El espacio en blanco es la herramienta más infravalorada. El espacio alrededor de un elemento lo aísla y aumenta su importancia percibida, mientras que el espacio entre grupos comunica que son elementos distintos sin necesidad de un borde o un encabezado. Las peticiones para reducir el espacio en blanco con el fin de aumentar el contenido visible sin necesidad de desplazarse suelen perjudicar más la jerarquía que el contenido adicional, ya que una página densa no comunica nada rápidamente y una página que no comunica nada rápidamente se ignora o se abandona.
La jerarquía no es puramente visual, y tratarla como tal genera problemas de accesibilidad. La estructura semántica de una página, expresada mediante niveles de encabezado, puntos de referencia y orden de lectura, es la jerarquía que transmite la tecnología de asistencia, y debe coincidir con la visual. Una página donde el elemento visualmente dominante está marcado como un div sin estilo, o donde los niveles de encabezado se eligen por su apariencia en lugar de por su significado estructural, presenta una jerarquía diferente para los usuarios de lectores de pantalla que para las personas videntes.
La jerarquía también debe sobrevivir al contenido real, que es donde la mayoría de los diseños fallan tras su lanzamiento. Un diseño que se lee con claridad con un titular de seis palabras y una imagen de producto cuidadosamente seleccionada se comporta de manera diferente con un titular de cuarenta palabras, una imagen faltante, un nombre de producto largo y tres insignias promocionales aplicadas por un equipo de merchandising. Diseñar con el rango realista de contenido, incluyendo las cadenas más largas y plausibles y los datos menos favorecedores, en lugar de con ejemplos idealizados, es lo que evita que una jerarquía se derrumbe la primera semana de su implementación. Esto también justifica la necesidad de controlar los mecanismos que permiten a personas sin experiencia en diseño añadir énfasis, ya que la capacidad ilimitada de aplicar insignias, banners y estilos de resaltado se utilizará con el tiempo hasta que el énfasis pierda su significado.
Verificar la jerarquía es sencillo y rara vez se hace. Una prueba de cinco segundos revela lo que la gente realmente se lleva de una primera impresión. Una prueba de entrecerrar los ojos, donde el diseño se difumina hasta que solo quedan formas generales, revela si sobrevive un único punto focal. Leer la página solo como un esquema de encabezado muestra si la estructura tiene sentido sin estilo visual. Estas comprobaciones son estándar en un Auditoría de experiencia de usuarioy codificando las reglas resultantes como una escala de tipo definida, una escala de espaciado y un sistema de énfasis en diseño de producto El trabajo es lo que impide que la jerarquía se erosione de nuevo a medida que se crean nuevas páginas.
Switas como se ve en
