The problem

The problem

Many people nowadays struggle to create outfits due to lack of time, insecurities about their styling skills and expertise.

Many people nowadays struggle to create outfits due to lack of time, insecurities about their styling skills and expertise.

The solution

The solution

I created a platform on both mobile and desktop environment, allowing individuals to generate personalised outfits by analysing their needs & preferences.

I created a platform on both mobile and desktop environment, allowing individuals to generate personalised outfits by analysing their needs & preferences.

Tools

Figma, Notion

Timeline

6 months

Role

Product designer

DISCOVERY

Research interviews

Online research & statistics

Competitive analysis

User persona

DEFINE

Synthesis

Design challenge

DEVELOP

User flow

Sketches

Wireframe

Usability testing

DELIVER

The solution

The solution

Style guide

Key takeaways

Next steps

Understanding the client experience

To start off, I took advantage of my professional experience and working in a boutique gave me the advantage to ask questions to “real clients” and also professionals from the fashion industry.

1

Price consciousness

A significant majority of participants are highly price-conscious when it comes to choosing garments.

2

Brand Comparison

People tend to engage in extensive brand comparison before making a purchase.

3

Hybrid shopping first

Individuals value the online shopping convenience but they still maintain the “try-on” experience.

Gathering online statistics

To intensify my understanding of the current market landscape, I researched key statistics related to the UK clothing sector. These insights highlight trends and challenges that are crucial for creating a successful product strategy:

To intensify my understanding of the current market landscape, I researched key statistics related to the UK clothing sector. These insights highlight trends and challenges that are crucial for creating a successful product strategy:

To intensify my understanding of the current market landscape, I researched key statistics related to the UK clothing sector. These insights highlight trends and challenges that are crucial for creating a successful product strategy:

43%

43%

In 2022, clothing sector is the first online category with the highest percentage accounting for 43% in the UK.

34%

34%

UK shoppers end up returning 34% of clothing items they buy online.

60%

60%

Of people in UK between the ages of 25 and 44, said they use both in-store and online channels, promoting a hybrid shopping.

Lack of competitors

To understand what was available on the app store, I looked at the possible competitors and I found out that only one app(StichFix) was available, so to have similar inspirations I decided to explore virtual chatbots to gather more experiences from indirect competitors.

To understand what was available on the app store, I looked at the possible competitors and I found out that only one app(StichFix) was available, so to have similar inspirations I decided to explore virtual chatbots to gather more experiences from indirect competitors.

I like

Showing products with top ratings

I don’t like

Available only for a period of time throughout the day

I like

Provides picture of type of different garments as an example

I don’t like

Limited options with selected brands

I like

Simple and easy to use interface, no icons or misleading buttons.

I don’t like

Complex process to get a result

Defining the research

1

Hybrid shopping experience

A significant 60% of UK consumers prefer a hybrid shopping approach, utilising both in-store and online channels to make their purchases.

2

Limited competition

The fashion market has limited direct competition, with only one platform, "Stichfix," offering personalised outfit with a limited group of brands.

3

Affordable styling

Most people nowadays want to dress nicely without spending a fortune due to economic uncertainty.

The design challenge

The design challenge

“How can I design a virtual shopping assistant that seamlessly integrates both online and in-store shopping experiences in order to get a personalised outfit?”

“How can I design a virtual shopping assistant that seamlessly integrates both online and in-store shopping experiences in order to get a personalised outfit?”

“How can I design a virtual shopping assistant that seamlessly integrates both online and in-store shopping experiences in order to get a personalised outfit?”

User Flow

I created a user flow to map out the steps and interactions involved in the user's journey, visualising how well my idea aligns with the user's core goal and individual tasks.

Down below you find the main feedback from the users:

I created a user flow to map out the steps and interactions involved in the user's journey, visualising how well my idea aligns with the user's core goal and individual tasks.

Down below you find the main feedback from the users:

1

Absence of login page

Users jumped into the application without logging in, making it difficult to have a profile and save possible outfits.

2

Redundancy

There was a group of 3 interfaces including the avoid feature, users found it really repetitive.

3

No more options

Users did not have the opportunity to access a comprehensive list of items included in the outfit.

Sketches

I imagined Deborah, going through an easy to use interface that would embrace a personalised outfit questionnaire.

Down below, you can find some core features.

I imagined Deborah, going through an easy to use interface that would embrace a personalised outfit questionnaire.

Down below, you can find some core features.

1

Occasion selector

Empowers the user to go in depth and give extra details for a more tailored outfit recommendation.

2

Fit preference

It allows the users to express the desired fit for their outfit.

3

Printed filter

With a simple tap, users can easily exclude prints that don't align with their preferences.

Low fidelity wireframe

