01
THE PROBLEM
01
THE PROBLEM
The Urban Wear
The Urban Wear
The Urban Wear
Simplifying cross-brand journey, an app that brings together high-street and luxury brands in a single platform, solving the frustration of inconsistent sizing with a universal size guide and AR try-on.
Simplifying cross-brand journey, an app that brings together high-street and luxury brands in a single platform, solving the frustration of inconsistent sizing with a universal size guide and AR try-on.
Simplifying cross-brand journey, an app that brings together high-street and luxury brands in a single platform, solving the frustration of inconsistent sizing with a universal size guide and AR try-on.
Role
Product Designer [Passion Project]
Timeline
7 weeks
Platform
mobile
Digital shopping often feels disconnected, separated by endless tabs and inconsistent size charts. The Urban Wear synchronizes the world’s leading retailers into a single, intuitive interface. Leveraging real-time AR visualization and universal sizing logic, the platform removes the barriers to purchase, allowing every shopper to explore and buy across their favorite brands with absolute confidence.
Digital shopping often feels disconnected, separated by endless tabs and inconsistent size charts. The Urban Wear synchronizes the world’s leading retailers into a single, intuitive interface. Leveraging real-time AR visualization and universal sizing logic, the platform removes the barriers to purchase, allowing every shopper to explore and buy across their favorite brands with absolute confidence.
Project Motivation
Online shopping has evolved into a disjointed experience that places a heavy cognitive load on the consumers. From managing multiple accounts to navigating inconsistent sizing standards across various brands, the process has become more about managing logistics than the joy of discovery. The drive behind this project was to explore how this fragmented journey could be unified into a single, intuitive flow.
Project Motivation
Online shopping has evolved into a disjointed experience that places a heavy cognitive load on the consumers. From managing multiple accounts to navigating inconsistent sizing standards across various brands, the process has become more about managing logistics than the joy of discovery. The drive behind this project was to explore how this fragmented journey could be unified into a single, intuitive flow.
Project Motivation
Online shopping has evolved into a disjointed experience that places a heavy cognitive load on the consumers. From managing multiple accounts to navigating inconsistent sizing standards across various brands, the process has become more about managing logistics than the joy of discovery. The drive behind this project was to explore how this fragmented journey could be unified into a single, intuitive flow.
02
THE SOLUTION
02
THE SOLUTION
Solution at a glance
The Urban Wear transforms the disjointed retail landscape into a centralized ecosystem. By integrating different brands into a single interface, the platform eliminates the logistical hurdles of modern e-commerce.
Unified Brand Ecosystem: Eliminates "tab-fatigue" by consolidating brands into a single, cohesive feed. This removes the need for multiple accounts and allows for effortless discovery across the entire fashion landscape.
AR-Driven Confidence: Bridges the gap between the screen and the fitting room using augmented reality. By providing real-time visual fit verification, the platform removes sizing anxiety and significantly reduces the likelihood of returns.
One-Tap Universal Checkout: Replaces the fragmented multi-site checkout process with a singular, streamlined transaction. Users can purchase from multiple retailers at once, removing the repetitive data entry that leads to cart abandonment.
Solution at a glance
The Urban Wear transforms the disjointed retail landscape into a centralized ecosystem. By integrating different brands into a single interface, the platform eliminates the logistical hurdles of modern e-commerce.
Unified Brand Ecosystem: Eliminates "tab-fatigue" by consolidating brands into a single, cohesive feed. This removes the need for multiple accounts and allows for effortless discovery across the entire fashion landscape.
AR-Driven Confidence: Bridges the gap between the screen and the fitting room using augmented reality. By providing real-time visual fit verification, the platform removes sizing anxiety and significantly reduces the likelihood of returns.
One-Tap Universal Checkout: Replaces the fragmented multi-site checkout process with a singular, streamlined transaction. Users can purchase from multiple retailers at once, removing the repetitive data entry that leads to cart abandonment.
Solution at a glance
The Urban Wear transforms the disjointed retail landscape into a centralized ecosystem. By integrating different brands into a single interface, the platform eliminates the logistical hurdles of modern e-commerce.
Unified Brand Ecosystem: Eliminates "tab-fatigue" by consolidating brands into a single, cohesive feed. This removes the need for multiple accounts and allows for effortless discovery across the entire fashion landscape.
AR-Driven Confidence: Bridges the gap between the screen and the fitting room using augmented reality. By providing real-time visual fit verification, the platform removes sizing anxiety and significantly reduces the likelihood of returns.
One-Tap Universal Checkout: Replaces the fragmented multi-site checkout process with a singular, streamlined transaction. Users can purchase from multiple retailers at once, removing the repetitive data entry that leads to cart abandonment.
03
RESEARCH & DISCOVERY
03
RESEARCH & DISCOVERY
Discovery
To evaluate the complexity of current retail landscape, I conducted semi-structured interviews centered on a behavioral deep-dive.
The key component was a live Email Audit Task, where participants were asked to trace their cross-brand purchase histories and return logs from the past three months.
This data, combined with a contextual inquiry into their browser habits, allowed me to construct a User Journey Map that visualized the transition from inspiration to logistics, highlighting the specific friction points where users typically disengage.
Discovery
To evaluate the complexity of current retail landscape, I conducted semi-structured interviews centered on a behavioral deep-dive.
The key component was a live Email Audit Task, where participants were asked to trace their cross-brand purchase histories and return logs from the past three months.
This data, combined with a contextual inquiry into their browser habits, allowed me to construct a User Journey Map that visualized the transition from inspiration to logistics, highlighting the specific friction points where users typically disengage.
04
04
DESIGN PROCESS
DESIGN PROCESS
Wireframes
Wireframes
The gray box testing
The gray box testing
The gray box testing
I conducted low-fidelity prototype testing using the "gray-box" testing method. This allowed me to strip away visual distractions and focus purely on the information architecture and interaction logic. Through this process, I identified three key areas for improvement:
I conducted low-fidelity prototype testing using the "gray-box" testing method. This allowed me to strip away visual distractions and focus purely on the information architecture and interaction logic. Through this process, I identified three key areas for improvement:
I conducted low-fidelity prototype testing using the "gray-box" testing method. This allowed me to strip away visual distractions and focus purely on the information architecture and interaction logic. Through this process, I identified three key areas for improvement:
1. Unified Cart Clarity:
Testing showed that mixing products in the same cart page caused "list fatigue," so I added Brand Headers and Visual Dividers to help users categorize purchases and manage their budget by retailer.
1. Unified Cart Clarity:
Testing showed that mixing products in the same cart page caused "list fatigue," so I added Brand Headers and Visual Dividers to help users categorize purchases and manage their budget by retailer.
1. Unified Cart Clarity:
Testing showed that mixing products in the same cart page caused "list fatigue," so I added Brand Headers and Visual Dividers to help users categorize purchases and manage their budget by retailer.
2. Budget First Discovery:
Participants requested a way to prevent "price shock" across a fragmented marketplace, leading me to implement a Price Range Scale in the filter section.
2. Budget First Discovery:
Participants requested a way to prevent "price shock" across a fragmented marketplace, leading me to implement a Price Range Scale in the filter section.
2. Budget First Discovery:
Participants requested a way to prevent "price shock" across a fragmented marketplace, leading me to implement a Price Range Scale in the filter section.
3. AR Accessibility & Onboarding:
Users with little to no AR experience struggled with spatial positioning and camera alignment. To lower the barrier to entry, I designed a "Pro-Tip" Onboarding Page and a Body-Skeleton Overlay that provides real-time visual cues, guiding users on exactly where to stand and how to align their bodies for a perfect virtual fit.
3. AR Accessibility & Onboarding:
Users with little to no AR experience struggled with spatial positioning and camera alignment. To lower the barrier to entry, I designed a "Pro-Tip" Onboarding Page and a Body-Skeleton Overlay that provides real-time visual cues, guiding users on exactly where to stand and how to align their bodies for a perfect virtual fit.
3. AR Accessibility & Onboarding:
Users with little to no AR experience struggled with spatial positioning and camera alignment. To lower the barrier to entry, I designed a "Pro-Tip" Onboarding Page and a Body-Skeleton Overlay that provides real-time visual cues, guiding users on exactly where to stand and how to align their bodies for a perfect virtual fit.
05
05
THE DESIGN
THE DESIGN
Final Designs & Key Features
Final Designs & Key Features
Onboarding Screens
Onboarding Screens
Onboarding Screens
Home Screen
The home feed was designed around a single insight from research - users weren't struggling to find products, they were struggling to manage them across brands.
The architecture prioritizes retrieval over discovery: Recently Viewed anchors returning users, curated picks reduce cold-start friction, and category tabs let users narrow without leaving the feed.
Every section earns its place by solving a specific drop-off point identified in testing.
The home feed was designed around a single insight from research - users weren't struggling to find products, they were struggling to manage them across brands.
The architecture prioritizes retrieval over discovery: Recently Viewed anchors returning users, curated picks reduce cold-start friction, and category tabs let users narrow without leaving the feed.
Every section earns its place by solving a specific drop-off point identified in testing.
Scroll to explore
Home Screen
The home feed was designed around a single insight from research - users weren't struggling to find products, they were struggling to manage them across brands.
The architecture prioritizes retrieval over discovery: Recently Viewed anchors returning users, curated picks reduce cold-start friction, and category tabs let users narrow without leaving the feed.
Every section earns its place by solving a specific drop-off point identified in testing.
The home feed was designed around a single insight from research - users weren't struggling to find products, they were struggling to manage them across brands.
The architecture prioritizes retrieval over discovery: Recently Viewed anchors returning users, curated picks reduce cold-start friction, and category tabs let users narrow without leaving the feed.
Every section earns its place by solving a specific drop-off point identified in testing.
Scroll to explore
06
06
CONCLUSION
CONCLUSION
Future Scope
Future Scope
Future Scope
AI Personal Stylist: Integrating an LLM to suggest outfits based on user calendar events (e.g., "Style me for a wedding in Italy") and personal style preferences.
Virtual Wardrobe Integration: A "Scan Your Closet" feature using the phone’s camera to digitize items the user already owns, allowing them to see how new purchases from different brands will look with their current wardrobe.
Social Styling & Co-Shopping: A "Share Look" feature where friends can view and vote on AR outfits in real-time, or a "Group Cart" where friends can style each other before committing to a purchase.
AI Personal Stylist: Integrating an LLM to suggest outfits based on user calendar events (e.g., "Style me for a wedding in Italy") and personal style preferences.
Virtual Wardrobe Integration: A "Scan Your Closet" feature using the phone’s camera to digitize items the user already owns, allowing them to see how new purchases from different brands will look with their current wardrobe.
Social Styling & Co-Shopping: A "Share Look" feature where friends can view and vote on AR outfits in real-time, or a "Group Cart" where friends can style each other before committing to a purchase.
AI Personal Stylist: Integrating an LLM to suggest outfits based on user calendar events (e.g., "Style me for a wedding in Italy") and personal style preferences.
Virtual Wardrobe Integration: A "Scan Your Closet" feature using the phone’s camera to digitize items the user already owns, allowing them to see how new purchases from different brands will look with their current wardrobe.
Social Styling & Co-Shopping: A "Share Look" feature where friends can view and vote on AR outfits in real-time, or a "Group Cart" where friends can style each other before committing to a purchase.
AR Fitting Room
AR Fitting Room
The AR onboarding addresses the biggest drop-off in virtual try-on: users not knowing where to stand.
A body-skeleton overlay guides alignment in real time, making the feature accessible to first-time AR users without a tutorial.
The AR onboarding addresses the biggest drop-off in virtual try-on: users not knowing where to stand.
A body-skeleton overlay guides alignment in real time, making the feature accessible to first-time AR users without a tutorial.
Browse & Filter
Browse & Filter
The filter system was designed to prevent 'price shock' across a fragmented marketplace - a direct response from gray box testing where users felt overwhelmed discovering price gaps between brands mid-browse.
Category, size, color and price range filters work together so users shop with confidence before committing.
The filter system was designed to prevent 'price shock' across a fragmented marketplace - a direct response from gray box testing where users felt overwhelmed discovering price gaps between brands mid-browse.
Category, size, color and price range filters work together so users shop with confidence before committing.
Product to Purchase
Product to Purchase
Product to Purchase
The end-to-end purchase flow was designed to eliminate the biggest friction point identified in research, managing separate checkouts across brands.
A unified cart consolidates multi-brand purchases into a single transaction, with brand headers keeping items organized.
One address, one payment, one confirmation, regardless of how many retailers are involved.
The end-to-end purchase flow was designed to eliminate the biggest friction point identified in research, managing separate checkouts across brands.
A unified cart consolidates multi-brand purchases into a single transaction, with brand headers keeping items organized.
One address, one payment, one confirmation, regardless of how many retailers are involved.
The end-to-end purchase flow was designed to eliminate the biggest friction point identified in research, managing separate checkouts across brands.
A unified cart consolidates multi-brand purchases into a single transaction, with brand headers keeping items organized.
One address, one payment, one confirmation, regardless of how many retailers are involved.
Key Research Findings
The "Visualization Gap" : Static 2D images prevent users from gauging how garments from different brands work together. Users currently lack a way to virtually "style" cross-brand outfits, leading to uncertainty and session drop-offs.
The Sizing Lottery : A lack of cross-brand consistency forces users to "bracket" (buying multiple sizes). Without a way to verify fit digitally through AR, users face a frustrating cycle of manual returns and financial holds.
Fragmented Logistics The 3-month email audit proved that shopping across 6+ retail silos is a logistical burden. Managing separate accounts and tracking updates leads to "account fatigue" and high cart abandonment.
The following insights were synthesized from the interview sessions and email audits, revealing the critical pain points in the user journey :
Key Research Findings
The "Visualization Gap" : Static 2D images prevent users from gauging how garments from different brands work together. Users currently lack a way to virtually "style" cross-brand outfits, leading to uncertainty and session drop-offs.
The Sizing Lottery : A lack of cross-brand consistency forces users to "bracket" (buying multiple sizes). Without a way to verify fit digitally through AR, users face a frustrating cycle of manual returns and financial holds.
Fragmented Logistics The 3-month email audit proved that shopping across 6+ retail silos is a logistical burden. Managing separate accounts and tracking updates leads to "account fatigue" and high cart abandonment.
The following insights were synthesized from the interview sessions and email audits, revealing the critical pain points in the user journey :
Key Research Findings
The "Visualization Gap" : Static 2D images prevent users from gauging how garments from different brands work together. Users currently lack a way to virtually "style" cross-brand outfits, leading to uncertainty and session drop-offs.
The Sizing Lottery : A lack of cross-brand consistency forces users to "bracket" (buying multiple sizes). Without a way to verify fit digitally through AR, users face a frustrating cycle of manual returns and financial holds.
Fragmented Logistics The 3-month email audit proved that shopping across 6+ retail silos is a logistical burden. Managing separate accounts and tracking updates leads to "account fatigue" and high cart abandonment.
The following insights were synthesized from the interview sessions and email audits, revealing the critical pain points in the user journey :
User journey map
User journey map
User journey map
02
THE SOLUTION
Discovery
To evaluate the complexity of current retail landscape, I conducted semi-structured interviews centered on a behavioral deep-dive.
The key component was a live Email Audit Task, where participants were asked to trace their cross-brand purchase histories and return logs from the past three months.
This data, combined with a contextual inquiry into their browser habits, allowed me to construct a User Journey Map that visualized the transition from inspiration to logistics, highlighting the specific friction points where users typically disengage.
03
RESEARCH & DISCOVERY
04
DESIGN PROCESS
Wireframes
05
THE DESIGN
Final Designs & Key Features
Scroll to explore
Home Screen
Home Screen
The home feed was designed around a single insight from research - users weren't struggling to find products, they were struggling to manage them across brands.
The architecture prioritizes retrieval over discovery: Recently Viewed anchors returning users, curated picks reduce cold-start friction, and category tabs let users narrow without leaving the feed.
Every section earns its place by solving a specific drop-off point identified in testing.
The home feed was designed around a single insight from research - users weren't struggling to find products, they were struggling to manage them across brands.
The architecture prioritizes retrieval over discovery: Recently Viewed anchors returning users, curated picks reduce cold-start friction, and category tabs let users narrow without leaving the feed.
Every section earns its place by solving a specific drop-off point identified in testing.
The AR onboarding addresses the biggest drop-off in virtual try-on: users not knowing where to stand.
A body-skeleton overlay guides alignment in real time, making the feature accessible to first-time AR users without a tutorial.
AR Fitting Room
Digital shopping often feels disconnected, separated by endless tabs and inconsistent size charts. The Urban Wear synchronizes the world’s leading retailers into a single, intuitive interface. Leveraging real-time AR visualization and universal sizing logic, the platform removes the barriers to purchase, allowing every shopper to explore and buy across their favorite brands with absolute confidence.
Browse & Filter
The filter system was designed to prevent 'price shock' across a fragmented marketplace - a direct response from gray box testing where users felt overwhelmed discovering price gaps between brands mid-browse.
Category, size, color and price range filters work together so users shop with confidence before committing.