Challenge 3: Usability Evaluation and Site Redesign. Skyscanner.

En el tercer challenge del prework de Ironhack he realizado evaluación de usabilidad y un rediseño del sitio en una aplicación de viajes

Tipo de usuario y escenario

Los usuarios son un grupo joven de 4 amigos (de 20 a 40 años) que han estado planeando un viaje por la costa de Croacia con un año de anticipación. Todos consiguieron vacaciones en sus trabajos y tienen fechas fijas para ir del 1 al 7 de julio del 2021 a la ciudad de Split, Croacia.

Quieren compartir la mayor cantidad de tiempo juntos y compaginar el turismo por la ciudad con el ocio nocturno.

Skyscanner App

Tras realizar una evaluación heurística de la usabilidad, según los principios de Nielsen, entre 3 aplicaciones de reserva de viajes diferentes: Kayak, Hopper y Skyscanner; elegí Skyscanner para el estudio de caso debido a las características que ofrece.

Skyscanner es un motor de búsqueda global que compara vuelos, hoteles y alquiler de automóviles. El servicio consiste en encontrar el mejor precio y guiar a los usuarios hacia la aerolínea, hotel, proveedor de servicios automovilísticos o agencia de viajes para completar el proceso de reserva. Lo que no ofrece este motor de búsqueda es reservas de restaurantes pero para este caso en concreto no va a ser necesario. Esta aplicación proporciona toda la información que el tipo de usuario seleccionado necesita para reservar sus vacaciones en Split, Croacia.

Test de usabilidad

En primer lugar, pedí a los usuarios que realizaran un test que les envié a sus móviles, en el que les muestro una captura de la pantalla principal de la app Skyscanner durante 5 segundos y les formulo las siguientes preguntas:

· ¿Qué es lo que has visto en la imagen?

· ¿Qué puede hacer esta herramienta por ti?

· ¿Dónde buscarías información sobre vuelos?

Tras este pequeño test, los resultados nos indican que el diseño de la interfaz de skyscanner comunica bastante bien y de manera muy rápida su mensaje. Los tres usuarios entrevistados relacionaron la imagen con una app de reserva de viajes, vuelos, hotel, etc.

“Opción de vuelos, lugares y un mapa”

“I can book a trip or flight or hotel, a map with places open to travel”

Los usuarios sabían perfectamente qué podía hacer por ellos esta herramienta. Sus respuestas fueron todas en la misma dirección.

“To book a flight, hotel…”

Respecto a la última pregunta, todos los usuarios coincidieron en la página web a la que acudirían a buscar información sobre vuelos, Google. Y esto, principalmente, se debe por los siguientes motivos:

• Google es más fácil de usar y el diseño es más claro.
• Algunos usuarios usan apps como Skyscanner para comparar precios pero luego van a la página principal de la aerolínea o hotel, ya que piensan que al estar haciendo la reserva a través de un tercero el precio final será más caro.

En segundo lugar, pedí a los usuarios que realizaran las siguientes acciones dentro de la aplicación:

1. Reservar el mejor vuelo, según precio y horas de vuelo, para las fechas especificas del 1 al 7 de Julio del 2021 para cuatro personas.
2. Reservar un alojamiento que se ajuste al presupuesto de estas 4 personas y tenga localización en la playa de Bacvice. (dónde se encuentra el ocio nocturno).
3. Reservar un coche de alquiler con el que desplazarse en el lugar de destino.

Después de que los usuarios realizaran estas tres acciones, los principales puntos débiles que encontraron fueron los siguientes:

• Disparidad de precio entre Skyscanner y las páginas a las que te redirecciona para hacer la reserva. En algunas ocasiones los usuarios seleccionaban un vuelo dentro de la app y al ir a la página de la aerolínea este ha cambiado.
• Al ser redirigido a la página de un proveedor externo, aparecen sugerencias y anuncios que no tienen nada que ver con la reserva que el usuario está tratando de hacer.
• El diseño de la interfaz debería ser más estético y minimalista. Gran parte del tiempo de navegación del usuario en al app, fue para comprender todo el popurrí de información que había en la pantalla. Parecían estar buscando una pelota de tenis en un matorral.
• Cuando los usuarios terminaron con la acción de buscar un vuelo y les indiqué la de buscar un alojamiento, hicieron click atrás sin haberse fijado que dentro de la pestaña que estaban podían acceder también a la de hoteles.
• Los filtros, que podrían ayudar a realizar una búsqueda más rápida y sencilla, son prácticamente obviados por el usuario. Al no ser usados, el usuario pasa una gran parte de tiempo deslizándose de arriba abajo y viceversa hasta que encuentra el vuelo.
• A la hora de reservar un alojamiento, el mapa de google maps se ve muy pequeño y el usuario no lo utiliza. Utilizan la barra de búsqueda pero no suele ser tan efectiva como Google maps.

Principales problemas para solucionar.

• Exceso de información en la pantalla que se muestran los vuelos. Tan solo podemos observar un vuelo muy abajo después de un mensaje de alerta Covid y una opción para filtrar la búsqueda en función de billetes flexibles.

• Barra de navegación. Cuando pulsamos en vuelos, dentro de esta pestaña podemos acceder a hoteles pero no queda muy claro que se pueda hacer porque no es intuitivo. Además, debería dejar acceder a los alquileres de coches también.

• Filtros. No se ven muy bien entre tanto texto y, por tanto, no suelen usarse.

• Mapa de Google Maps. En la pestaña de hoteles el mapa se ve muy pequeño.

Soluciones propuestas

• Pantalla de vuelos.

Minimicé el tamaño de la alerta de viaje Covid e introduje directamente lo que el usuario quiere ver, los vuelos. Eliminé la opción de búsqueda de billetes flexibles porque eso puede hacerse a través del filtro.

• Barra de navegación.

Apliqué la misma que tienen en su página web, ya que me parece bastante clara e intuitiva.

• Filtro.

Introduje el mismo botón de filtro que se encuentra en la pestaña de búsqueda de hoteles.

• Google Maps. Agrandé el mapa.

Conclusiones

Considero que, las entrevistas y el análisis posterior del comportamiento de los usuarios, son fundamentales para el correcto desarrollo del rediseño de una página web o aplicación. He visto las entrevistas repetidas bastantes veces y en cada vez encontraba algo nuevo.

Para rediseñar las pantallas, me he ayudado de algunas aplicaciones las cuales me gusta su arquitectura de la información y diseño visual; y del propio Skyscanner. Por ejemplo, en la página web encontramos la misma barra de navegación que he introducido en mi diseño de la app. El botón del filtro lo he sacado de la pestaña de búsqueda de hoteles también. De manera, que he usado los mismos componentes de la interfaz para cada pantalla y el resultado ha sido más claro e intuitivo.

Este ha sido un ejercicio que quiero volver a repetir cuando acabe el bootcamp, ya que considero que todavía me queda mucho por aprender.