My Role

Project Timeline

1.

DISCOVER STAGE

Project Background

The e-commerce fashion industry has seen explosive growth, but online clothing shopping can be challenging due to the inability to physically try on clothes. This often leads to high return rates due to sizing and fit issues, impacting both customer satisfaction and the retailer's bottom line.

With consumer demands changing, the store of the future will look vastly different from what we are used to. Tech-savvy consumers now perceive digital solutions not as a luxury, but as an expected standard.

Using virtual try-on technology, fashion brands and businesses can blend the physical and virtual to create a customer experience that is safe, convenient, and efficient for customers, whether online or in-store.

Problem Statement

Customers struggle to visualize how clothes will look and fit on them when shopping online, leading to:

A. Increased purchase uncertainty: Online shoppers are often hesitant to buy clothes they cannot try on, resulting in lost sales opportunities;

B. High return rates: Inaccurate size and fit estimations lead to unnecessary returns, impacting revenue and logistics;

C. Negative customer experience: The frustration of receiving clothes that don’t fit can damage customer loyalty and brand perception

Project Goals

1. Enhance Customer Experience: Implement a seamless virtual try-on experience that allows customers to visualize how clothes will look and fit on their bodies - that will increase in customer satisfaction scores;

2. Reduce Return Rates: Decrease the number of returns due to sizing and fit issues by providing customers with an accurate preview of how the garment will look on them;

3. Increase Sales Conversion: Boost conversion rates by instilling confidence in customers' purchasing decisions through the virtual try-on feature;

4. Technology Integration and Performance: Seamlessly integrate camera technology or 3D body scanning to ensure a smooth and accurate virtual try-on experience;

5. User Adoption and Engagement: Encourage widespread adoption of the virtual try-on feature among website visitors and increase user engagement;

2.

DEFINE STAGE

User Surveys

I put together a survey and asked 9 people with online shopping experience to share their opinion. That will give me valuable insights into user behaviors, preferences, and pain points:

A. Understand User Needs and Preferences: Determine what information and features users prioritize when shopping online for different outfits and clothing accessories;

B. Identify common pain points and challenges users encounter when shopping online

C. Evaluate Information Accessibility and Clarity: understand how easy users can access information and what they expect to see when shopping online;

D. Explore User Preferences for Additional Features: Identify any additional features or functionalities that users would find valuable in their online shopping experience.

Affinity Mapping

*** After I conducted surveys, I used Affinity mapping technique to organize and group mentioned ideas, information, and data into patterns and common themes:

A. Online shopping platforms people use a lot;

B. Factors that influence people decision to use a virtual try-on feature;

C. Challenges, Frustrations & Pain Points;

D. Improvements that will enhance user future online shopping experience;

Target Audience

Age: While generally open to all ages, the primary target audience is likely Gen Z and Millennial generations (roughly 18-40 years old). These groups are known to be tech-savvy and early adopters of new technology;

Online shoppers: Individuals who frequently shop for clothes online and are most open to new tools and online experiences.

Fashion-forward individuals: Users with a strong interest in exploring new styles and trends without physical limitations;

Body-conscious individuals: People who struggle with finding the right fit or are self-conscious about trying on clothes in person can benefit from the app's convenience and privacy.

Location: Users in regions with limited access to physical stores;

User Personas

*** Based on user research and data, I created User Personas to better understand and empathize with the needs, goals, behaviors, and preferences of the potential users.

Frequent Online Shopper

Body-conscious individual

SOLUTION STAGE

3.

User Flow

User Flow helped me create a detailed map of the user experience, from initial entry points to specific actions and final outcomes.

This enabled me to focus on design that is user-centric, intuitive, and efficient, resulting in a more satisfying and engaging experience for users.

User Story Map

User story map is an effective tool for planning, organizing, and prioritizing the project.

It helped me to visualize user's journey through the application and prioritize features based on their importance to the user journey

Activities

High-level tasks users can do in a digital product

Steps

Steps users go through to complete the activity above

Details

Granular, discrete interactions to complete the step above

Mid-Fidelity Wireframes

Used low-fidelity wireframes

A. to outline the structure and layout of the app;

B. to focus primarily on the overall information architecture and user interface elements;

