El corte inglés y las heurísticas.
Analizando la web de elcorteingles.es
Hay muchas formas de analizar la usabilidad de una página web, pero una de las más famosas es a través de las 10 reglas heurísticas de Jakob Nielsen.
Pero espera… ¿reglas heuristi qué? Sí, las reglas de la heurística serán tus mejores amigas en cuanto a determinar la calidad con la que un usuario interactúa con un sistema o herramienta, con el fin de obtener un objetivo concreto.
En este caso voy a navegar por la web de elcorteingles.es, para identificar en qué situaciones se cumplen estos principios, y en cuáles se podría mejorar su usabilidad.
¿Cumple las reglas heurísticas?
En principio como vemos en la tabla, no.
Pero profundicemos un poco más y vayamos punto por punto (o heurística por heurística).
1º Visibilidad del estado del sistema
El sistema siempre debe mantener informados a los usuarios de lo que está ocurriendo, mediante una respuesta de información y dentro de un tiempo razonable.
No cumple
Como vemos en el vídeo, cuando navegamos por el dropdown del megamenu, no se nos muestra ningún estado del hover, no sabemos si hemos seleccionado alguna opción y no nos deja ver en qué punto de las categorías estamos.
2º Relación entre el sistema y el mundo real
El sistema debe hablar el lenguaje de los usuarios mediante palabras, frases y conceptos que sean familiares al usuario, más que con términos relacionados con el propio sistema. Seguir las convenciones del mundo real, haciendo que la información aparezca en un orden natural y lógico.
No cumple
Como podemos ver en el menú principal, se usan anglicismos, un lenguaje actual para el público familiarizado con la moda, pero habiendo otro tanto que no, pudiendo dar a confusión.
3º Control y libertad del usuario:
Hay ocasiones en que los usuarios elegirán las funciones del sistema por error y necesitarán una “salida de emergencia” claramente marcada para salir del estado no deseado al que accedieron y sin tener que pasar por una serie de pasos engorrosos. Se deben clarificar las posibilidades de deshacer y rehacer.
No cumple
Si navego hacia la opción “consulta tu pedido”, no hay ninguna opción, ni ningún botón de volver hacia la página principal desde donde entró el usuario.
La única forma de volver atrás es mediante la opción que da el navegador.
4º Consistencia y estándares:
Los usuarios no deben cuestionarse si acciones, situaciones o palabras diferentes significan en realidad la misma cosa; sigue las convenciones establecidas.
No cumple
Cuando interactuamos en el menú hamburguesa, aparece un dropdown menu, y en la mayoría de las opciones nos aparece otro dropdown. No así en ciertas opciones que para poder ver su submenú debemos pinchar y acceder a otra página.
Además en ciertas opciones el puntero del ratón cambia a cursor de escritura, pudiendo parecer al usuario que puede escribir, cuando en realidad no puede interactuar.
5º Prevención de errores:
Mucho mejor que un buen diseño de mensajes de error es realizar un diseño cuidadoso que prevengan los problemas. Antes de ejecutar una acción solicite al usuario una confirmación, como por ejemplo cancelar compra, o salir sin guardar los cambios realizados en el documento.
Cumple
Aquí podemos ver como se le pide al usuario que confirme su contraseña para evitar errores.
Y en este otro ejemplo vemos como nada más añadir un producto a la cesta, podemos cancelarlo.
6º Reconocimiento antes que recuerdo:
Minimiza lo que le pidas memorizar al usuario. Se deben hacer visibles las acciones y las opciones posibles. El usuario no tendría que recordar la información que se le da en una parte del proceso, para poder seguir adelante. Las instrucciones para el uso del sistema deben estar a la vista o estar siempre disponibles cuando sean necesarias.
No cumple
Al igual que en la primera heurística, si navegamos por el menú, nos aparecen varios submenús, y al no existir el estado del hover es más difícil saber en qué punto del menú estamos.
Este es un claro ejemplo de que un error puede pertenecer a varias heurísticas a la vez.
7º Flexibilidad y eficiencia de uso:
La presencia de atajos, que no son vistos por los usuarios novatos, pueden ofrecer una interacción más rápida a los usuarios avanzados. Esta interacción es más eficaz que la que el sistema puede proveer a los usuarios de todo tipo. Se debe permitir que los usuarios adapten el sistema para usos frecuentes. Como por ejemplo los atajos del teclado mediante combinación de teclas.
Cumple
Como podemos ver en el vídeo, si introducimos un texto en el buscador, éste automáticamente nos da varias opciones. Es lo que llamamos un texto predictivo.
8º Estética y diseño minimalista:
Los diálogos no deben contener información que es irrelevante o poco utilizada. Cada unidad extra de información en un diálogo, compite con las unidades de información relevante y disminuye su visibilidad relativa.
No cumple
La página muestra un montón de fotos, cards y banners apelmazados, no existen bloques de información o secciones evidentes que faciliten el escaneo de la página.
9º Ayudar a los usuarios a reconocer, diagnosticar y recuperarse de los errores:
Los mensajes de error se deben mostrar en un lenguaje claro y simple, indicando en forma precisa el problema y sugiriendo una solución constructiva al problema.
No cumple
A el usuario no se le ofrecer una mejor solución o alternativa al error de la página, ya que tiene disponible el buscador, sin embargo, se le podría dar un mensaje con orientación a esa alternativa, puesto que si no, las demás opciones son, o ir atrás a través del navegador o volver a introducir la dirección en la barra de direcciones.
10º Ayuda y documentación:
Incluso en el mejor de los casos en donde el sistema puede ser usado sin tutoriales, podría ser igualmente necesario ofrecer ayuda y documentación. Dicha información debería ser fácil de encontrar, estar pensada para el usuario, y debe tener una lista concreta de pasos a seguir sin ser demasiado extensa.
Cumple
En este caso, en la subsección ayuda, se da bastante información y queda todo bastante claro para el usuario. Además nos ofrece un buscador con texto predictivo.
Conclusiones:
Aunque a primera vista una web nos puede parecer que está bien, lo cierto es que si ahondamos un poco y con estas sencillas reglas, podemos ver que no es oro todo lo que reluce.
A veces no nos damos cuenta de los beneficios que aportan tener en cuenta los principios heurísticos en los diseños de interfaces.
