Cómo mejorar la UX durante los tiempos de espera

C

Aún recuerdo cuando tenía 12 años y cumplí el sueño de todo infante: ir a Disneyland. Cuando entras por primera vez te sientes especial, que formas parte del storytelling. Todo es ideal y te diriges con emoción a tu primera atracción, pero lo primero que ves es una cola tremenda y un cartel que dice “Tiempo de espera: 50 minutos”. 

Como pasa en las colas de Disneyland, nuestra experiencia en tiempos de espera dependerá de cómo se gestionen nuestras expectativas. Pero, ¿por qué hay esperas que se nos hacen insufribles y otras no? 

Cargando tu experiencia Disneyland, por Francisco Riolobos

En este artículo sobre la Psicología de la espera, David Maister explica por qué el tiempo percibido poco tiene que ver con el tiempo real. Algunos de los principios que describe son: 

  • El tiempo que pasamos sin hacer nada se nos hace más largo que el que pasamos ocupados. 
  • Esperas indefinidas se hacen más largas que las conocidas y finitas. 
  • Esperas sin explicación se hacen más largas que las justificadas. 
  • En momentos de ansiedad una espera se hace más larga. 
  • Cuanto más valioso es el servicio, más tiempo estará dispuesto a esperar el cliente. 

Recordemos también uno de los 10 principios de Usabilidad de Nielsen: la visibilidad el estado del sistema. Los sistemas deben mantener siempre al usuario informado de lo que pasa, a través de feedback apropiado en un tiempo razonable. En resumen, se trata de un ejercicio de buena comunicación y transparencia con nuestros usuarios. 

Por supuesto, los usuarios online son más impacientes que en el mundo real, y esto tiene grandes implicaciones para los negocios. Amazon calculó que un retraso de solo un segundo en alguna de sus páginas le haría perder 1,6 billones de dólares en ventas cada año. 

Está claro que en la vida lo ideal sería no tener que esperar, ¿no? Pero como eso no es posible de momento, vamos a ver un repaso a los elementos y recursos más utilizados y cómo nos pueden ayudar a mejorar nuestra conversión.   

Loaders y spinners 

Aunque clásicos y efectivos en esperas muy cortas, son frustrantes ya que no indican al usuario cuánto tiempo tiene que esperar, ni si realmente está pasando algo por detrás. Pueden pasar segundos, minutos, horas o incluso que ni termine. Son un elemento que simplemente te recuerdan que estás esperando. 

Loading de Mac

Barras de progreso 

Mejoran ligeramente el problema que los loaders no pueden solucionar: un punto de referencia en la espera. Un truco habitual que se aplica a las barras de carga es que empiezan con progresión lenta y avanzan más rápido al final, sorprendiéndote y haciéndote creer que has esperado menos.  

Fuente: Reddit

Sin embargo, su diseño no tiene nada que ver con cuánto trabajo ha procesado el terminal, sino que está pensada para hacer sentir mejor al usuario. Y si se queda parada en el 99%, el usuario se sentirá engañado y acabará la experiencia con un mal sabor de boca.  

Skeleton Screens 

¿Por qué no enseñamos a los usuarios directamente lo que estamos haciendo? Fue la pregunta que se plantearon en Kayak.com cuando pensaron en nuevas formas de amenizar la espera de sus usuarios. El equipo diseñó una animación con la que además de enseñar el progreso de la búsqueda, mostraba exactamente qué estaba haciendo el algoritmo del comparador. Esto supuso para el usuario una transparencia radical sobre el proceso, cambiando completamente su percepción sobre la espera.  

Esta práctica aplicada junto con una carga progresiva que muestre los diferentes elementos a medida que estén disponibles, permiten al usuario ver el contenido clave primero aunque la carga no se haya completado al 100%.  

Imágenes en Blur 

Este recurso está también relacionado con la carga progresiva, pero da más valor y protagonismo a las imágenes que se mostrarán. En el caso de Medium, cuando entramos en un artículo primero visualizamos el contenido y las imágenes en blur. Cuando se terminen de cargar, las podremos ver en alta definición.

En cambio, en Google imágenes y Pinterest pasa algo muy interesante; en la preview, en lugar de mostrar wireframes grises para cada hueco de imagen, se rellenan del color predominante en las imágenes que se cargarán.

La transparencia con nuestros usuarios es clave. Toda decisión de diseño que realicemos en nuestro producto ha de tener en cuenta a sus usuarios. Y si en algún momento tienen que esperar, expliquémosles por qué están esperando y por qué merecerá la pena.

Deja tu comentario

Sobre el autor

Lucía Ojeda

Ingeniera de Producto que estudió un máster en Diseño UX/UI y ahora es Product Designer en Serialify, plataforma de historias interactivas. Fan de la tecnología, las personas y la pizza.

Eloy Urarte

Lead UX & CRO | MA Degree Lecturer. Crítico del “vale más una imagen que mil palabras”. Enamorado del storytelling y la experiencia de usuario.

¿Hablamos?

Si quieres conocerme, insultarme o incluso contratarme...