Os comparto mi propuesta de valor de la aplicación MiUOC y el resultado final junto a breve video demostrativo.
Mi UOC es una aplicación minimalista donde se intenta que el usuario disfrute de una buena experiencia del usuario al utilizarla. Para lograr esto, se han minimizado al máximo la cantidad de botones y opciones que el usuario realmente no necesita o bien no va a utilizar tan frecuentemente y que pueden llegar a causar algún problema para el usuario (como sucede muchas veces en muchas aplicaciones que usamos a diario).
Además por primera vez una aplicación integra el elemento de sala virtual, donde los usuarios pueden reunirse entre ellos de forma sencilla y compartir experiencias o dudas con sus compañeros de máster. Actualmente el diseño de la app se centra en la conectividad entre usuarios mediante la sala de estudio, los grupos y los chats individuales . Y por otro lado la visualización de contenido para poder crecer profesional o personalmente.
También se ha querido mostrar de forma más gráfica como es realmente la interacción con la aplicación cuando el usuario la utiliza. Por este motivo se ha elegido el software Axure 10 para realizar el prototipado.
En mi caso he decidido analizar por un lado la app de LinkedIn y por la otra la app de Discord ya que soy usuario de ambas y las dos tienen implementadas soluciones que me gustaría incluir en mi nueva aplicación con alguna adaptación. Por eso he decidido analizarlas, pero centrándome principalmente en dos de las funcionalidades que tienen cada una, por un lado la opción de crear grupos y tener chats privados de LinkedIn y por otro lado los canales de voz y texto de Discord.
Estas 4 funcionalidades aparecerán dentro de mi futura aplicación así que entender como funcionan y que aspectos no están bien, ayudará a desarrollar una mejor aplicación.
Por tanto, os comparto el trabajo que he realizado.
Vueling es una compañía aérea low-cost creada en 2004. Vueling ofrece a sus usuarios vuelos a precios bajos gracias a la contratación directa a distancia y a la flexibilización del precio de los billetes al máximo. La contrapartida a sus precios low-cost es el cobro de suplementos o cargos adicionales por todo tipo de servicios y gestiones, para aquel que los desee utilizar.
¿Porqué Vueling?
Se ha escogido analizar la plataforma de Vueling, ya que es uno de los portales webs que más utilizo cuando viajo con mis amigos o mi pareja dado los precios que ofrece y lo fácil que es comprar vuelos en su página. Además como el inicio de esta entrega me coincidió con la búsqueda de vuelos para el puente de todos santos, me pareció muy oportuno analizarla y comprobar que principios se habían seguido y cuales no.
Metodología utilizada.
Para realizar el análisis de la página web elegida se ha decidido hacerlo des del punto de vista del usuario que interactúa con dicha web. Para hacerlo se han buscado distintos ejemplos de buen uso y de mal uso de los 10 principios de usabilidad de Jakob Nielsen, que explican como generar soluciones con una buena usabilidad. A continuación se encontrará una breve descripción de cada principio y un ejemplo bueno y malo. Posteriormente, se han listado los principios mal utilizados y se ha mostrado que grado de gravedad presentan.
Evaluación Heurística.
1. Principio de visibilidad del estado del sistema
Todo diseño debe mantener siempre informado al usuario de todo lo que sucede. De esta forma el usuario puede reaccionar y actuar si es preciso.
En el ejemplo que he escogido, el usuario está adquiriendo unos billetes de avión a través de la web de Vueling. El usuario debe seguir un proceso donde se le van a ir pidiendo distintos datos y que realice ciertas acciones. Sin embargo, si se analiza como muestra Vueling este proceso, se puede ver que se trata de una Mal Uso, ya que el usuario sabe cuantas fases tiene el proceso, pero no sabe de que se tratan y por tanto, no puede organizarse y prepararse para cuando le pidan algún tipo de información. Este sistema puede llegar a desubicar o frustrar al usuario que quiere realizar una compra.
Una simple solución sería añadir una breve descripción en cada uno de los puntos. También se podría añadir un icono que simplificara el profeso de forma gráfica. Si se añadiera un tiempo medio por etapa igual se podría ayudar al usuario a organizarse o saber si tiene tiempo de terminarlo.
Vista detalle de la barra de progreso:
VALORACIÓN: Mal Uso, no se muestra ni descripción ni tiempo restante para completar el proceso.
2. Principio de relación entre el sistema y el mundo real
Para que el usuario se sienta cómodo es muy importante que la aplicación o en este caso la web utilice un lenguaje que usuario comprenda o le sea familiar.
Hoy en día el ERROR 404 NOT FOUND, para mucha gente joven es algo normal y que ya hemos integrado en nuestro vocabulario. Y aunque no sepamos que significa lo asociamos que la web no funciona. Sin
embargo, cuando te preocupas por el usuario y sabes que quizás no está familiarizado con este tipo de errores, puedes ir un poco más allá y aun que algo no esté funcionando, explicárselo para que lo entienda. Como muestra de una fantástica ejecución y una un Buen Uso, están las páginas de error de Vueling. En ellas no aparece el código de un error, sino que un mensaje divertido muy bien relacionado con el producto que ofrece esta plataforma, mostrando:
“Vaya, ¡esta página está de vacaciones!”.
Y además rápidamente te guían de nuevo a otra página en funcionamiento.
VALORACIÓN: Buen Uso, se aplica correctamente.
3. Principio de control y libertad del usuario.
Si por casualidad el usuario comete un error mientras navega por una página web, debe tener una forma de remediar ese error de forma rápida.
Es decir, el usuario debería tener el control en todo momento de lo que está sucediendo. Un ejemplo de un Buen Uso podría ser el que tiene implementado Vueling durante su proceso de compra. Si el usuario ha seleccionado una fecha para el vuelo de ida o de vuelta y desea modificarla porque o bien s h a equivocado o bien quiere buscar la que tenga el mejor precio, puede hacerlo utilizando la sección de días que se muestra en la imagen. Con este panel, el usuario puede controlar la situación y decidir que días quiere coger el vuelo sin tener que iniciar una nueva búsqueda cada vez.
Otro punto de control para el usuario es el logo de Vueling, en todas las páginas, si el usuario se siente perdido o quiere volver al inicio puede hacerlo apretando el logo que aparece arriba a la izquierda.
VALORACIÓN: Buen Uso.
Tras haber utilizado la web en varias ocasiones me fijé que el usuario tiene un control sobre todas las acciones que realiza durante todo el proceso de compra de un billete, pero si en algún momento quisiera guardar o compartir una oferta con algún amigo, no podría hacerlo. Esto a mi parecer es un Mal Uso de este principio ya que el usuario no puede decidir continuar en otro momento, guardar número el vuelo y revisarlo más adelante.
VALORACIÓN: Mal Uso.
4. Principio de consistencia y estándares.
Para que el usuario sepa cómo debe actuar en todo momento hay que intentar utilizar las convenciones lógicas que ha establecido la sociedad. De este modo el usuario podrá aplicar los conocimientos básicos que tiene y que se acaban transformando en conocimientos transversales.
Un ejemplo de un Buen Uso que aplican la mayoría de las páginas web, como ya se ha explicado en un apartado anterior es la funcionalidad del logo de la marca que al hacer clic el usuario va a la página de inicio. Esta funcionalidad da al usuario acceso a un chaleco salvavidas en caso de estar perdido o no saber que debe hacer. LOGO = INICIO.
VALORACIÓN: Buen Uso, el usuario hace un uso intuitivo.
5. Principio de prevención de errores.
El usuario probablemente cometa errores durante su interacción con las plataformas, pero la tarea del diseñador es desarrollar soluciones capaces de minimizar estos errores. Por tanto, se tiene que intentar ayudar al usuario a que no cometa errores.
Un claro ejemplo de un buen uso es la función de autocompletar el texto en la barra de búsqueda. De este modo el usuario no introducirá un nombre de la ciudad o aeropuerto de forma errónea. Además también agiliza el proceso al autocompletar con texto predictivo.
Cuando el usuario empieza a escribir:
Cuando el usuario ya ha escrito suficientes caracteres restrictivos:
VALORACIÓN: Buen Uso
6. Principio de reconocimiento antes que recuerdo.
Para los usuarios es mucho más fácil reconocer cosas que ya conoce que intentar recordar lo que significan las cosas. Cuando alguien reconoce algo raras vez se equivoca, porque le es familiar. Sin embargo, cuando el
usuario debe recordar algo, el margen de error ya es bastante grande.
Un ejemplo de un Buen Uso que utiliza Vueling en su plataforma web, es la de indicar todas las secciones de la web mediante iconos conocidos y además con descripciones. De este modo el usuario sabe que se encontrará en todos los apartados de la web antes de acceder porque reconoce el icono y lo que significa.
Todo el mundo entiende el significado de los iconos y de una sola mirada se puede saber que se está explicando.
VALORACIÓN: Buen Uso
7. Principio de flexibilidad y eficiencia de uso.
Cuando se desarrolla una solución, siempre hay que tener en cuenta que va a ser utilizada por usuarios novatos (los cuales van a necesitar un soporte casi constante durante el uso de dicha solución) y también usuarios expertos, los cuales deben de poder navegar de una forma más fluida y rápida, por este motivo se les suele dar acceso a atajos para realizar funciones sencillas.
En esta plataforma un usuario experimentado, no tiene ninguna ventaja respecto a uno nuevo. No puede utilizar atajos o comandos rápidos para realizar acciones de forma más rápida. No es un problema muy grave, pero solo centrarse en usuarios nuevos puede traer consecuencias en un futuro próximo.
VALORACIÓN: Mal Uso
8. Principio de estética y diseño minimalista.
Como en toda solución o producto, la estética y el diseño de un producto son muy importantes a la hora de conectar con un usuario, por este motivo, si se quiere llegar a un público más amplio, se debe de mantener una estética cuidada y un diseño minimalista, es decir que no esté sobrecargado de adornos, funcionalidades o información innecesaria. En el caso de las soluciones visuales, si un usuario recibe demasiada información, se puede sentir perdido o desubicado.
Partiendo de este principio, des de mi propio punto de vista me parece que Vueling hace una Mal Uso de este principio en la “landing page” de su página web. Ya que está sobrecargada de opciones, ofertas, banners… Que sinceramente solo buscan que alguno de los elementos incentive o encienda algo en los usuarios que la visitan.
VALORACIÓN: Mal Uso
Sin embargo, durante el proceso de compra, a diferencia de otros portales de otras aerolíneas, si que tienen un diseño muy limpio, minimalista y simple, donde se juegan con 3 colores y el amarillo siempre es la opción de selección (substituyendo al verde ya que es el amarillo es el color corporativo de la marca). Siendo en este caso una Buen Uso del principio.
VALORACIÓN: Buen Uso
9. Principio de ayudar a los usuarios a reconocer, diagnosticar y recuperarse de errores.
A lo largo del proceso de compra, registro, inicio de sesión y otros procesos, es muy probable que el usuario cometa errores. Sin embargo, la plataforma debe de mostrar al usuario que errores ha cometido y como debe solucionarlos. Intentando mostrar siempre dichos mensajes de una forma clara y simple.
A continuación, se muestra un ejemplo de un Buen Uso que se aplica en la página de Vueling cuando el usuario quiere acceder a su perfil personal, donde se ha dado el caso que el usuario no ha introducido ningún dato y ha hecho clic en el botón de iniciar sesión. Es entonces donde el usuario recibe una alerta de que campos no ha rellenado y por tanto puede saber donde se encuentra el error.
VALORACIÓN: Buen Uso
Sin embargo, en la misma página web, cuando el usuario ha introducido texto en algunos de los campos y es erróneo, se le lleva a otra web donde se le muestra de nuevo un mensaje de error. En esta nueva alerta en cambio, no se le indica al usuario que campo ha introducido mal y encima se le presiona que solo tiene 3 intentos para introducir correctamente sus datos. A mi parecer esto es un ejemplo de Mal Uso, donde el usuario no recibe ningún tipo de ayuda y encima se le presiona para que complete una tarea de forma
correcta si no quiere sufrir consecuencias.
VALORACIÓN: Mal Uso
10. Principio de ayuda y documentación.
Siempre es importante ofrecer soporte al usuario para que, en caso de necesitar ayuda, sepa dónde puede encontrarla.
En el caso de esta web, como deben tener una gran cantidad de consultas diarias, han implementado un buen sistema de soporte dentro de la web. La ubicación de este apartado también es correcta, ya que en la mayoría de páginas web al final de todo se encuentran los datos de contacto.
A mi parecer aplican el principio correctamente y hacen un Buen Uso de este. Además si se entra dentro del apartado de Atención al cliente se puede ver como guían correctamente al usuario en todo momento.
Opciones de soporte y atención al cliente:
VALORACIÓN: Buen Uso
Listado según gravedad.
Ahora toca evaluar y listar todos aquellos ejemplos de usos incorrectos que se pueden encontrar en la página de Vueling. A continuación se ordenarán por gravedad y se mostrará alguna solución si se ha encontrado alguna.
? #1 – Principio de estética y diseño minimalista.? Muy Grave ?
Como se ha explicado anteriormente, al interfaz de usuario de la página de inicio de Vueling está muy sobresaturada de elementos llamativos con ofertas y oportunidades. Su objetivo, es tentar al usuario con alguna de las ofertas que se le ofrecen. Sin embargo, al ofrecerle tantas opciones seguramente el usuario se sentirá abordado de forma brusca, incomodo y hasta perdido ya que igual sin querer pulsará en un botón que no toca. Des de mi punto de vista, este tipo de diseños me recuerdan a los que utilizan las webs de descarga de contenido con muchos botones iguales para liar al usuario.
✅ Posible solución: Una posible solución podría ser que dado que esta compañía low-cost ya es muy conocida, su primera página fuese un simple buscado de vuelos como el que ya implementan. Pero sin ningún otro elemento. Luego en la barra de menú ofrecer distintos apartados por si el usuario lo necesitara de hoteles, coches e incluso ofertas.
? #2- Principio de relación entre el sistema y el mundo real ? Grave ?
Actualmente, cuando el usuario está comprando un billete, no puede saber cuales van a ser los siguientes pasos a seguir, el tiempo que va a tardar o lo que va a necesitar antes de poder acabar. De este modo, se podría dar el caso que algún usuario realizara todo el proceso hasta el final y entonces se diera cuenta que no lo puede terminar.
✅ Posible solución : La solución más sencilla, es que se implementen ICONOS y DESCRIPCIONES de los distintos pasos que va a seguir el usuario a lo largo del proceso. Además se podría añadir también un tiempo aproximado que va a necesitar para completar cada tarea. Por último, se podría implementar al inicio del proceso, una lista de los elementos que el usuario va a necesitar (DNI, tarjeta de crédito…;, de este modo el usuario se sentirá preparado incluso antes del proceso.
? #3 Ayudar a los usuarios a diagnosticar un problema ? Grave ?
Esta forma tan poco precisa de implementar las pantallas de error, es algo muy habitual en muchas de las páginas webs que existen hoy en día, en este caso, se trata del error en la pantalla de inicio de sesión. Cuando el usuario introduce alguno de los campos de forma incorrecta, solo se le avisa de forma muy sutil que algunos de los campos son incorrectos, pero no se especifica cuales y tampoco se destaca demasiado. Si se da el caso que un usuario poco experimentado recibe este error puede bloquearse y no saber como actuar…
✅ Posible solución: Para solucionar este ejemplo, se podrían hacer varias cosas, para empezar, cada vez que el usuario perdiera el «focus» del cuadro de texto del mail, que está rellenando la web comprobara si existe una cuenta con dicho correo y de no ser el caso, se marcara automáticamente en rojo y avisara al usuario. Posteriormente, si el usuario no introduce una contraseña correcta, se le avisara del mismo modo, pero dejando claro que campo es el incorrecto. A continuación se muestra un ejemplo de como se podría mostrar mejor el error. Como se v, es mucho mejor mostrar en que apartado existe un error para que el usuario le pueda poner remedio.
? #4- Principio de control y libertad del usuario. ? Grave ?
Que el usuario no tenga opción de guardar el proceso que ha hecho hasta el momento, guardar el número de vuelo para comprar el billete más adelante o incluso poder compartir el precio de un vuelo con un amigo. El usuario se puede llegar a sentir muy impotente al no poder guardar su proceso y tener que repetirlo de nuevo. Es decir el usuario pierde el control de las acciones que estaba realizando.
✅ Posible solución : Para este caso se me han ocurrido distintas opciones para solucionar el problema y darle de nuevo al usuario el control de la situación. Para empezar se podría añadir un botón de «me gusta» o «favoritos» para que el usuario marcara un vuelo que quiere seguir o comprar más adelante. También se podría añadir un botón de compartir para saber que opinan tus amigos acerca de la oferta.
? #5- Principio de flexibilidad y eficiencia de uso ? Poco Grave ?
Este último mal uso que explicaremos no es muy grave ya que no afecta de forma negativa en el uso de la plataforma, sin embargo, hace que el usuario más avanzado se sienta excluido y acabe cansándose de realizar todo el proceso de una forma poco ágil al no tener atajos.
✅ Posible solución : En este caso no se ha logrado encontrar con una solución directa, sin embargo, se podría desarrollar un portal con más parámetros de búsqueda o configuraciones de tal forma que el usuario más experto pudiera encontrar mucho más rápido aquello que busca. Se tendría que analizar con profundidad el uso que hace dicho usuario para logran desarrollar soluciones que mejoraran su usabilidad dentro de la web.
Bibliografía
Vueling Airlines. (n.d.). Vueling: vols barats a les principals ciutats europees. from https://www.vueling.com/ca
Pública 
Este es un espacio de trabajo personal de un/a estudiante de la Universitat Oberta de Catalunya. Cualquier contenido publicado en este espacio es responsabilidad de su autor/a.