M4.353 - Evaluación de la Usabilidad - Aula 1

Pública

Introducción

En este post para Folio realizaré un análisis heurístico de la interfaz web de Ticketmaster España, una plataforma dedicada a la venta de entradas para diversos eventos de entretenimiento, como conciertos, obras de teatro, festivales, espectáculos de arte, competiciones deportivas y actividades familiares, entre otros.

He escogido esta plataforma con el objetivo de evaluar su usabilidad y experiencia de usuario (UX/UI), ya que hace relativamente poco tuve la oportunidad de comprar dos entradas para un concierto próximo, en ese momento tuve algunos problemas con la eficacia de la compra, por lo que es una actividad perfecta para exponer la experiencia propia y los diversos errores que encontré y aspectos que considero que pueden mejorarse.

Es una interfaz que alberga un flujo de compras elevado, por lo que es un desafío único con el que la plataforma debe tratar con eficiencia, claridad, fiabilidad y accesible a todos los niveles del usuario, con el fin de ofrecer una experiencia de calidad dónde las personas usuarias puedan comprender e intuir todos los aspectos visuales de la plataforma con el fin de cumplir su objetivo, ya que el más mínimo fallo en el transcurso de la compra o falta de información transparente puede tener consecuencias como la pérdida de una entrada para un acontecimiento único.

A Continuación se detallará la metodología escogida para el análisis heurístico de la plataforma, junto con los diez principios de usabilidad de Jakob Nielsen, cuyo uso es para mejorar a nivel de usabilidad las interfaces de las diversas plataformas, ya sean webs o aplicaciones móviles, considerados como buenas prácticas para aplicar en el diseño y basándose en los problemas reales que normalmente se encuentran en el momento de usar una aplicación. Además se adjuntará ejemplos concretos del sitio, que estarán clasificados por tipo de problema heurístico hallado de usabilidad con propuestas de mejora en cada caso.

Metodología de la Evaluación Heurística

Siguiendo el método propuesto por Jakob Nielsen el análisis se ha desarrollado de la siguiente manera:

1. Propósito: por medio del análisis se busca evaluar la usabilidad y experiencia de usuario de la plataforma web de Ticketmaster España en su versión escritorio.

2. Flujo del usuario y proceso a realizar, recorriendo los puntos más sensibles y críticos.

2.1 El usuario accede a la plataforma web simulando la típica tarea de usuario medio cuyo objetivo es: buscar un evento o artista deseado que vaya a realizar próximamente un concierto en directo, seleccionar las entradas deseadas, pasar por la pasarela de pago y finalmente consultar la información del evento, confirmando así el acceso oficial el evento.

2.2 Se recopila cada hallazgo en el impacto de la experiencia en el usuario teniendo en cuenta (problemas y aciertos), en términos de claridad, navegación, frustración y carga cognitiva.

2.3 Se evalúan cada uno de los problemas encontrados clasificándolos por gravedad: leve, media y alta, de esta manera se pueden proponer soluciones adecuadas para la mejora de usabilidad de la plataforma, teniendo en cuenta siempre al usuario como punto de partida.

Aplicación y análisis de los 10 Principios Heurísticos de Jakob Nielsen

1. Visibilidad del Estado del Sistema

Definición: En la fase de selección de entradas y entrar a la cola virtual.

Hallazgo: El usuario hace click en el botón “Entradas”. No suele aparecer algún tipo de indicador claro que informe al usuario que está procesando el sistema. También es crucial si es un evento de alta demanda, el usuario procede a entrar a una cola virtual, donde la única información que percibe es una línea continua en la que aparece una animación de carga genérica. El sistema no le proporciona una estimación de tiempo de espera a pesar de poner la cantidad de personas que tiene delante, un número que no es continuo saltando por ejemplo del 99 al 80, dando a entender al usuario que esa cola no es cien por ciento verídica.

Evaluación: Gravedad Mala.

Argumentación: La falta de retroalimentación inmediata genera cierta ansiedad y frustración extrema al usuario, además de cierta incertidumbre de tener tantas personas delante de este y tener la posibilidad de quedarse sin entrada por la alta demanda. El usuario carece de información para saber si realmente el sistema funciona correctamente o se haya quedado bloqueado por el alto tráfico de la web en momentos de pre-venta o lanzamiento general de las entradas, por inercia el usuario medio tiende a actualizar constantemente la página, con la mayor posibilidad de que pueda perder su sitio en la cola virtual, llevándolo nuevamente al final de esta, finalmente esto provoca el abandono absoluto de la compra de sus entradas obteniendo así una pésima experiencia de usuario. Es importante ser transparente a nivel sistémico es importante en este flujo de esperas en colas virtuales.