C. to quickly explore multiple design ideas and concepts

Home + Search + Category + Sub category + Product

Add favorite product to
a) Wishlist;
b) Shopping Cart + also Virtually Try it on

Virtual Try On Feature:
1. Set your body type;
2. Upload photo;
Confirm additional body measurements

Onboarding process + Virtual Fitting Room

Component Library

⇨

High-Fidelity Wireframes

Home + Search + Category + Sub category + Product

Add favorite product to
a) Wishlist & b) Shopping Cart + also select option “Virtually Try it on”

Virtual Try On Feature:
1. Set your body type;
2. Upload photo;
Confirm additional body measurements

Onboarding process

A) Use your avatar to virtually try on apparel;
B) Edit Avatar Settings:
- Body Measurements;
- Body Shape

PROTOTYPE STAGE

4.

Usability Test and Results

I conducted a Usability Test -

Goal - to identify any pain points, usability issues, and areas for improvement that could enhance the user experience and increase user satisfaction and engagement;

5 Participants;

Iterations

Based on User Testing Interviews I submitted following changes:

1. added spinners for body measurements entry (height, dress size, bra size and other);

2. added “Information” icon for advanced body measurements (waist, hips, inseam) with popup images explaining each of them;

3. added educational guide boxes explaining what tools are available in a Virtual Room;

4. added “Save Avatar” button to give user an option to save avatar settings for future visits;

5. rephrased wording from “Clear Data” to “Reset Avatar”;

6. added “Save” button to give user a confirmation of a selected option;

Final Design

TASK 1

➜ Start from Adidas store Home page

➜ Click “Shopping“, choose “Hoodies“, find and click on “Hiking Fleece“

➜ Select “Virtual Try-on“ option;

TASK 2

➜ Go through Onboarding screens

➜ Choose Avatar Body Measurements

➜ Upload photo

➜ View quick instructions how to use Virtual Try-on Feature

TASK 3

➜ Select different products to try on the Avatar

➜ Go to Avatar Settings

➜ Explore Basic and Advanced Body Measurements

➜ Go to Body Shape and change Figure Type

MOVING FORWARD

5.

Research is the backbone of any successful UX/UI project, and adding a Virtual Try-on (VTO) feature to Adidas online store was no exception. Conducting thorough research allowed me to understand the needs, preferences, and pain points of the target users, ensuring that the final product would effectively meet their requirements.

Here is why researh was crucial for this project

A. Understanding User Needs: Through user interviews and surveys I gained valuable insights into what shopping enthusiasts look for in an online sport store . This helped me prioritize features and design elements that would provide the most value to users.

B. Identifying Pain Points: Research helped me identify the pain points users experienced with existing online e-commerce stores. Understanding these pain points allowed me to address them effectively in my design, ensuring a more seamless user experience.

C. Validating Design Decisions: By testing prototypes and gathering feedback from potential users, I was able to validate design decisions and make necessary adjustments before finalizing the UX/UI of the application.

Surprising findings from the research

A. Perceived Novelty: Despite the potential of VTO technology to revolutionize online shopping, it remains a novelty for most consumers. Many have only heard of the feature, and few have tried it, often without success;

B. Body Diversity Concerns: There are significant concerns regarding VTO technology’s ability to accommodate a diverse range of body types, figures, and skin tones. This has raised questions about the inclusivity of the technology

These findings indicate that while VTO technology has the potential to enhance the online shopping experience significantly, there are still barriers to its widespread acceptance and effectiveness. Addressing these issues will be crucial for the successful implementation of VTO features in e-commerce platforms.

Now that the initial UX/UI design is complete, the next step would be to expand the platform with additional features.

Next steps and additions to the product roadmap

A. Enhance Realism and Accuracy: Invest in advanced AR/VR technologies to improve the realism of virtual try-ons. This includes better 3D models and more accurate body tracking to ensure that the virtual items fit and move realistically with the user

B. Personalized Recommendations: Use an AI-driven size and fit recommendation system that suggests products based on the customer’s previous interactions and preferences. Provide customers with the ability to mix and match different items to create complete sportswear outfits.

C. Real-Time Feedback: Implement real-time feedback mechanisms to allow customers to adjust products virtually and see changes instantly;