¿Cumple la web de los 100 Montaditos con los principios heurísticos?

Introducción

María Pardo Furió
8 min readOct 23, 2020

El objetivo de este artículo es conocer e interiorizar las heurísticas de Nielsen, para reconocer las buenas prácticas e identificar puntos de mejora en relación a la usabilidad. En concreto, se va a analizar la famosa franquisicia española “100 Montaditos”.

En resumen, las heurísticas de Jakob Nielsen se refiere a lo sencillo o complicado que puede ser el uso de la interfaz, para evitar las frustraciones que el usuario podría tener al utilizar el sistema.

Los 10 principios Heurísticos de Jakob Nielsen:

  1. Mostrar el estado del sistema. El sistema siempre debe mantener a los usuarios informados sobre lo que está pasando, a través de una retroalimentación apropiada en un tiempo razonable.
  2. Hablar el lenguaje del usuario. El sistema debe hablar el lenguaje de los usuarios, en lugar de términos orientados al sistema. Además, debe seguir las convenciones del mundo real, haciendo que la información aparezca en un orden natural y lógico. Es decir, las palabras, frases y conceptos utilizados deben ser familiares para el usuario.
  3. Control y libertad del usuario. Los usuarios deben sentir que tienen el control en todo momento. Como navegar libremente, encontrar salidas fácilmente y rutas alternativas.
  4. Consistencia y estándares. Los usuarios no deben tener que preguntarse si las diversas palabras, situaciones o acciones significan lo mismo. Se debe seguir un estándar y ser consistentes con las decisiones que tomamos a lo largo de toda la plataforma.
  5. Prevenir errores. Mejor que comunicar correctamente un error, es ayudar a los usuarios a no cometer errores, ya que la mayoría de ellos son previsibles.
  6. Aliviar la carga en la memoria del usuario. El usuario no debería tener que recordar información de una parte a otra. Las instrucciones de uso del sistema deberían ser visibles o fácilmente accesibles cuando sea necesario.
  7. Flexibilidad y eficiencia de uso. Los aceleradores, no vistos por el usuario principiante, mejoran la interacción para el usuario experto de tal manera que el sistema puede servir para usuarios inexpertos y experimentados.
  8. Estética y minimalismo. Eliminar el ruido visual, es decir, eliminar información irrelevante o que no se suele utilizar.
  9. Comunicar errores con claridad. Los mensajes de error deben estar expresados en un lenguaje claro, indicando con precisión el problema y sugiriendo una solución.
  10. Ayuda y documentación. Es necesario proveer al usuario de ayuda y documentación. Esta tiene que ser fácil de encontrar y preferentemente, orientada a tareas concretas.

Según Nielsen, si una web cumple con todas estas características, significa que dispone de una buena usabilidad, así que vamos a ver si la web de los 100 Montaditos cumple dichas pautas o no. Pero antes de ello, vamos a hacer un breve resumen del local, por si alguien todavía no sabe lo que es.

Los 100 Montaditos surgieron en el año 2000 en Huelva, como un nuevo concepto gastronómico. Su divertida forma de hacer los pedidos, junto con la gran variedad de productos que ofrece ha hecho que con el paso del tiempo se convierta en una gran franquicia con locales por toda España. Esta forma de entender la gastronomía española junto con el entorno de diversión y sorpresa han hecho que haya conquistado el mercado nacional.

Análisis Heurístico

  1. Mostrar el estado del sistema.

A pesar de tratarse de un proceso bastante lento, la web presenta una pantalla de carga con el logo y una barra superior que se va completando. Por todo lo demás, su estructura es muy sencilla y no necesita más indicadores de carga.

2. Hablar el lenguaje del usuario.

La página web utiliza un lenguaje sencillo y claro para comunicarse con sus usuarios. Este lenguaje queda muy bien reflejado en el video publicitario que han añadido para recordar a los clientes que han vuelto a abrir sus establecimientos después del Covid19. Además, el uso de exclamaciones invita a los usuarios a que vuelvan a consumir en sus locales o bien si lo prefieren, la entrega a domicilio.

“¡Ya estamos abiertos!”

“¡Tus montaditos te esperan!”

“¡Llévatelo a casa!”

En concreto, en este apartado podemos ver que utiliza dos palabras en inglés, “take away” y“delivery”, las cuales podrían causar algún tipo de confusión para algunos clientes. Sin embargo, estas expresiones indican que se dirigen a un público joven familiarizado con estos anglicismos.

Finalmente, la última incongruencia se encuentra en “Encuentranos” donde aparece también contenido de la página web en inglés.

3. Control y libertad del usuario.

