Diseñando UX para reducir ansiedad de usuarios en momentos de espera (Ejercicio práctico)

Diseñando UX para reducir ansiedad de usuarios en momentos de espera (Ejercicio práctico)

Hay momentos durante el uso de un producto digital que duelen bastante a los usuarios: tener que esperar.

Sin importar si es la carga de un documento, archivo, sitio, sección, notificación o respuesta, las personas queremos las cosas sin tener que esperar y, dado los tiempos que vivimos en donde tenemos acceso a muchísima información en tiempo récord, todos se han acostumbrado a esa sensación de inmediatez en productos digitales. En un mundo ideal donde la conexión de internet va bien, el performance de cualquier producto es excelente y los tiempos de respuesta son casi nulos quizás no sería necesario crear experiencias e interfaces para que ayudar a los usuarios a reducir su ansiedad al esperar. Pero eso no existe.

En el artículo de hoy aprenderemos a cómo reducir la ansiedad de los usuarios al tener que esperar que los productos que usan en el día a día les ayuden a lograr sus objetivos.


Trabajar con escenarios reales

Para aprender mejor haremos un ejercicio práctico. Comenzaremos con un escenario, veamos esta breve descripción sobre un usuario y sus objetivos para contextualizarnos.

Karina es ingeniera comercial; mucho de su trabajo implica el análisis de datos para tomar decisiones estratégicas, por ello, tener acceso rápido a los datos es fundamental para realizar sus tareas. Cumplir a tiempo con su trabajo le ayuda a entregar buenos resultados y no tener que trabajar extra y así, compartir tiempo de calidad con su hija de 8 años de edad.

Karina se ha enterado que el software que usa para analizar datos ha lanzado una nueva funcionalidad que le permite consultar fuentes de información externas, importar los datos al software masivamente y tenerlos disponibles en tiempo record para realizar sus tareas.

Esto significa para Karina un alivio ya que varias veces ha tenido que reducir el tiempo que pasa con su hija por la cantidad de tiempo que implica tener que buscar los registros manualmente.

Analizando el problema


Antes de pensar en potenciales soluciones y  diseñar hay que comprender aspectos claves para resolver eficazmente el problema:

  • ¿Cuál es el verdadero objetivo del usuario?
  • ¿Qué quiere / está haciendo para lograrlo?
  • ¿Cuál es el margen o tiempo de espera mínimo aceptable antes de que comience a perder la paciencia?
  • ¿Cómo se puede reducir la ansiedad del usuario si el tiempo de espera se extiende?
  • ¿Qué se puede hacer si luego de esperar la carga la tarea no se realiza?

Responder estas preguntas ayuda a comprender los dolores que los usuarios presentarían sí al esperar una respuesta del sistema, este no le informa cuando sucederá o si tarda demasiado en hacerlo.

Cuando un producto digital no le informa al usuario cuanto tarda una acción en realizarse el usuario por defecto pensará que no se realizó, o se hizo mal, o el producto no funciona. Por eso, es fundamental dar feedback al usuario en todo momento con lo que está pasando.


Diseño de experiencia de usuario - resolviendo el problema

Luego de analizar brevemente las respuestas para estas preguntas decidí hacer 2 propuestas usando los componentes de barra de progreso y loop de carga como medios para ayudar a los usuarios a reducir su ansiedad mientras esperan. Con esto hice un breve wireframe.

Wireframe con componentes de barra de progreso


Diseñando la interacción y comunicación - barra de progreso.

La espera está relacionada con el tiempo, por lo que mostrar a los usuarios el avance de la carga de archivos y agregando el tiempo que falta para terminar, les ayuda a reducir su ansiedad. Para esto, me aprovecho de un sesgo cognitivo en el que a las personas nos da la impresión que el tiempo avanza más rápido cuando es en cuenta regresiva.

Entonces a eso le he agregado una barra de progreso que complemente la sensación de que la solicitud hecha por el usuario está avanzando.

Adicionalmente he agregado en la experiencia, el estatus exacto de lo que está pasando con la información que necesita. Esto ayuda muchísimo a los usuarios por:

- Saben cuánto tiempo falta para que termine.

- Cuanto de todo la información se está procesando, importando, guardando.

He agregado también una “válvula de escape” para que el usuario sienta la libertad de cerrar la ventana, con la confianza de que la tarea igualmente avanzará, así como un botón para detener la acción en caso de que lo desee.


¿Qué hacer cuando los tiempos de carga son amplios y no se puede mostrar tiempo? Diseño con loop de carga

En estos casos se puede ayudar al usuario a reducir la ansiedad cambiando variables de tiempo (ej. falta 1 min) por porcentaje avanzado de toda la tarea (ej. 29% de carga realizada). En estos casos la barra de progreso es mejor sustituirla por un loop que complemente al porcentaje, ya que el movimiento continúo indica que el proceso será extenso.

Veamos la siguientes propuesta.

Una propuesta adaptada a tiempos de espera extensos.

Diseño de interfaz final con barra de progreso (tiempos de espera cortos)

Cuan importante es diseñar pensando y empatizar con los usuarios a través de sus necesidades en el uso de productos digitales. He conocido varios productos de cerca que no entregaban valor justamente por no proveer feedback adecuado en momentos críticos.

Acá puedes seguir el tutorial en Figma si quieres tener más detalles del proceso de diseño.

Este ha sido un ejercicio corto con el cual espero ayudarte a tener en cuenta estas soluciones si te enfrentas a un escenario así. Pronto se vienen más ejercicios.

¡Hasta luego!