challenge three: Usability evaluation & site redisign

Mia Escorihuela
7 min readMar 21, 2021

--

Para este último challenge nos vamos de viaje!!

Vamos a elegir un estilo de viajeros y estudiar cómo se mueven por distintas aplicaciones para reservar sus billetes y concretar todos los detalles necesarios para su viaje. Una vez hechas estas observaciones intentaremos proponer ligeras mejoras, cambios sutiles que harán que la usabilidad de las App o websites fluya mejor, para eso vamos a centrarnos en detectar los pain-points y los flows que nos son tan claros.

Nuestro destino será Roma: una de las ciudades más antiguas del mundo y con más encanto y el viaje lo realizará una joven pareja.

Fontana di Trevi (Roma)

USUARIO + DESTINO

Primero vamos a conocer en profundidad a esta pareja de viajeros:

  • Jon y Alex (35–37años) celebran su aniversario todos los años en un restaurante italiano, buscan el mejor de Madrid y allí van, este año Jon va a sorprender a Alex haciendo la reserva del restaurante nada menos que en Roma y a partir de ahí deben programar su viaje, qué emocionante, verdad? Vamos a acompañarles en esta aventura y encontrar las mejores ofertas desde el mismo salón de su casa.

Este año han ahorrado mucho y pueden permitirse un gran viaje: un buen hotel en el centro de la ciudad, visitas culturales e incluso alquilar un coche y descubrir los alrededores de la ciudad.

Sus preparativos empezarán por investigar el destino y qué van a necesitar:

  • Aeropuerto: Roma cuenta con 2 aeropuertos FCO y CIA, vamos a elegir volar a FCO Aeropuerto Internacional Leonardo da Vinci (Fiumicino), el más grande de Italia. Con mucha afluencia de vuelos y de fácil conexión con la ciudad.
  • Moneda: Estamos de suerte porque en Italia la moneda es el Euro, esto facilita mucho las cosas pues no necesitamos cambiar dinero y también hace que detectemos más rápido si los precios y tarifas son adecuadas.
  • Aspectos médicos: Vamos a Roma en verano, no hay exigencias de vacunación determinada pero siempre tenemos que respetar la normativa covid vigente.
  • Recomendaciones de indumentaria: Lo esencial en nuestra maleta debería ser un calzado cómodo adecuado para “patear” la ciudad, que es la mejor forma de descubrir rincones que no aparecen en las guías. También nos hará la estancia más agradable llevar con nosotros crema de sol, ropa ligera de verano, sombrero o gorra y alguna prenda que nos tape un poco más para poder acceder a templos religiosos sin problema (un suéter o pañuelo será suficiente)
  • Días recomendados: Nuestro itinerario cuenta con días de mucho turismo y también días de relax, no olvidemos que el viaje es para celebrar una ocasión especial, tampoco queremos que esta pareja vayan “agotados” de acá para allá. 6días nos parecen suficientes para descubrir y relajarse a partes iguales.

BENCHMARKING

Vamos a comparar distintas Apps (kayak , skyscanner , trip advisor , hopper) que pueden ayudar a esta pareja a diseñar su viaje desde su casa y utilizando la evaluación heurística de Nielsen ver cuál es más apropiada para ellos.

Jackob Nielsen Heuristic Evaluation

Estas cuatro Apps disponen de mucha información, veraz y contrastada, e intentan organizarla de la manera más clara posible intentando acercarse a diseños minimalistas aunque eso es difícil de conseguir, pues son un tablón de anuncio de muchas grandes cadenas de hoteles y aerolíneas que como es lógico demandan que sus logos estén presentes.

Los flows en general permiten fácil corrección de errores y el usuario es capaz de entender dónde esta en cada momento y conocer el estado de las acciones que realiza. Utilizan simbología entendible con iconos universales que nos permiten identificar vuelos=aviones, hoteles=edificios, camas y vehículos= coches.

TESTING & REDISEIGN

Para este challenge voy a analizar con más detenimiento SKYSCANNER y observar que partes podrían ser modificadas para su entendimiento más rápido y sencillo por parte de esta pareja de usuarios.

  1. Cómo interactúa el usuario?

Nos proponemos entender esa primera impresión que se tiene al abrir la App para ello vamos a hacer un visual test de 5 segundos, a continuación desciframos qué han visto y qué han entendido.

