Ux researcher and Ux designer: I was responsible for both strategic and planning and visual design.

Problem Statement

Many women struggle to find outfits that reflect their personal style, especially for specific occasions. The process can be time-consuming and frustrating, often involving endless browsing without clarity on what suits their taste. Additionally, many women face challenges in styling pieces from their existing wardrobes, feeling uncertain about how to create cohesive looks.

• Occasion-Based Recommendations: Personalized outfit suggestions tailored to specific events or occasions.
  

• Focus on Women's Fashion: Designed specifically for women's style needs.
  

• Personalized Style Preferences: Recommendations based on a user’s unique tastes and preferences.
  

• Diverse Brand Selection: Each outfit includes items from a variety of brands for a customized look.
  

• Increase Customer Engagement: Foster a loyal customer base through interactive features and personalized shopping experiences.
  

Business Goals

Target Users

Women who struggle to decide what to wear for various occasions and need assistance in creating stylish outfit sets tailored to specific events.

Our team of 2 followed a Double Diamond approach based on the Design Thinking methodology. It was not a linear path; we bounced between stages as the project progressed.

Qualitative Research

A major challenge during user research was finding women who actively used outfit-planning apps, limiting insights from real users.

To address this, I interviewed 8 women who shop online but don’t use outfit-planning apps. I asked them to try a few similar apps, and afterward, they shared their experiences and challenges as new users.

By framing the challenge this way, I was able to gain meaningful insights into why these apps might not be widely adopted yet, and how the user experience could be improved to attract more users.

Competitive Analysis

In this research phase, we reviewed similar applications to gain an initial understanding of essential and important features. This will help us better understand user needs with more information in the next steps.

We analyzed comparable applications in a specific category and conducted a SWOT analysis. This helped us identify useful strengths for our project and find ways to turn their weaknesses and threats into opportunities to improve our design.

Persona

Empathy Map

Journey Map

To wrap up our research, we created a user journey map to analyze the current experience of selecting and purchasing outfit sets. This helped us identify key touch points, challenges, and opportunities for enhancing a seamless shopping journey for our users.

Task Flow

User Flow

Information Architecture

Challenge and Solutions

After analyzing our research data and understanding user needs, we developed solutions to address their concerns and integrated them into our design.

We sketched some ideas and designed low-fidelity wireframes that would allow us test and get feedback quickly.

Sketches

Mid-Fidelity Wire Frames

To accelerate our design process, we developed a complete UI kit that includes templates, components, and design elements. This kit enables us to build a smooth interface efficiently, ensuring consistency and smooth implementation throughout the project.

Design System

High-fidelity Mockups

On-boarding Screens

Iteration and Usability Test

Questions Screens

Home Page Screen

Style Me Screens

Navigation Bar

Product Page

Checkout Page Screens

Throughout the project, we went through multiple iterations, driven by the insights we gained from usability tests. These tests were instrumental in shaping our decisions and constantly enhancing our project.

1. We noticed that users didn’t clearly understand they could access their closet on this page, so we decided to adjust the layout to make it more intuitive.

We decided to place the "Choose from Gallery" and "Take Photo" options at the same level, while making the "Closet" option more prominent for easier access.

2. In our initial design, users had difficulty finding individual prices within the set. We initially added an eye icon, but users didn’t understand its purpose.

Based on feedback, we replaced eye icon with a dollar icon, and during the third usability test, users were able to easily follow the task and find the prices.

3. Initially, we designed a set of three scrolling images to guide users in taking photos of their clothes. However, during the first usability test, we found that users didn’t realize these images could be scrolled.

To enhance clarity, we redesigned the section by adding numbered indicators and partially displaying the next image to suggest scrolling. This guides users intuitively to scroll and explore the content further.

To enhance clarity, we redesigned the section by adding numbered indicators and partially displaying the next image to suggest scrolling. This guides users intuitively to scroll and explore the content further.

A/B Testing