2. Relación entre el Sistema y el Mundo Real

Definición: Una vez el usuario ha conseguido con éxito entrar a la zona del mapa para ver los asientos a los que puede disponer, muchas veces las descripciones son muy técnicas.

Hallazgo: En ciertos asientos o listados de estos, aparecen abreviaturas poco familiares para el usuario común que está muy poco habituado con el lenguaje técnico del espectáculo. Por ejemplo: “Palco Goya 1.6” o “Sector 13 de la planta 0”.

Evaluación: Gravedad Mala.

Argumentación: Se prioriza la adopción de un lenguaje natural y conversacional en toda la plataforma, especialmente en el flujo de selección de asientos. El objetivo es minimizar la carga cognitiva y evitar la frustración del usuario inmediatamente después de superar la estresante fase de la cola virtual. Al utilizar descripciones claras y comunes, conseguimos agilizar la sección de asientos y garantizar que la elección de compra sea un proceso rápido, intuitivo e informado, de esta forma no se colapsa el sitio web y no se generan largas esperas en la cola virtual.

3. Control y Libertad del Usuario

Definición: El usuario una vez selecciona las entradas, no queda claro cómo se aplica el filtro de selección, ya se que observan dos tipos de pestañas en el momento de la selección (Ver mapa de asientos o Ver lo mejor disponible), para el usuario medio estas opciones no les sería muy familiares por lo que no se entendería la diferencia entre una y otra opción.

Hallazgo: En el momento de aplicar el filtro resulta bastante confuso, como se observa en la captura de pantalla. Además el usuario tras finalmente seleccionar la cantidad de entradas que desea, el sistema debería informar con antelación que debe iniciar sesión o crearse una cuenta para poder comprar las entradas, esto puede ser clave ya que le ahorraría tiempo y no se frustrara con la cuenta atrás que aparece en la parte superior derecha.

Evaluación: Gravedad Leve.

Argumentación: El usuario debería tener más libertad para aplicar los filtros sin saber que hacer o donde ir además de poder prepararse fácilmente con antelación sin tener que registrarse y perder el tiempo, la falta de control aumenta considerablemente la frustración. Antes de proceder con la compra se debería poner una descripción o breve texto que el usuario debe tener en cuenta que necesita una cuenta de usuario en Ticketmaster.es para la compra de entradas.

4. Consistencia y Estándares

Definición: La funcionalidad de “Buscar” en el apartado del header y sus opciones se mantienen consistentes.

Hallazgo: En la esquina superior derecha en gran parte de la navegación, durante el proceso de página de inicio y escoger el artista de interés, pero en el momento en el que te dirige a la pantalla de elección de asientos esta se “minimiza” dejando un pequeño rastro de banner azul en la parte superior de la página.

Evaluación: Gravedad media-leve.

Argumentación: La consistencia y estándar del color sigue la línea de marca consistente de los colores de Ticketmaster, el estilo de los iconos y colores ayuda al usuario a confirmar que sigue un flujo de interacción consistente, aunque aumenta la carga cognitiva de este al estar fijándose constantemente en los múltiples cambios de texto y animaciones varias en el paso de una pantalla a otra. Se debe mantener una constancia visual para favorecer una experiencia fluida.

5. Prevención de errores

Definición: En el formulario de registro de inicio de sesión.

Hallazgo: Si el usuario introduce o se deja algunos datos que estuvieran erróneos o incorrectos , el sistema le ofrece un texto de color rojo notificando al usuario para que vuelva a revisar los datos, cuenta con una buena validación de los datos en tiempo real.

Evaluación: Gravedad buena.

Argumentación: Este tipo de prevención de errores ayuda al usuario en todo momento, superior al manejo de errores, evitando que el usuario llegue a un proceso y esté informado de manera inmediata ya que el sistema no permite que este avance en el siguiente paso si el formato fuera incorrecto, invitando al usuario a corregir los datos en todo momento.

6. Reconocer antes que recordar

Definición: Cuando el usuario entra en la página principal y observa un artista de interés ,entra en este para ver el acceso de entradas, pero en este momento no le interesa comprar ninguna entrada y solo ver la disponibilidad que hay, este quiere volver a la página de inicio y poder tener una lista a mano de “recuerdo” del historial de artistas vistos.

Hallazgo:  Este punto se halla en la página home de la web pero no está visualmente a la mano, por lo que no es intuitivo a simple vista, el usuario en este caso ha de hacer scroll para acceder al historial de “Búsquedas de artistas más recientes”, por lo que no tiene un acceso directo a esta opción.