It was time for a visual representation through the wireframe, at this stage, I wanted to analyse the structure and functionality of every pages before moving to the visual design aspect.

It was time for a visual representation through the wireframe, at this stage, I wanted to analyse the structure and functionality of every pages before moving to the visual design aspect.

Feedback from usability testing

Positive comments

Style/fit cards along with selecting your own items were voted 8/10

Pain points

Issues with readability and lack of pictures in “my outfit page”

Idea/opportunity

“I would like have a spot where I have my saved outfits and I can see the availablity in stock”

High fidelity “before & after”

After the low fidelity was finished, I proceeded with the high fidelity prototype and conducted usability test on users.

After the low fidelity was finished, I proceeded with the high fidelity prototype and conducted usability test on users.

BEFORE

All the users found this interaction to be misleading in conveying the action of "avoiding" items.

All the users found this interaction to be misleading in conveying the action of "avoiding" items.

AFTER

Updated card with a red background and stroke for avoiding items from preferences

Updated card with a red background and stroke for avoiding items from preferences

BEFORE

5 out of 6 users requested a swipe gesture for visualising the pictures.

5 out of 6 users requested a swipe gesture for visualising the pictures.

AFTER

Changed into a carousel in order to bring the swipe gesture interaction and consistency with the other components.

Changed into a carousel in order to bring the swipe gesture interaction and consistency with the other components.

BEFORE

Majority of the users struggled to pick the hair colour and skin-tone.

Majority of the users struggled to pick the hair colour and skin-tone.

AFTER

With the usage of the algorithm, user can upload a picture providing the required information.

With the usage of the algorithm, user can upload a picture providing the required information.

With the usage of the algorithm, user can upload a picture providing the required information.

THE SOLUTION

THE SOLUTION

THE SOLUTION

Empowering fashion exploration

Individuals can personalise their fashion experience by choosing style, fit, colours and preferred items.

Inputting user details for tailored recommendations

The user can input specific details, including height, waist measurement, shoe size, budget and more, to customise the outfit."

Personalise your style journey with the styling questionnaire

Individuals can personalise their fashion experience by choosing style, fit, colours and preferred items.

05 STYLE GUIDE

Typography

Poppins

Google fonts

Aa

REGULAR

Aa

MEDIUM

Aa

SEMIBOLD

Color

Color

Grey palette

Grey palette

100

#ffffff

200

#f7f7f7

300

#D7D7D7

400

#848484

500

#5C5C5C

600

#484848

700

#111111

Primary colour

Primary colour

Interactive components

Interactive components

Default

Default

D7D7D7

FFFFFF

Animal

Check

Camouflage

Stripe

Floral

Geometric

Abstarct

Plaid

Negative

D00000

FFE1E1

Animal

Check

Camouflage

Stripe

Floral

Geometric

Abstarct

Plaid

Active

2A64C5

F7F7F7

Slim fit

This fit hugs the body closely

Regular fit

This fit provides a

roomier silhouette than the slim fit

Relaxed fit

This fit is loose-fitting in order to be a slightly oversized fit

Active

2A64C5

F7F7F7

Slim fit

This fit hugs the body closely

Regular fit

This fit provides a

roomier silhouette than the slim fit

Relaxed fit

This fit is loose-fitting in order to be a slightly oversized fit

Negative

D00000

FFE1E1

Animal

Check

Camouflage

Stripe

Floral

Geometric

Abstarct

Plaid

Interaction

Icons

06 FINAL EVALUATION

Final evaluation

Final evaluation

1

Misclick rate

Misclick rate

Misclick rate remained below 13%, indicating a successful improvement in user interaction and navigation.

Misclick rate remained below 13%, indicating a successful improvement in user interaction and navigation.

2

Useful platform

Useful platform

5 out of 6 users found the platform really useful to find a tailored outfit rather than browse several stores/websites.

5 out of 6 users found the platform really useful to find a tailored outfit rather than browse several stores/websites.

Next steps

Next steps

1

Test the iterated design again

Test the iterated design again

2

Speak to engineers to understand the feasibility of building this app

Speak to engineers to understand the feasibility of building this app

3

Further research to integrate Artificial intelligence within the platform

Further research to integrate Artificial intelligence within the platform

Next steps

Next steps

TAKEAWAY 1

Having a well-organised asset library is the key to creating a polished case study.

Having a well-organised asset library is the key to creating a polished case study.

Having a well-organised asset library is the key to creating a polished case study.

TAKEAWAY 2

Keeping things simple resulted in more cohesive and user-friendly designs.

Keeping things simple resulted in more cohesive and user-friendly designs.

Keeping things simple resulted in more cohesive and user-friendly designs.

Explore the final prototype

Explore the final

prototype

Thanks!

Thanks for taking your time to visit my portfolio, I hope to see you soon.