Evaluación Heurística (PARTE I)
Metodología de inspección de la usabilidad sin usuarios que consiste en examinar la calidad de uso de una interfaz a partir del cumplimiento de unos principios heurísticos.
En el pasado mes de marzo hablábamos sobre los Recorridos cognitivos. Siguiendo con la colección de posts sobre ‘Metodologías de UX’, esta vez nos toca poner foco en otros métodos de inspección como son la Evaluación Heurística. Que probablemente sean, junto a los propios ‘Test con usuarios’, las técnicas más populares y extendidas en el universo de la Ingeniería de la Usabilidad.
Este post se divide en dos publicaciones: en la primera parte se explican los fundamentos teóricos de las evaluaciones heurísticas, junto con un repaso de cada uno de los heurísticos de Nielsen y Molich (acompañados de ejemplos reales de buenas y malas prácticas); y por otro lado, la segunda parte se centra en conocer qué metodología usar para llevar a cabo evaluación heurística, así como presentar sus resultados.
¿Qué es una Evaluación Heurística?
Una Evaluación Heurística (EH) es un método de inspección de la usabilidad sin usuarios. Este, consiste en examinar la calidad de uso de una interfaz por parte de varios evaluadores expertos, a partir del cumplimiento de unos principios reconocidos de usabilidad: los heurísticos.
Al igual que los Walkthroughs, el principal objetivo de la EH es medir la calidad de la interfaz de cualquier aplicativo en relación a su facilidad para ser aprendido y usado por primera vez. Sin embargo, mientras los primeros se centran en la consecución de tareas, las EH inspeccionan problemas potenciales . Ya que el evaluador se pone en la piel del usuario real del sistema, intentando predecir los errores que podrá encontrarse.
Tipos de Evaluación Heurística
El origen de los principios heurísticos como tales se presentaron en una primera versión en 1990 por Jakob Nielsen y Rolf Molich, en el libro ‘Improving a human-computer dialogue‘. Años más tarde, en su libro ‘Usability Inspection Methods’ (1994) , Nielsen los revisó y resumió, para crear así sus célebres ’10 Principios Heurísticos de Nielsen’.
Aunque estos últimos sean probablemente los heurísticos más populares y utilizados, existen multitud de listas creadas por otros expertos del sector que son igualmente válidas y útiles. Simplemente, se deben valorar cuáles son las más adecuadas según la interfaz, el dispositivo y el contexto de uso a analizar.
Algunas de las más significantes son:
- Las ‘8 reglas de oro’ de Ben Schneiderman, de su libro ‘Designing the User Interface: Strategies for Effective Human-Computer Interaction’ (1987).
Estas ocho reglas fueron el embrión para que posteriormente Molich y Nielsen presentaran sus diez principios. - La ‘Lista de comprobación de ítems’ de Deniese Pierotti (2004). Esta lista utilizada por la empresa Xerox Corporation para evaluar la usabilidad de interfaces, se caracteriza por añadir tres principios heurísticos más a los de Nielsen:
Habilidades: el sistema debe apoyar, ampliar, complementar o mejorar las habilidades del usuario, conocimientos básicos y experiencia, y no sustituirlas.
Interacción placentera y respetuosa con el usuario: la interacción del usuario con el sistema debe mejorar la calidad de su vida. El usuario debe ser tratado con respeto. El diseño debe ser estéticamente agradable, tanto como valor artístico, así como funcional.
Privacidad: el sistema debe ayudar al usuario a proteger la información personal o privada, tanto la que pertenece al usuario como la que pertenece a sus clientes. Además, para cada uno de ellos, detalla una serie de sub-heurísticas basadas en preguntas concretas que ayudan en la búsqueda de errores de usabilidad
- Los ‘First Principles of Interaction Design’ de Bruce Tognazzini (2003).
- Los ‘Principios heurísticos de D. Mayhew’ de su libro ‘The Usability Engineering Lifecycle’ (1992).
- Los ‘Principios heurísticos de Larry Constantine’, de su libro ‘Software for use’ (1994).
- Los ‘Principios heurísticos de Keith Instone’, de su informe ‘Usability engineering for the web’ (1996).
- Los ‘Principios de Ingeniería cognitiva’ de Jill Gerhardt-Powals (1996).
Los 10 Principios Heurísticos de Nielsen
A continuación se presentan uno por uno los principios heurísticos postulados por Jakob Nielsen.
Para entender cómo se deben aplicar en la evaluación de la usabilidad de un sistema interactivo, se añadirán para cada uno, ejemplos de buenas y malas prácticas de webs y aplicaciones reales:
1-Visibilidad del estado del sistema
El sistema siempre debe mantener a los usuarios informados sobre lo que ocurre, a través de una retroalimentación apropiada en un tiempo razonable.
- Buena práctica: En la web de Vueling el usuario sabe en todo momento el estado del sistema. Se le informa qué información ha buscado previamente y en qué página del proceso de compra se encuentra. Es importante indicar siempre dónde se encuentra el usuario respecto a la estructura de la página, así cómo de dónde viene y hacia dónde puede ir.
- Mala práctica: En la web de compra on-line de FNAC, aunque a priori se indica dónde se encuentra el usuario mediante breadcrumbs y títulos de página, es confuso que no se seleccione ninguna opción de menú cuando se navega por él.
2 -Empate entre el sistema y el mundo real
El sistema debe hablar en el lenguaje del usuario, con palabras, frases y conceptos familiares para él. Utilizar convenciones del mundo real, haciendo que la información aparezca en un orden natural y lógico.
- Buena práctica: En todas las páginas donde se debe hacer una búsqueda por fecha, se usa (con más o menos variantes) el ya clásico datepicker. Su uso y apariencia están tan interiorizados por todos los usuarios, que se ha convertido en un estándar.
Así mismo, también lo hace Airbnb en su buscador principal.
- Mala práctica: Una muy mala práctica referente a este heurístico, es el uso de un vocabulario o jerga que no sean familiares al lenguaje que suelen usar los usuarios.Por ejemplo, en la web de British Airways con el idioma ‘español’ seleccionado, el calendario aparece en el sistema anglosajón, mostrando el ‘Domingo’ como primer día de la semana. Este detalle seguramente será confuso para el usuario hispanohablante medio.
3-Control y libertad del usuario
A menudo los usuarios eligen funcionalidades por error y necesitan una ‘puerta de emergencia’ para salir del estado indeseado. Ofrecer soporte para deshacer y rehacer acciones.
- Buena práctica: A veces cuando se realiza una acción (como por ejemplo la de suprimir un producto de un carrito de compra) es mejor permitir deshacer la acción que preguntar a través de un molesto aviso si realmente se quiere suprimir dicho producto.
Gmail lleva años permitiendo deshacer la acción de envío de correos electrónicos, evitando así esos embarazosos correos con destinatario erróneo.
- Mala práctica: Una mala práctica muy común la encontramos en los anuncios en portales de vídeo como Youtube. Por un lado se permite correctamente al usuario “Saltar el anuncio”, pero por el otro se limita su libertad de interacción al intentar navegar por la barra de control del video.
4-Consistencia y estándares
Los usuarios no deben tener que preguntarse si las diversas palabras, situaciones, o acciones significan las misma cosa. Que se sigan las normas y convenciones de la plataforma sobre la que está implementando el sistema.
- Buena práctica: La consistencia es una de la claves, por no decir LA CLAVE, a la hora de diseñar UI’s usables. Un elemento, como por ejemplo un botón de acción, debe verse exactamente igual en todas las pantallas de la web. Esto hace que se limiten el número de acciones y operaciones que se representan, asegurando que los usuarios no deban aprender nuevas funcionalidades en cada tarea que realicen. Una de las principales ventajas de utilizar frameworks de diseño front-end, como por ejemplo Bootstrap, es que la consistencia de todos sus elementos está asegurada.
- Mala práctica: Un mal ejemplo de aplicación de la consistencia y los estándares lo encontramos en la tienda online de Pull&Bear. Dónde sitúan el formulario de búsqueda en una zona muy poco común para esta finalidad: la parte izquierda, justo antes del logotipo de la marca. Situemos siempre los elementos dónde los usuarios esperan encontrarlos.
5-Prevención de errores
Antes que diseñar buenos mensajes de error, es mejor evitar que el problema ocurra.
- Buena práctica: Un escenario clásico donde ocurren muchos errores es en la validación de formularios. Esto ocurre cuando no se informan debidamente los requisitos de cada campo, y el usuario obtiene errores no esperados. Como ejemplo de formulario bien diseñado encontramos el del proceso de ‘Registro’ de Facebook. Dónde en todo momento se indican los detalles necesarios para completar cada campo.
- Mala práctica: Sin embargo, en el formulario de alta de la web de Correos no se informa de las características que debe tener cada campo. Cosa que hace que hasta que el usuario no valida el formulario, éste no sabe que por ejemplo el campo ‘Contraseña’ debe tener un mínimo 8 caracteres.
6-Reconocimiento mejor que recuerdo
Minimizar la carga de memoria del usuario haciendo que los objetos, las acciones y las opciones estén visibles. El usuario no debería tener que recordar la información de una parte del diálogo a otra.
- Buena práctica: Siempre se deben indicar los campos por los cuales se ha realizado una búsqueda. Por ejemplo, en la página web de Atrápalo se muestra una leyenda en la parte superior con los parámetros por los cuales se ha buscado un hotel.
- Mala práctica: Sin embargo, en la web de Wallapop no se especifican claramente los conceptos ni los filtros a modo de resumen. Obligando así al usuario a revisar distintas zonas de la pantalla para recordar qué había buscado previamente.
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. Es importante que el sistema permita personalizar acciones frecuentes.
- Buena práctica: Los atajos de teclado (shortcuts) son el clásico ejemplo de ‘aceleradores’ que mejoran la interacción de los usuarios expertos. Permitiendo así realizar acciones de manera más rápida y automatizada. Por ejemplo, Twitter, como hacen muchas otras webs, proporciona los siguientes:
- Mala práctica: En este sentido, se deben evitar casuísticas y acciones que afecten considerablemente al tiempo que invierte el usuario para llevarlas a cabo. Por ejemplo, el típico formulario en el que si una vez se valida y existe un error, se borran todos los campos previamente informados. Comportando que el usuario pierda el tiempo y en definitiva, la paciencia.
8-Diseño estético y minimalista
Los diálogos no deberían contener información irrelevante o que se necesite raramente. Cada unidad extra de información en un diálogo compite con la información importante, disminuyendo su visibilidad relativa.
- Buena práctica: ¡Menos es más! En el diseño de una página solamente se debe mostrar aquella información que realmente es importante para el usuario. Evitando así, ruido y elementos innecesarios que no cumplen con el fin principal de esa página. Por ejemplo, Google lleva años resistiéndose a añadir más información en su página inicial. Dando así protagonismo a su funcionalidad principal: el buscador.
- Mala práctica: Sin embargo el portal Yahoo, aunque haya mejorado sustancialmente su diseño en los últimos años, siempre ha presentado una estética sobrecargada y con demasiados elementos.
9-Ayudar a reconocer, diagnosticar y recuperarse de errores
Los mensajes de error deben estar expresados en lenguaje llano (sin códigos), indicando con precisión el problema y sugiriendo una solución.
- Buena práctica: Un muy buen ejemplo de página de error 404 la encontramos en la web oficial de Spotify. Dónde se informa correctamente del problema sucedido y de las posibles salidas para solucionarlo: “Preguntas frecuentes”, “Comunidad” y “Volver”.
- Mala práctica: Por el otro lado, como ejemplo de mala práctica encontramos la web de Renfe. Dónde en el proceso de compra de un billete, aparecen múltiples mensajes de error con un sistema de numeración que el usuario difícilmente entenderá.
10-Ayuda y documentación
Aunque es mejor que se pueda usar el sistema sin documentación, es necesario proveer al usuario de ayuda y documentación. Esta tiene que ser fácil de buscar, centrada en la tareas del usuario, con información de las etapas a realizar y que no sea muy extensa.
- Buena práctica: El portal Stackoverflow proporciona una detallada sección de ayuda en su ‘Help center’. En una misma página se puede encontrar un buscador, un módulo de Onboarding y las F.A.Q’s.
- Mala práctica: Cualquier página web que no presente ninguna sección de ayuda, documentación o incluso de contacto, posiblemente provocará desamparo e incertidumbre al usuario.
Conclusiones
La Evaluación heurística es una técnica crucial y muy útil a la hora de encontrar errores de usabilidad, sobre todo en fases muy tempranas de un proyecto de diseño web. Sin embargo, la popularización de los heurísticos de Nielsen ha creado una falsa creencia que da a entender que solamente con cumplir una serie de principios heurísticos ya basta para considerar una aplicación como usable.
Debemos entender entonces que la evaluación heurística en ningún caso sustituyen las evaluaciones de usabilidad con usuarios reales. Solamente las complementan. Y es que, aunque en el global del proceso de definición, diseño e implementación de un sistema interactivo se deben tener en cuenta distintas técnicas para asegurar la usabilidad, siempre se debe considerar al usuario como centro de todo el proceso.
