Vooy

Diseño de App para disfrutar de las películas y lugares que se muestran en las películas

Proyecto personal

Vooy

Duración del proyecto

Seis meses

Herramientas

Figma, Adobe XD, Google docs, Google slides, Maze, Zoom

Responsabilidades

Research, entrevista a usuarios, journey maps, wireframes, prototipo final, testeo.

Descripción general

Este proyecto fue desarrollado en el transcurso de mi diplomado de UX. Mi punto de partida era hacer algo que me gustara. Me encanta viajar y me gusta la cultura. Siempre que voy de viaje, antes de ir, intento ver todo sobre ese país para empezar ya a “viajar”, porque disfruto tanto de la preparación del viaje como durante. Esto viene a ser: leer libros, ver películas y series, escuchar canciones, entre otros. Ante esto, siempre me hacia falta un sitio donde poder encontrar todo catálogado por ubicación.

Necesidad

Conocer ubicaciones geográficas en Chile de las temáticas que quiero buscar a través de info real y consolidada

Problema

-Tiempo perdido en búsquedas -Fuente de información poco confiable -Info dispersa por páginas y foros

Solución

Entregar de una forma simple, rápida y fidedigna, información de localización sobre un tema cultural de interes determinado

Proceso de diseño

procesos

Análisis

Empiezo corroborando que existe un nicho y un público objetivo. Realizo entrevistas a perfiles diferentes, de más viajeros a menos, y de diferentes gustos y hobbies, para encontrar información que luego me ayude a construir las protopersonas.

image-1image-2
🎬 Usuario: Cinéfilo, Historiador, Viajero cultural, Lector empedernido, Seguidor apasionado.

Mapa de empatía

Empatizar con el usuario, esa es la clave. ¿De qué nos vale definir y desarrollar un producto sin ponernos en la piel de las personas para las que está pensado?. Por eso realice este mapa de empatía previo a las entrevistas a personas reales, basado en lo que veo, creo que siente y hace mi usuario objetivo.

mapa-empatia

Entrevistas y protopersonas

Entreviste a 25 personas, haciendo 15 preguntas a través de una encuesta realizada en Google Form. Esta entrevista fue hecha con un software de grabación de pantalla para poder guardar las reacciones de los usuarios frente a las preguntas. En base a todo esto surgieron algunos insight de los cuales dieron como resultado 3 perfiles de User Person. Estos vienen a ser arquetipos de persona (no es gente real).

encuesta
users

Benchmarking

Luego hice un Benchmark, donde mire la competencia junto con otras plataformas relacionadas. Después de esto, analice lo que me gustaba como también sus errores para mejorarlas en mi proyecto. Las siguientes plataformas son las que investigué sacando ideas para las funcionalidades y resolución de problemas.

apps

Basado en toda la investigación y a los hallazgos que obtuve en el Benchmark, pase a la parte de arquitectura de la Información para comenzar a crear el Sitemap junto con toda la estructura de la web y app.

mapa-navegacion

Este sería el proceso: al comienzo hago primeras bajadas de linea de la idea. Se incluyen formas de lo que podría ser un primer acercamiento a una interfaz. Luego itero en un wireframe más concreto para acabar con el diseño final de la app.

shopper-smart

Centrándome en el wireframe en baja Fidelidad (Low-Fi Wireframes), trabaje la estructura y las funcionalidades sin detenerme en la parte visual (por ahora). Para esto era super importante tener en mente la info que había sacado del Research.

mockup-baja

Guía de estilos

Y esta sería la identidad de Vooy. Elegí 4 colores que están en el logo para aplicarselos a las categorías. Son colores ligados al mundo cultural que transmiten alegría, energía, libertad, armonía y entusiasmo. Estas sensaciones son las que quería que los usuarios sintieran al usar la interfaz. Además, se establecieron dos colores grises que se usaron como base a lo largo de toda la app.

Se definieron 2 tipografías sans serif para darle simpleza y seriedad al proyecto. La tipografía Gibson, usada en sus variantes para títulos y destacados, se complementa perfectamente con la tipografía Poppins, aplicada en párrafos y demás textos.

ui-kit

Testeo

Realice diferentes métodos de evaluación para el testeo de Vooy. El primero fue el Test Heurístico con las 4 pantallas principales. Estás fueron revisadas por diferentes personas que me dieron su feedback para poder mejorarla.

Luego de estás mejoras, se realizo un Test de usabilidad, todas diferentes entre sí, que fueron grabadas por medio de una aplicación para ver sus reacciones al navegar por la interfaz. Considerando lo anterior, hice varios cambios posteriormente.

mockup-screens

Y por último, realice un Mapa de calor para saber si los usuarios hacían el recorrido o tocaban donde se pensaba que lo harían primero. Los resultados fueron estos que muestro a continuación.

mapa-calor

Con todos los test vistos anteriormente, quedo de forma más clara todas las oportunidades de mejora que tenía el proyecto. Inicialmente, hubieron muchas cosas que no veía a simple vista. Aunque yo era parte del público objetivo, no era el único que debía considerar. También aparecieron otros tipos de usuarios que mostraron diferentes puntos de vista.

¡Muchas gracias por tomarte el tiempo de ver todo el proyecto!