Moodvie

¡Una película para cada estado de ánimo!

Contexto

El mercado cinematográfico ofrece múltiples opciones a los consumidores, ya sean apasionados del cine u ocasionales.

Actualmente, los servicios de streaming se posicionan en el mercado como una de las opciones preferidas para la visualización de películas. Específicamente, Netflix cuenta con gran aceptación entre el público latinoamericano, al sumar el 45% del total de usuarios. Por ello, no nos sorprenden los datos donde colocan a México como el país número uno con el mayor número de miembros que utilizan la plataforma todos los días.

Acerca de

Es una Web App de recomendación de películas. En Moodvie nos encargamos de que tu elección de película sea fácil y rápida, para eso te sugerimos las películas con base a tu estado de ánimo.

Reto

Diseñar una Web App con la información de la API de OMDb (The Open Movie Database).

Modalidad

Equipo:

Diana Lizbeth: Front End

Karen Amicone: Front End

Brenda Vázquez: UX Designer

Mi rol

UX Designer y maquetación

Tiempo

Hackaton en Laboratoria (dos días).

Sprint 1

En nuestro primer sprint decidimos crear una Web App para jóvenes-adultos (personas de 25 a 40 años), que al terminar su jornada de trabajo desean ver una película en la comodidad de su casa y no quieren demorarse mucho en la elección. Por lo tanto ideamos un producto que muestre aquellas mejor rankeadas por Rotten Tomatoes y también ofrezca a nuestros usuarios la opción de obtener sugerencias con base a su estado de ánimo.

Herramientas

Encuestas
Prototipo de mediana fidelidad
Puntos de referencia
Testeo de usabilidad

La información de las encuestas nos revelo el interés de las personas en cuanto a una aplicación de películas. Los principales problemas que deseábamos solucionar fueron:

Saber las críticas de las películas.
Tener recomendaciones personalizadas.

Por lo que nuestras historias de usuario fueron:

Yo como usuario quiero consultar una página de recomendaciones de las películas mejor rankeadas por Rotten Tomatoes.
Yo como usuario quiero poder recibir recomendaciones de películas con base a mi estado de ánimo para elegir más rápido

El primer nombre que le pusimos a nuestro producto fue Películas Entomatadas.

Este fue el primer reto como UX designer y sabíamos la importancia de las pruebas de usabilidad. Decidimos salir al parque a testear la primera propuesta, estructuramos dos tareas y una serie de preguntas para conocer la perspectiva de los usuarios. Nos apoyaron 7 usuarios de entre 25 a 35 años (5 mujeres y 2 hombres).

"El concepto es confuso, son dos temas sin conexión"

"Me gustaría ver la ficha técnica o algún tipo de reseña"

"Las imágenes no se relacionan con las etiquetas"

Sprint 2

La retroalimentación obtenida de las pruebas de usuario nos movilizó a hacer modificaciones tanto al concepto como al contenido. Teniendo como resultado Moods&Movies.

Donde nuestro principal objetivo es ofrecer sugerencias a nuestros usuarios con base a su estado de ánimo, les pareció útil que las sugerencias fuesen de esa forma; y la mayoría de nuestros testeados no les servía de referencia la clasificación según Rotten Tomatoes.

Por lo que nuestro nuevo producto quedó de la siguiente forma:

En el contexto de la Hackaton recurrimos a una mentoría, la cual nos sirvió para idear un nombre más corto y retirar la pantalla de inicio. El objetivo recayó en facilitar el acceso a la tarea principal de la Web App y fomentar el uso.

Lanzamos un Google Form para evaluar la pertinencia de las categorías y constatar la asociación de la etiqueta con el tipo de películas sugeridas.

Después, hicimos un Test A/B para la elección del color. Nosotras elegimos de manera arbitraria el color rosa. Durante la investigación de los puntos de referencia descubrimos una tendencia en las páginas o aplicaciones dedicadas al cine, se utiliza el azul o rojo. Además, las pruebas con los usuarios nos mostraron las pautas de asociación con los estilos de las dos empresas reconocidas de cine en el país.

Versión 1

Versión 2

Resultado

El entregable consistió en una Web App funcional desarrollada con Javascript (ES6). Contribuí con la maquetación. Aprendí a utilizar Materialize y los fundamentos de CSS Grid.

Intrucciones para usuarios

Ingresa a la página MoodVie
Haz click en el botón que coincida con tu estado de ánimo . Te recomendaremos dos películas de acuerdo con tu mood.
En cada tarjeta de las películas recomendadas 🎥 podrás consultar el título, año, duración de la película, director, reparto y sinopsis.
Para leer la sinopsis da click al ícono de tres puntitos verticales que se encuentra en la esquina superior derecha de la tarjeta de información, debajo del poster de la película.
Si las recomendaciones no te apetencen, da click al botón de regresar ⬅️ y vuelve a consultar.
También contamos con un buscador para que puedas consultar la sinopsis de las películas por título