Cómo diseñar un dashboard sin leer la mente de los usuarios
Propuesta de una metodología que jerarquiza la información de acuerdo a las necesidades del usuario y ayuda a ofrecer el contenido justo en el momento justo.
El mundo está repleto de dashboards. Son el centro de muchas aplicaciones, servicios y artefactos que usamos a diario. Los consultamos para saber qué pasó con tal o cual cosa y tomar una decisión que se convierte en una acción.
¿Falta mucho para que llegue lo que compré? ¿Cuándo se debitará la cuota del préstamo? ¿Cuánto tengo que correr para alcanzar mi meta semanal? ¿Se me terminará la nafta antes de la próxima estación de servicio?
Cuando nos ponemos a pensar en cómo diseñar un dashboard, la misión suele abrumar: debemos crear una estructura que responda todas las preguntas posibles y ofrezca sólo la información que el usuario necesita, cuando la necesita.
¿Cómo podríamos lograrlo? ¿Y si aprendiéramos a leer la mente? Bueno, sería una excelente opción. Pero, si no tenemos desarrollada esa habilidad, probemos con el Task Map. 😆
El Task Map
Es un mapa de necesidades y tareas, que muestra las preguntas del usuario y las respuestas que necesita para usar la interfaz.
Su objetivo es ofrecer una suerte de arquitectura de información, que nos permita diseñar una estructura con el contenido correcto para cada situación.
El mapa refleja un camino que empieza por lo que el usuario quiere saber, sigue por lo que debe evaluar para satisfacer ese pedido con la información que le damos y, si corresponde, qué acciones podrá hacer en la interfaz.
A quienes les gusta saber un poco más de teoría, el Task Map intenta reproducir el proceso mental que ocurre en la toma de decisiones. Pronto, agregaré aquí el link a otro post que cuente más sobre eso. 🤓
Cómo usarlo, paso a paso
El Task Map acompaña un proceso de diseño que empieza por las necesidades de los usuarios y el contenido.
No exige muchas herramientas:
- Un Google Doc u otro software para escribir colaborativamente.
- Algo para prototipar o diseñar en baja fidelidad.
Es una metodología de cuatro pasos:
- Hacé una lista de los perfiles de los usuarios, los escenarios y casos de uso.
- Armá el Task Map para los casos de uso principales.
- Dibujá pantallas para esos casos, que respondan al Task Map.
- Dibujá toda la historia de un caso de uso y caminala como si fueras el usuario. Usá el Task Map para revisar si algo no está respondido.
1 — Perfiles, escenarios y casos de uso
Al arrancar el Task Map, necesitaremos tener en claro los tres elementos básicos que componen toda experiencia de uso:
- Perfiles de los usuarios
Es el nombre del rol que los usuarios tienen en nuestra interfaz.
Ej.: Organizador de partidos de fútbol. - Escenarios
Es el contexto, la descripción de una situación que agrupa y determina tareas o casos de uso. - Casos de uso
Tareas que llevarán a cumplir un objetivo concreto, en un contexto o escenario particular.
Para que la lista sea fácil de visualizar, hacela en una tabla.
✏️ Ejemplo:
Esta es una parte de la lista de escenarios y casos de uso de un perfil de usuario de WannaPlay, una app que facilita la organización de partidos de fútbol.
2 — Armá el Task map
Llegó el momento de ponerse en los zapatos del usuario y armar el mapa de necesidades y tareas.
El objetivo es pensar qué necesitará y qué información tendrá que obtener para hacer una tarea. Si tenés muchos casos de uso, no te abrumes, enfocate en los principales.
Es muy recomendable que convoques a dos o tres del equipo para hacerlo en conjunto, porque los ayudará a estar alineados en el mismo mindset.
¿Listo?
¡A arremangarse!
Para explicar cómo completar el mapa, iremos de lo abstracto a un ejemplo concreto.
Armá el mapa con este modelo, completá desde el saber al hacer.
✏️ Ejemplo:
Volviendo al ejemplo del dashboard de WannaPlay, el Task Map para uno de los casos luce así:
3 — Dibujá los casos de uso del Task Map
Espero que en el paso anterior hayas obtenido ideas y definiciones de diseño para armar la estructura de interfaz.
Ahora, es el momento de plasmar esas ideas en un dibujo, en cualquier fidelidad.
Eso puede ayudarte de dos maneras:
- A cotejar rápido que lo que estás diseñando está alineado con las necesidades del usuario.
- A presentar ideas al team o a los stakeholders. El Task Map permite discutir, en forma ordenada, la relevancia de la información en cada caso, sin perder el punto de vista del usuario.
✏️ Ejemplo:
4 — Probá lo que diseñaste
Llegó el momento de conectar todos los puntos y poner a prueba la interfaz.
Cuando hayas terminado todos los escenarios, prototipá o dibujá de punta a punta las pantallas de cada uno.
Luego, caminá el flujo y, con el Task Map a mano, probá si…
- El usuario encuentra rápido lo que responde a sus necesidades.
- La información lo ayuda a evaluar y tomar una decisión.
- La interfaz brinda la posibilidad de ejecutar la acción que necesita.
✏️ Ejemplo:
Lo más útil (y divertido) es imprimir las pantallas, desplegarlas sobre una mesa y recorrerlas con el Task Map. Podés marcar con Post-its® aquellas cosas que no están respondidas o podrían iterarse.
El ejercicio luce más o menos así:
Un breve repaso final
La metodología del Task Map es una herramienta para jerarquizar la información de un dashboard o interfaces similares.
Antes de dibujar las pantallas, nos pone primero en la situación de entender cuál es la información adecuada para cada escenario de uso. Luego, nos enfoca en hacer un mapa de las relaciones entre lo que necesita saber el usuario y el contenido que le ofreceremos en cada caso.
Ese mapa nos da la posibilidad de diseñar una estructura y chequear al instante si funciona, porque veremos claramente qué tan allanado está el camino entre la información que ve, la decisión que va a tomar a partir de ella y lo que podrá hacer en la interfaz.
Al final del día, obtendremos un dashboard en el que los usuarios encuentran lo que necesitan, cuando lo necesitan. Como si les hubiéramos leído la mente. 😉
¡A probarlo!
¿Querés opinar sobre el Task Map? Sería genial, tus comentarios son vitales para iterar la metodología.
Si ya sabés que te gustó lo que leíste, recomendá el post con un aplauso 👏 😄.
Gracias infinitas a los colegas UXers que usaron el TM y/o leyeron una versión de este artículo y me dieron feedback: Ezequiel Salatino, Joaquín Lluis, Germán Gallo, Luciano Scala, Sol Degl’innocenti, María Puchuri y Sol Parnofiello.