top of page
StyleHub: A personalized fashion website
UI/UX Case Study
Web Design



Tools Used!





StyleHub is a personalized fashion shopping website designed to provide users with AI outfit recommendations, virtual try-on features, and smart styling assistance. This app helps users find clothing that matches their unique style, body type, and color preferences while enhancing the online shopping experience with seamless UI/UX.
Project Overview



Reduce decision fatigue by offering curated fashion picks based on user preferences
Provide a personalized shopping experience with AI-driven outfit recommendations.
Enhance user confidence through virtual try-on and color-matching AI analysis.
Most of the existing e-commerce sites offer an overwhelming number of choices without style guidance, making it difficult for users to find the perfect and suitable outfit.
Decision fatigue
lack of personalized recommendations
1
3
2
Solutions
Reduce decision fatigue by offering curated fashion picks based on user preferences
Problem Statement
Uncertainty about fit and color
Target Audiance
Young Professionals (Ages 20-35)
Gen Z & Millennials (Ages 18-30)
Busy Shoppers & Minimalists



Design Thinking Process

EMPATHIZE
DEFINE
IDEATE
PROTOTYPE
TEST
Research
User Persona
Brainstorming
Wireframes
Usability Check
Survey
Journey Map
Card Sorting
Visual Design
Survey Insight
User Interview
Empathy Map
User Flow
Prototype
Improvements
Project Timeline
Project Timeline
UI Design
UX Research
EMPATHIZE
PROTOTYPE
DEFINE
TEST
IDEATE
Day 1
Add
Day 3
Day 5
Day 7
Day 8
Day 10
Day 14
Quatitative Research

Quantitative research is a method used to collect and analyze numerical data to identify patterns, relationships, and trends. This research focused on Surveys about users’ shopping habits, favorite fashion platforms, and struggles with online shopping.
1. How often do you shop for clothes online?
Once a month or more
Every few months
Only on special occasions

What is your biggest challenge when shopping for fashion online?
Choosing the right color for my skin tone
Too many options, hard to decide
Lack of personalized recommendations

How important is personalized fashion recommendation for you?
I prefer AI-driven suggestions
I prefer to pick everything manually
Neutral, I don’t mind either way
3.
Have you ever used a virtual try-on feature while shopping?
Yes, and I found it helpful
No, but I would love to try it
No, I prefer traditional shopping
4.


Olivia’s Persona


User Persona
A user persona is a fictional profile representing your target user, based on research. It includes details like age, goals, pain points, and behaviors to help designers understand user needs. Personas keep the design process user-focused, ensuring solutions align with real user expectations.
Olivia’s empathy map

Jake’s Persona

Jake’s empathy map

Information Architecture
Information architecture (IA) is the process of organizing, structuring, and labeling content in a way that makes it easy for users to find and navigate information. It focuses on creating clear navigation paths, menus, and hierarchies to enhance user experience.

High-Fidelity Wireframes

Visual Design
What is unique in “StyleHub”
Create outfit
AI dress color suggestion
In this section user can upload their photo and will get instant recommendetion of dresses which will suit their skin tone.
Suitable Color
This is results of dress color test. User will know what type of color dress will suit them and why
Search
Search your dream outfits like tops, pants, skirts

These are add button.
User can can multiple outfits and
create their dream
outfits.
Add
Personalized outfit
These are some outfits recommendation. this outfits are suitable for user’s skin tone
Virtual Try-on
Try-on
Here users can see virtually how that outfit will actually look on them.
Edit outfits
Users can add or delete any items to make there dream outfits and try-on here.

Personalized quiz
Quiz
This quiz section will help users to get personalized outfits suggestion.

Some UI Design













Thanks for scrolling
bottom of page