Evaluación: Gravedad media.

Argumentación: Permitir al usuario que vea su historial de artistas más frecuentes de manera más visual e intuitiva para reducir la carga de la memoria para que este no tenga que recordar lo que buscó, en el caso que no se le ocurra hacer scroll.

7. Flexibilidad y Eficiencia de Uso

Definición: El usuario tiene que hacer un recorrido más largo para ver los detalles de las suscripciones a la newsletter o notificaciones del evento en las preferencias de comunicación.

Hallazgo: Esta opción no se encuentra de forma directa, están ubicadas en rutas menos eficientes y poco intuitivas.

Evaluación: Gravedad media.

Argumentación: El usuario intenta modificar sus preferencias de la comunicación o bien para darse de baja o consultar notificaciones de los próximos conciertos para que le lleguen a su correo electrónico, dificultando la localización de una funcionalidad común.

8. Estética y Diseño Minimalista

Definición: En la mayoría de páginas de la plataforma se muestra demasiada información a primera vista, con fotos excesivamente grandes, sobrecarga de widgets, secciones de texto largos, además de anuncios laterales.

Hallazgo: El usuario encuentra un exceso de información que dificulta la toma de decisión en las opciones del usuario por qué tantos estímulos pueden distraer al usuario de su objetivo principal escoger el artista deseado y comprar entradas, pero al haber tantas opciones al final se queda más de lo esperado por lo que beneficia al sitio,captando el tiempo y la retención del usuario.

Evaluación: Gravedad mala.

Argumentación: El diseño no es minimalista , por el contrario se visualiza ruido informativo mucho mayor a el objetivo de la plataforma que es comprar o vender una entrada, el contenido debería tener una mejor jerarquía visual para tener una mejor experiencia y claridad para el usuario.

9. Ayuda a los Usuarios a Reconocer, Diagnosticar y Recuperarse de Errores

Definición: En el proceso de compra de la entrada el sistema puede tener un fallo de conexión entre la plataforma y el sistema bancario del usuario, el mensaje no es muy claro.

Hallazgo: A menudo el menaje es poco consistente “Se ha producido un error, inténtelo más tarde” o sin demostrar cual es el verdadero motivo por el que el usuario ha perdido el tiempo que ha estado para poder acceder a la pantalla de compra, y que muchas veces tiene que volver a rehacer todo el camino desde el inicio, generando una frustración importante para el usuario.

Evaluación: Gravedad mala.

Argumentación: Este tipo de mensajes de error deberían ser útiles para ayudar al usuario a comprender realmente cuál fue el fallo y saber que hacer, reduciendo la frustración y repetición de próximos errores. Ya que un mensaje genérico causa pánico al comprador.

10. Ayuda y documentación

Definición: En la sección del footer dónde el usuario dispone de la «Ayuda» necesaria, no está visualmente clara, por lo que la mayoría de veces tiene que hacer scroll hasta abajo, por lo que no es lo suficientemente accesible para este.

Hallazgo: Esta sección no ofrece una asistencia contextualizada, en el momento que el usuario tiene la necesidad en algún momento de usar y acceder fácilmente a esta opción, 

Evaluación: Gravedad media.

Argumentación: Al estar en una página de un evento, el usuario no encuentra un acceso rápido a la ayuda de la información. Forzar al usuario a buscar de forma manual provoca frustración en el momento más lo necesite o en casos puntuales.

Listado Priorizado y Propuestas de Mejora

1. Visibilidad del Estado del Sistema (Gravedad: Mala)

Hallazgo: La cola virtual no es transparente, por lo que falta una estimación de tiempo, y los saltos de colas no son reales.

⏳Justificación de gravedad: Causa ansiedad extrema y pánico al usuario, por inercia refresca la página, pierde su lugar en la cola y abandona la compra, generando mucha frustración.

✅Propuesta de mejora: Dar una estimación de tiempo de espera real, en rango, además de añadir mensajes cortos pero claros, que adviertan al usuario que si actualiza página perderá su sitio.

2. Ayuda a los Usuarios a Reconocer, Diagnosticar y Recuperarse de Errores (Gravedad: Mala)

Hallazgo: Mensajes de error genéricos y poco útiles.

⏳Justificación de gravedad: es un fallo bastante grave en el punto final de la compra de entradas, ya que genera una frustración máxima, ya que obliga al usuario a rehacer todo el proceso de inicio a fin, incluyendo también la cola virtual.