La primera pantalla de Skyscanner nos da una visión del mapa del mundo donde podemos consultar requisitos para “viajar en tiempos de covid” esto ha despistado a los usuarios que enseguida han clickado ahí y desplegado un mapa aún mayor con más opciones. La mayoría han entendido que era una App de información covid actualizada a nivel mundial.

Pantalla inicio COVID

2. Acciones Básicas:

Una vez que descubren que es una herramienta para ayudar al viajero a reservar todo lo necesario para un viaje, he pedido a nuestros usuarios que planeen su escapada por lo que deberán localizar los apartados para sacar billetes de vuelo, buscar alojamiento y alquilar un vehículo.

Aquí también encontramos qué el recorrido no está tan claro como creíamos, he encontrado que la parte TRIPS lleva a confusión pues parece dar a entender que es ahí donde debes hacer click para empezar a planear tu viaje, en cambio, se trata de un espacio en el que se almacena información de viajes ya realizados o futuros viajes ya reservados que están en espera de ser usados.

Enseguida, vuelven atrás y corrigen su error con facilidad seleccionando el icono de la lupa SEARCH, es ese el punto de inicio esperado para tener claro la finalidad de la APP: comprar billetes de vuelo, reservar alojamiento y alquilar coche.

Iconos a pie de página

REDISEÑAR

Una vez llegados a la pantalla de inicio original (el apartado SEARCH) vamos a analizar si es intuitivo el proceso de sacar un billete de vuelo. Intentaremos solucionar los pain points y partes menos claras y aportar alternativas de diseño para cada pantalla.

Proceso de sacar un Billete de vuelo

He desglosado el proceso de sacar un billete de vuelo en Skyscanner con estas cuatro pantallas:

  1. La pantalla de inicio llevaba a confusión por eso me he centrado en los iconos de debajo, he sustituido “TRIP” , que tiene el icono de una maleta y hacía que los usuarios acudieran a esa pantalla para iniciar su compra, por un símbolo que da referencia al covid y abriría una pantalla en la que tenemos detallada toda la información necesaria para el viaje. La información de “TRIPS” , es decir, reservas anteriores y actuales, se guardaría dentro de una pestaña en “PROFILE”

Al enseñar esta opción de pantalla a los usuarios estuvieron de acuerdo en que ahora sí sabían a donde dirigirse para empezar la búsqueda, sin confusión entre la maleta y la lupa.

2. En la segunda pantalla los cajetines de destino y fecha son más grandes, dando mejor visibilidad y contraste. También he querido añadir unos menús desplegables para modificar la selección de número de personas y clase en la que se desea viajar. He respetado las opciones para elegir el viaje más corto o más barato, porque me parece muy acertado y también la barra en la que vemos que se están cargando las opciones disponibles de vuelos, una herramienta de comunicación muy necesaria.

He notado al observar cómo se manejan los usuarios por la App que a menudo se generan conversaciones en torno al precio final de los billetes, “pero eso es el total del billete? para uno o para los dos?” por eso me parece importante que este claro y visible, y que pueda ser modificable en este punto.

3. La tercera pantalla es la que se despliega al hacer “click” en seleccionar fechas, esta desplegaría un calendario en el que veríamos los días en los que viajar es más económico o menos, por eso lo he llamado “Date & Rate”

Tener esta información ayuda a un viajero flexible a conseguir el mejor percio y, por tanto, a tener predilección por esta aplicación frente a otras.

4. He querido simplificar y dar un aspecto más minimalista a esta última pantalla. Aquí ya han sido elegidos todos los aspectos del viaje: el destino, las fechas, el número de billetes y la cabina en la que quieren viajar y debe aparecer todo muy claro y sin distracciones.

Es habitual llegar a este punto y detectar algún error (siempre que sea visible y clara la información) por eso me parece importante que exista un botón claro en el que puedas volver atrás (en este caso a la segunda pantalla) y modificar cualquier cosa que no esté al gusto del viajero.

Evaluar la usabilidad de una web o App y ser capaz de rediseñar algunos aspectos es un trabajo complejo, esto es una pequeña pincelada pero me ha encantado ser capaz de ponerlo en práctica. Tengo muchas ganas de empezar esta aventura y aprender todas estas cosas tan interesantes pasito a pasito!

Qué empiece el viaje hacia esta tierra desconocida: destino UX/UI!

--

--