
Año
Julio 2025
Rol
UX/UI
Herramientas
Figma
Adobe Illustrator
Adobe Photoshop
Yee-Haul es un proyecto que surge del reto de desarrollar una aplicación desde cero, abarcando todas sus fases: investigación, diseño y prototipado.
En la primera fase, "observar", me dediqué a comprender el contexto y a explorar en profundidad las necesidades de los usuarios. Para ello utilicé técnicas como Desk research, Netnografía, Research questions, Benchmarking, DAFO, Encuestas y Entrevistas, que me permitieron recopilar y contrastar información valiosa sobre el mercado, la competencia y los hábitos de los potenciales usuarios. Todo este material sirvió como base para la posterior fase de síntesis, donde se organizaron y dieron sentido a los hallazgos. (Pulsar cada diapositiva para ampliar)

Desk research

Netnografía

Research questions

Benchmarking

DAFO

Encuesta

Encuesta

Entrevista
Tras recopilar toda la información en la fase de "observar", llegó el momento de darle forma y significado. En la etapa de "sintetizar" transformé datos y respuestas en una mirada más humana y tangible sobre los usuarios. A través del User Persona, el Mapa de Empatía, el Customer Journey y la Matriz de Necesidades, conseguí poner cara a los hallazgos, entender cómo piensan, qué sienten y qué obstáculos encuentran en su día a día. Este paso me permitió convertir la investigación en una base clara e inspiradora para avanzar con soluciones realmente conectadas con las personas.

User persona

User persona

Mapa de empatía

Mapa de empatía

Customer journey

Customer journey

Matriz de necesidades
En la fase de "idear", el foco estuvo en transformar la comprensión del usuario en oportunidades de diseño y propuestas de valor. A partir de los Findings e insights obtenidos, utilicé distintas metodologías como la Matriz de utilidad y viabilidad, la técnica In-Out y la priorización MoSCoW, que me ayudaron a filtrar y organizar las ideas más relevantes. Este proceso culminó en la definición de la Propuesta de Valor y el Business Model Canvas, dos herramientas clave para dar coherencia al proyecto y sentar las bases de un modelo sostenible y centrado en el usuario.

Findings e insights

Matriz de utilidad y viabilidad

In-Out

MoSCoW

Propuesta de valor

Business Model Canvas
En la fase de "diseñar", el reto fue dar forma visual y funcional a la aplicación a partir de todo lo aprendido. El proceso comenzó con la creación del SiteMap y el Flowchart, que estructuraron la arquitectura y los flujos principales. Después, desarrollé wireframes y un sistema de diseño que asegurara coherencia y consistencia en todos los elementos visuales. A continuación, detallé las pantallas y secciones de la app y la web, siempre teniendo en cuenta la experiencia del usuario. Finalmente, realicé tests con usuarios y un análisis de accesibilidad, lo que permitió validar y mejorar la propuesta para garantizar que fuera clara, usable e inclusiva.

SiteMap

Flowchart

Wireframe

Explicación del sistema de diseño

Explicación del sistema de diseño

Secciones y pantallas de tu app y web

Testing con usuarios

Análisis de accesibilidad del diseño
Así quedó finalmente el resultado del proyecto: una aplicación acompañada de su versión web en formato landing page, pensada para presentar la propuesta de manera clara y atractiva. La landing funciona como puerta de entrada al universo de la app, comunicando su valor, funcionalidades principales y estilo visual, mientras que la aplicación refleja todo el trabajo de investigación, síntesis, ideación y diseño realizado durante el proceso.



Pantallas de Yee-Haul
A continuación, se presentan dos videos demostrativos que permiten visualizar la experiencia de navegación tanto en la aplicación como en la landing page. En ellos se muestra cómo interactúa el usuario con las diferentes pantallas, secciones y funcionalidades, ofreciendo una visión clara del flujo y la usabilidad del proyecto.
La aplicación comienza con un onboarding de tres pantallas, que introduce al usuario en la propuesta y explica de manera visual sus principales funcionalidades. Después, se pasa al inicio de sesión, donde es posible crear un perfil personalizado añadiendo una foto.
Una vez dentro, se accede a la pantalla de inicio, en la que se muestran una pestaña de tiempo y una prenda recomendada del día, además de un acceso al perfil, desde el cual el usuario puede puntuar la app.
Desde allí, la navegación se ramifica en diferentes secciones:
Ropa: reúne todas las prendas del usuario, organizadas por categorías como partes de arriba, partes de abajo y favoritas. Además, permite añadir nuevas prendas y pulsar sobre cada una para ver detalles y descubrir ropa relacionada.
Explorar: un espacio de inspiración con outfits de famosos divididos por estilos. Al seleccionarlos, se pueden descubrir las prendas que los componen y cuáles de ellas coinciden o se parecen a las que el usuario ya tiene en su armario.
Estilo: concentra los outfits personales del usuario organizados por estilos, e incorpora el creador de outfits, una sección innovadora que genera combinaciones con coherencia estética según el estilo seleccionado.
De esta forma, la app integra gestión de armario, inspiración y creación de looks, ofreciendo al usuario una experiencia completa y personalizada.
La landing page tenía como objetivo presentar la aplicación de forma visual y atractiva, transmitiendo su esencia y principales funcionalidades de un solo vistazo. Su diseño buscaba captar la atención del usuario, generar interés y motivar la descarga de la app. En ella se explicaba en qué consiste la aplicación, destacando su propuesta de valor: gestionar tu armario, inspirarte con outfits y crear combinaciones personalizadas según tu estilo.
Por último, muestro cómo organicé el proyecto en Figma, estructurándolo de manera clara y funcional. El archivo se dividió en diferentes secciones: estilos, donde se definieron tipografías, colores y espaciados; el UI Kit, que reúne todos los componentes reutilizables; y finalmente el diseño y prototipado, donde se desarrollaron las pantallas y se construyeron los flujos interactivos de la aplicación. Esta organización permitió mantener coherencia visual, agilidad en el diseño y facilidad a la hora de iterar en el prototipo.

Estilos

UI Kit

Diseño

Componentes
La realización de este proyecto me permitió recorrer todas las fases del diseño, desde la investigación hasta el prototipado, aplicando herramientas y metodologías reales del sector. Gracias a ello entendí la importancia de observar, sintetizar, idear y diseñar de forma estructurada, siempre con el usuario en el centro. Además, reforcé mi manejo de Figma y la organización de un sistema de diseño coherente, lo que me ayudó a transformar un reto en una propuesta digital completa, funcional y atractiva.