Wireframing Challenge
Miércoles 25 de septiembre, 15:30 de la tarde, primer día del UX/UI Bootcamp de Neoland, Raúl Marín nos sorprendió con la petición de realizar un Wireframing Challenge de la App del Metro de Madrid. Un ejercicio muy interesante por un lado, por los pocos recursos con los que contamos a nivel de conocimientos y, por otro lado, alentador porque activa el gusanillo de aprender más sobre las diferentes técnicas para poder sacarle el mayor partido a este tipo de dinámicas.
Efectivamente, a las 15:30 de la tarde todos estábamos todavía digiriendo la comida, pero en el fondo esto es un Bootcamp, una manera de salir de tu zona de confort y darlo todo por aprender, resolver dudas y problemas en poco tiempo. Sentir que estás aprovechando al máximo esta gran oportunidad de formación.
La información recibida fue la siguiente:
La App del Metro de Madrid necesita incluir la opción de ofrecer al usuario entrar en la estación de Metro directamente con el móvil, esta acción sólo se puede definir con tres pantallas. No contábamos con datos acerca de inversión para implementar esta parte de la aplicación, ni características de dispositivos, ni información que era necesario que apareciese en cada pantalla. Imaginación al poder.
Mi compañera y yo comenzamos a imaginar cómo sería la experiencia con un Iphone, con un Android, barajamos opciones de seguridad, pero hubo un momento en el que pensamos, “nos estamos liando demasiado, actualmente, si pierdes la tarjeta transporte no hay medidas de seguridad disponibles”.
Decidimos simplificar e imaginar un escenario idílico en el que el usuario tuviera un smartphone con tecnología NFC. También se nos ocurrió que lo mejor sería no complicarle la vida, la gente va siempre con prisa en Madrid, lo único que quiere es hacerlo todo lo más rápido posible y eso incluye que la entrada al Metro sea lo más ágil posible.
En la primera pantalla pensamos que lo mejor sería que apareciese una opción de “Viajar” en grande, y dos opciones de ayuda para “calcular ruta” y otra de “ver plano de metro”.
En la segunda pantalla, un mensaje simple que indicase “Acércalo al lector”, y con la opción de “Informar de un problema” si el lector no funcionase.
La tercera pantalla y última sería la que mostraría un mensaje de éxito en la acción junto a la información referente a los viajes que aún puede realizar el usuario con esa tarjeta transporte y la opción de realizar una recarga.
Después de realizar las tres pantallas les dimos interactividad con Marvel. Esto nos mostró por qué wireframing es de gran utilidad para disponer de un borrador sobre el comportamiento y uso de una App, al no invertir mucho tiempo en diseño y “ponerlo bonito”, no sufres si no funciona y hay que iterar.
Este ejercicio me ha resultado interesante para comprender que cuando se presenta así un proyecto, al no aterrizar en colores, tipografías, espaciados, etc. puedes abstraerte y focalizar toda la atención en la funcionalidad y cuando realmente llegue la fase de “ponerlo guapo”, se hará con la seguridad de que se ha aprobado y funciona.
Supongo que a medida que vayan pasando las semanas y relea esta entrada, me daré cuenta de que es un poco ingenua e infantil, pero esto es lo bonito de estar aprendiendo, tener la mente abierta y valorar todo lo que has avanzado cuando echas la vista atrás.