Cuando entras a la página web por primera vez aparece un video, y como se ha explicado anteriormente, consiste en recordar a los usuarios que sus locales han vuelto a su funcionamiento. Cuando ves el video por primera vez te parece interesante, pero esta acción empieza a cansar cada vez que vuelves a la página principal, ya que el video empieza a reproducirse automáticamente y si no cierras la ventana no puedes realizar otra acción.

Otro de los apartados que no cumple con esta heurística lo podemos encontrar cuando queremos buscar un local. Se encuentran ordenados por provincias, pero una vez dentro, no siguen ningún tipo de orden. Por tanto, cuando se trata de una provincia con muchos establecimientos, como Madrid, resulta un poco complicado encontrar el que más te podría interesar.

Además, en el apartado de “Promociones”, puedes seleccionar “Consultar condiciones”, pero el problema viene que cuando pinchas y entras, la pantalla se queda en blanco, pudiendo causar confusiones a los usuarios, ya que hasta que no haces scroll hacia abajo, no puedes ver el contenido.

4. Consistencia y estándares.

Aquí también podemos encontrar bastantes incoherencias. Principalmente, destaca el uso de botones con diferentes colores, formas y degradados, los cuales no siguen ningún tipo de patrón.

Entre estos botones destacamos el que se encuentra en el menú superior, “Encuentranos”, ya que resulta un poco complicado de leer con el degradado que se ha utilizado.

Otro punto a destacar lo encontramos en la carta, donde hay apartados que empiezan con mayúsculas y otros en minúsculas.

Por último, el menú sticky cada vez que hacemos scroll aparece de una forma distinta. Algunas veces aparece con un fondo negro y otra con una imagen.

5. Prevenir errores.

Como sabemos, las heurísticas son interpretables, se interrelacionan, y un mismo error puede asociarse a varias heurísticas, por ello, en esta heurística me he centrado en algunos errores de diseño y accesibilidad que pueden influir negativamente en la experiencia del usuario.

En primer lugar, vamos a comentar todos los problemas relacionados con su lectura.

La letra que se utiliza para la carta es muy pequeña, dificultando su lectura. Además, el tipo de letra utilizado tampoco ayuda.

Como se ha comentado en el apartado anterior, la elección de colores para los botones con degradados también dificultan su lectura.

Además, encontramos fotografías con texto por encima, texto por encima de texto y nombres completamente cortados.

Otro error que algunas veces impide leer el contenido se encuentra en los iconos de las redes sociales. Cuando haces clic en alguno de ellos, aparece una tooltip indicando el nombre de la red social que no desaparece hasta que no se vuelve a clicar en otro sitio, por tanto, si haces scroll, se sobrepone al resto de contenido y no te permite leerlo.

Finalmente, cuando quieres consultar la carta, aparecen en la parte superior las secciones más importantes, pero no corresponde con el contenido completo de la carta, confundiendo por tanto al usuario sobre qué puede pedir o no.

6. Aliviar la carga en la memoria del usuario.

Mientras estás navegando por la red, es imposible saber en qué parte te encuentras, ya que no hay ninguna forma de recordar al usuario en qué apartado ha entrado dentro del menú.

7. Flexibilidad y eficiencia de uso.

El usuario puede navegar por la web utilizando el tabulador.

8. Estética y minimalismo.

A pesar de que la web intenta seguir una estética y un orden, donde predominan los espacios en blanco y el uso de dicho color, vemos que en algunos apartados no se cumple.

Cuando entras en “Abre tu 100 Montaditos” aparece una gran cantidad de información toda junta, donde se pierde completamente toda la estética que se ha utilizado en el resto de la web.

Otro apartado donde la estética, o más bien, la forma en la que se ha organizado la web no funciona es en “Promociones”. No está claro a qué fotografía corresponde cada texto, llevando a confundir completamente al usuario.

9. Comunicar errores con claridad.

La web cuenta con una página de error indicando que la página no ha sido encontrada. Ofrece alternativas con un buscador, sin embargo, este copy se muestra en otro idioma, incurriendo en la heurística “Hablar el lenguaje del usuario”.

Aunque también indica que la página web no puede cargar correctamente Google Maps, y este problema se podría haber evitado.

10. Ayuda y documentación.

Por último, el usuario también dispone de un correo electrónico y un teléfono de contacto, en caso de necesitarlo.

Resumen Análisis Heurístico:

¿Cumple la página web de los 100 Montaditos el análisis heurístico?

En definitiva, a grandes rasgos, podemos decir que la web de los 100 Montaditos no cumple con el análisis heurístico, tratándose por tanto de una web con muchas incoherencias que hace que muchas veces el usuario no encuentre lo que quiere o no tenga una buena experiencia con su interfaz.

--

--