✅Propuesta de mejora: fEnseñar mensajes de errors más claros y específicos como «Revisa tu tarjeta bancaria», o «Fallo en la conexión con tu cuenta». Además debería guardarse el sitio, por que es un fallo de una herramienta totalmente externa a la plataforma web.

3. Estética y Diseño Minimalista (Gravedad: Mala)

Hallazgo: Hay una sobrecarga considerable en las páginas por exceso de información que es muy poco necesaria, y archivos multimedia tanto fotos como videos sin contar la publicidad.

⏳Justificación de gravedad: fe Se trata de tener mucho ruido visual y poca estética minimalista, que dan como resultado una gran distracción del objetivo real del usuario que es compara entradas. Ralentizando el flujo de la web además de la toma de decisión del usuario.

✅Propuesta de mejora: Se puede mejorar y aplicar las teorías de arquitectura de la información para reducir la densidad y cantidad de información irrelevante, donde se puede minimizar el tamaño de elementos y que predomine la compra sobretodo.

4. Relación entre el Sistema y el Mundo Real (Gravedad: Mala)

Hallazgo: Uso de abreviaturas complejas y técnicas para describir los asientos o puestos de las entradas.

⏳Justificación de gravedad: Genera incertidumbre sobre el producto por lo que hace se la selección de entradas sea más lenta entorpeciendo el flujo del sistema, frustrando al usuario.

✅Propuesta de mejora: Usar un lenguaje más natural como «Palco Goya – Fila 2, Asiento 9», Además de añadir un pequeño mensaje emergente o vistas virtuales en 3D de 360º para aclarar de manera más eficaz de la ubicación de los asientos.

5. Control y Libertad del Usuario (Gravedad: Leve)

Hallazgo: El sistema no informa previamente antes de comprar las entradas de la necesidad de iniciar / registrarse una sesión. (con la cuenta atrás activa).

⏳Justificación de gravedad: Además se tiene en cuenta que el contador de estadía sigue corriendo a pesar de tener que hacer un paso más, causando ansiedad junto con la sensación de pérdida del control sobre las entradas.

✅Propuesta de mejora: Mostrar un texto pre-alerta visible antes de ceder al usuario escoger las entradas, de esta manera se puede preparar mejor y tener todo en orden para el proceso de pago.

6. Reconocer antes que recordar (Gravedad: Media)

Hallazgo: El usuario tiene que hacer scroll para poder ver un historial de búsqueda de artistas más recientes, no es una opción visible.

⏳Justificación de gravedad: Genera más carga cognitiva obligando al usuario buscar una funcionalidad de regreso, en vez de ser reconocida de forma automática.

✅Propuesta de mejora: Mover esta sección de la plataforma en una posición más visible y destacada.

7. Flexibilidad y Eficiencia de Uso (Gravedad: Media)

Hallazgo: En la opción de gestionar las preferencias de comunicación, requiere un recorrido muy largo y poco intuitivo y eficaz.

⏳Justificación de gravedad: Complica una tarea muy básica, donde muchos usuarios quieren estar al tanto o no de las suscripciones a newsletters en sus correos electrónicos, generando irritabilidad.

✅Propuesta de mejora: Colocar un acceso mucho más directo en el menú principal con el nombre de «Preferencias de Email o Comunicación»

8. Ayuda y documentación (Gravedad: Media)

Hallazgo: El acceso al apartado de Ayuda suele encontrase en el Footer, por lo que no ofrece una asistencia inmediata o contextualizada.

⏳Justificación de gravedad: El usuario requiere  una asistencia eficaz sin necesidad de hacer scroll completo. 

✅Propuesta de mejora: Para darle al usuario un acceso inmediato, se puede implementar un icono fijo en la esquina superior de la interfaz, de esta manera el sistema ofrece una ayuda contextual en campos clave

9. Consistencia y Estándares (Gravedad: Media-Leve)

Hallazgo: En la cabecera se cambia de manera drástica el buscador al pasar de una pantalla principal a la selección de asientos.

⏳Justificación de gravedad: Rompe con el flujo y la consistencia visual, obligando al usuario a retornar para volver a acceder a ese menú

✅Propuesta de mejora: Mantener un header consistente, de esta manera se mantiene un diseño y ubicación constante.

10. Visibilidad del Estado del Sistema (Gravedad: Baja)

Hallazgo: Cuando el usuario hace clic al botón de entradas, el indicador no siempre se muestra clara.

⏳Justificación de gravedad: Causa una leve incertidumbre al usuario, aunque suele resolverse mucho más rápido.

✅Propuesta de mejora: Mostrar un indicador inmediato que sea visible al hacer clic o un hover cambiando el estado de la acción informando al usuario que se ha registrado.

Bibliografía