Diez ejemplos básicos de mala usabilidad
Según los 10 principios heurísticos de Jakob Nielsen
La evaluación heurística es el método de análisis de la usabilidad sin usuarios, a partir de los principios de relación que se establecen entre la persona y la máquina. Trata de comprobar si se cumple una serie de heurísticas, para dotar de mejor usabilidad a la interfaz.
Expongo a continuación los 10 principios heurísticos que definió Jacob Nielsen en 1995, y los acompaño de un mal ejemplo por cada principio:
1) Visibilidad del estado del sistema
El sistema debe siempre hacerte saber lo que está pasando, dónde estás, qué estás haciendo, cuándo y cómo estás. Y en un periodo de tiempo razonable.
✖ ️ En la web de Alsa el usuario no puede saber su recorrido en ningún momento de la navegación al no incluir el diseño de la web breadcrumbs.
2) Hablar el lenguaje del usuario
El sistema debe utilizar palabras, frases y conceptos familiares para el usuario. Si lo común es que te aparezca la opción de compra debajo del precio, la web debe respetar ese orden natural y lógico.
✖ ️ En la web de la sala Equis, al navegar en la taquilla, resulta muy complicado saber dónde hacer clic para comprar una entrada de cine. Pasa un rato hasta que descubres el camino a seguir (la hora de sesión) y una vez seleccionada la hora y elegido el número de entradas, te aparece el precio. Pero sorpresa, aquí no te aparece la opción de comprar. Tardas un tiempo hasta darte cuenta de que tienes que seleccionar la categoría “Elegir butacas” que está en la parte superior derecha para proseguir con la compra.
3) Control y libertad del usuario
A ti, como usuario, te tienen que permitir coger la sartén por el mango. Debes navegar libremente: libertad para deshacer, explorar o interrumpir. Y debes encontrar fácilmente salidas y rutas alternativas.
✖ ️ En la web de Inditex te obligan a aceptar las cookies sin opción a configurar la información guardada de tu navegación.
4) Consistencia y estándares
La plataforma debe seguir un estándar y ser consistente con las decisiones que tomamos a lo largo de toda navegación. No deberían hacer que te preguntes si un icono significa lo mismo en distintos sitios.
✖ ️ En la home de Eroski utilizan un icono de una manzana para redirigirnos al “súper online”, una vez estamos en la página del súper, el mismo icono pero con el ancho brevemente alargado, nos dirige a la sección de “productos frescos”.
5) Prevenir errores
La buena usabilidad previene al usuario del error. La mayoría de los errores son previsibles. Se puede ahorrar los errores en el ingreso de datos y la pérdida de datos.
✖ ️ En la página para solicitar el carné de la biblioteca del Ayto. de Madrid ¿Sabes si debes de introducir la letra del DNI? ¿tendrás que repetir la tarea de rellenar el formulario de nuevo? Estas preguntas no te las tienes que hacer cuando se hace uso de cajas de texto con opacidad.
6) Aliviar la carga en la memoria del usuario
El usuario no debería tener que recordar la información de una parte a otra. El sistema debe de recordar objetos, acciones y opciones al usuario.
✖ ️ Si entras en una página como Thomman a buscar un Big Muff (pedal de efecto fuzz para guitarra), al regresar a la página y empezar a escribir su nombre debería de aparecer su nombre. Campos que se autocompletan según tus últimas búsquedas podrían minimizar la información que debes recordar.
7) Flexibilidad y eficiencia de uso
La interacción del usuario se puede acelerar con atajos y/o recomendaciones tanto a usuarios sin experiencia como con experiencia. (Aceleradores — atajos de teclado — recomendaciones)
✖ ️ Si tienes la mala suerte de estar desempleado sabrás que tienes que fichar en el SEPE cada x tiempo, trámites comunes como renovar la demanda de empleo deberían de estar a mano en la misma página de “Gestión telemática de la demanda de empleo” de la Comunidad de Madrid.
8) Estética y minimalismo
Eliminar el ruido visual, jerarquizar la información y eliminar la información irrelevante o que no suele utilizarse.
✖ ️ Puedes contemplar la página de Kiko Veneno como si fuera una obra de arte abstracta, pero si lo que buscas es realizar una tarea lo vas a tener difícil, casi no se distinguen los enlaces.
9) Comunicar errores con claridad
- Que sean fáciles de reconocer visualmente.
- Explicar el problema con claridad.
- Proveer una solución o camino a seguir.
- Proponer una alternativa.
✖ Al navegar en la web de Telecinco si no encuentra una página, aparece Error 404 sin darte posibilidad de rectificar o recuperarte.
10) Ayuda y documentación
El usuario necesitará en ocasiones ayuda y documentación. Se recomienda hacer tour en pantalla, tener soporte y ofrecer aprendizaje de forma fácil.
✖ ️️ Reconozco que soy incapaz de averiguar qué tipo de información falta para solucionar el error. En la página de la Junta de Andalucía si quieres entrar en la página de “Presentación electrónica general” sale un error algo difícil de interpretar.
Tabla resumen:
Conclusión:
En el fondo, a todos nos gusta perdernos alguna vez, pero nunca si nos sentimos desconcertados. Nos gustan las sorpresas, pero no cuando estas implican cambios inesperados en nuestra tarea. Sabemos que a nadie le gusta perder el tiempo y que nadie lee las instrucciones, si no es fácil, lo intentamos un poco, y si no, abandonamos frustrados.
Los patrones de diseño más estandarizados son nuestros amigos y nunca podemos culpar al usuario de no saber utilizar nuestra plataforma.
Hay teorías sobre principios heurísticos más allá de Nielsen, este articulo ha sido para mí una breve introducción a sus heurísticas que espero próximamente ampliar. No obstante, estoy seguro, y hemos de tener en cuenta, mientras termino estas lineas están naciendo nuevos principios de usabilidad ligados al progreso tecnológico. Ahí lo dejo: Ojo avizor 🔎
Referencias: Jacob Nielsen, “10 Usability Heuristics for User Interface Design”
