FITCH
SIZE ASSISTANT
UI/ UX Design . Mobile App Design . UX Research
A fashion app extension designed for online commerce platforms, offering sizing guidance to users to help customers make confident purchasing decisions.
DESIGNER
Calista Christy Kartadinata
YEAR
2024
SOFTWARES
Figma . AutoCAD . Adobe Photoshop . ProCreate
FITCH
SIZE ASSISTANT
UI/ UX Design . Mobile App Design . UX Research
A fashion app extension designed for online commerce platforms, offering sizing guidance to users to help customers make confident purchasing decisions.
DESIGNER
Calista Christy Kartadinata
YEAR
2024
SOFTWARES
Figma . AutoCAD . Adobe Photoshop . ProCreate
FITCH
SIZE ASSISTANT
UI/ UX Design . Mobile App Design . UX Research
A fashion app extension designed for online commerce platforms, offering sizing guidance to users to help customers make confident purchasing decisions.
DESIGNER
Calista Christy Kartadinata
YEAR
2024
SOFTWARES
Figma . AutoCAD . Adobe Photoshop . ProCreate
UNDERSTANDING THE PROBLEM
Designing an app that seamlessly operates within another app — balancing bold, standout visuals with integration into its parent platform.
UNDERSTANDING THE PROBLEM
Designing an app that seamlessly operates within another app — balancing bold, standout visuals with integration into its parent platform.
UNDERSTANDING THE PROBLEM
Designing an app that seamlessly operates within another app — balancing bold, standout visuals with integration into its parent platform.
THE OBJECTIVE
Develop a user-friendly and precise online sizing experience to improve online apparel shopping satisfaction.
THE OBJECTIVE
Develop a user-friendly and precise online sizing experience to improve online apparel shopping satisfaction.
THE OBJECTIVE
Develop a user-friendly and precise online sizing experience to improve online apparel shopping satisfaction.
THE APP IDEA
THE APP IDEA
THE APP IDEA
Fitch is an app extension integrated in
online commerce platforms, assisting customers
in making fail-proof buying decisions.
Fitch is an app extension integrated in
online commerce platforms, assisting customers
in making fail-proof buying decisions.
Fitch is an app extension integrated in
online commerce platforms, assisting customers
in making fail-proof buying decisions.
SHAPING DESIGN WITH USER INSIGHTS
USER DRIVEN DESIGN
USER DRIVEN DESIGN
PRE-PRODUCTION SURVEY
Before development, I surveyed 75 participants aged 19-55 from five countries. The survey explored shopping behaviors and preferences for five initial concepts of online clothing fitting solutions. These insights informed the next steps of creating Fitch.
PRE-PRODUCTION SURVEY
Before development, I surveyed 75 participants aged 19-55 from five countries. The survey explored shopping behaviors and preferences for five initial concepts of online clothing fitting solutions. These insights informed the next steps of creating Fitch.
PRE-PRODUCTION SURVEY
Before development, I surveyed 75 participants aged 19-55 from five countries. The survey explored shopping behaviors and preferences for five initial concepts of online clothing fitting solutions. These insights informed the next steps of creating Fitch.
KEY INSIGHTS
KEY INSIGHTS
KEY INSIGHTS
Despite the majority preferring online shopping (57.3%), a significant percentage express concern over size (70.6%), emphasising the need for a better solution.
Despite 57.3% of participants using size guides, they rated as the second least preferred option. This likely contributes to the lack of confidence experienced by 89.4% of participants when selecting sizes online.
Among 4 initial solution ideas, the 3D modelling virtual try-on feature received the highest rating from 75 participants.
Despite the majority preferring online shopping (57.3%), a significant percentage express concern over size (70.6%), emphasising the need for a better solution.
Despite 57.3% of participants using size guides, they rated as the second least preferred option. This likely contributes to the lack of confidence experienced by 89.4% of participants when selecting sizes online.
Among 4 initial solution ideas, the 3D modelling virtual try-on feature received the highest rating from 75 participants.
CREATING A VISUAL STYLE GUIDE
THE VISUAL STYLE GUIDE
CREATING A VISUAL STYLE GUIDE
THE BRANDING CHALLENGE
Designing an app that seamlessly operates within another app — balancing bold, standout visuals with integration into its parent platform.
THE BRANDING CHALLENGE
Designing an app that seamlessly operates within another app — balancing bold, standout visuals with integration into its parent platform.
THE BRANDING CHALLENGE
Designing an app that seamlessly operates within another app — balancing bold, standout visuals with integration into its parent platform.
LOGO
LOGO
LOGO
An icon that communicates 'fitting room'.
An icon that communicates 'fitting room'.
An icon that communicates 'fitting room'.
COLOUR PALETTE
COLOUR PALETTE
COLOUR PALETTE
A stand-out main colour was chosen: red.
A stand-out main colour was chosen: red.
A stand-out main colour was chosen: red.
TYPOGRAPHY
TYPOGRAPHY
TYPOGRAPHY
Sans-serif: Neutral, adaptable.
Sans-serif: Neutral, adaptable.
Sans-serif: Neutral, adaptable.
BUTTON COMPONENTS
BUTTON COMPONENTS
BUTTON COMPONENTS
Primary — Secondary
Primary — Secondary
Primary — Secondary
UI CHARACTERISTICS
Simple and straightforward — for easy readability, flexibility, adaptability, and to avoid clashing with the branding of the client's app.
UI CHARACTERISTICS
Simple and straightforward — for easy readability, flexibility, adaptability, and to avoid clashing with the branding of the client's app.
UI CHARACTERISTICS
Simple and straightforward — for easy readability, flexibility, adaptability, and to avoid clashing with the branding of the client's app.
CREATING A VISUAL STYLE GUIDE
THE VISUAL STYLE GUIDE
CREATING A VISUAL STYLE GUIDE
UNVEILING THE USER PERSPECTIVE
THE VISUAL STYLE GUIDE
UNVEILING THE USER PERSPECTIVE
USER TESTING
I conducted one-on-one post production testing interviews with 5 participants. Below are the steps taken during the interviews and the key results derived from the process.
USER TESTING
I conducted one-on-one post production testing interviews with 5 participants. Below are the steps taken during the interviews and the key results derived from the process.
USER TESTING
I conducted one-on-one post production testing interviews with 5 participants. Below are the steps taken during the interviews and the key results derived from the process.
ROOM FOR IMPROVEMENTS
ROOM FOR IMPROVEMENTS
ROOM FOR IMPROVEMENTS
Initial button
Initial button
Initial button
The updated Fitch access button now includes micro-animations.
Every few seconds, animated text saying '3D Fit' appears, attracting users' attention and providing context to the element.
The updated Fitch access button now includes micro-animations.
Every few seconds, animated text saying '3D Fit' appears, attracting users' attention and providing context to the element.
The updated Fitch access button now includes micro-animations.
Every few seconds, animated text saying '3D Fit' appears, attracting users' attention and providing context to the element.
Custom Hair Tab
Custom Hair Tab
Custom Hair Tab
Users can now conveniently customise both their hairstyle and hair colour within the same tab, streamlining the interface for enhanced efficiency.
Users can now conveniently customise both their hairstyle and hair colour within the same tab, streamlining the interface for enhanced efficiency.
Users can now conveniently customise both their hairstyle and hair colour within the same tab, streamlining the interface for enhanced efficiency.
ADD AVATAR
ADD AVATAR
ADD AVATAR
The addition of this feature enables users to create and save avatars within Fitch.
The drop-down menu is placed in the fitting room interface for convenient and quick access
This idea can be taken further to an avatar sharing feature, enabling users to access and save their avatars in other users’ account.
The addition of this feature enables users to create and save avatars within Fitch.
The drop-down menu is placed in the fitting room interface for convenient and quick access
This idea can be taken further to an avatar sharing feature, enabling users to access and save their avatars in other users’ account.
The addition of this feature enables users to create and save avatars within Fitch.
The drop-down menu is placed in the fitting room interface for convenient and quick access
This idea can be taken further to an avatar sharing feature, enabling users to access and save their avatars in other users’ account.
IMPROVED CHECKOUT
IMPROVED CHECKOUT
IMPROVED CHECKOUT
The updated checkout modal now pins the items currently being tried on by the avatar, offering users instant access to the items they are most likely interested in purchasing. Additionally, a "select all" button has been added for faster item selection.
This improvement enhances the navigation process during checkout.
The updated checkout modal now pins the items currently being tried on by the avatar, offering users instant access to the items they are most likely interested in purchasing. Additionally, a "select all" button has been added for faster item selection.
This improvement enhances the navigation process during checkout.
The updated checkout modal now pins the items currently being tried on by the avatar, offering users instant access to the items they are most likely interested in purchasing. Additionally, a "select all" button has been added for faster item selection.
This improvement enhances the navigation process during checkout.
KEY FEATURES
KEY FEATURES
KEY FEATURES
Personalised, size-accurate 3D avatar
Personalised, size-accurate 3D avatar
Personalised, size-accurate 3D avatar
Virtually mix & match clothing items
Virtually mix & match clothing items
Virtually mix & match clothing items
Sizing recommendations
Sizing recommendations
Sizing recommendations
Avatar save
Avatar save
Avatar save
BRINGING THE CONCEPT TO LIFE
BRINGING THE CONCEPT TO LIFE
BRINGING THE CONCEPT TO LIFE
FITCH IN A NUTSHELL
FITCH IN A NUTSHELL
FITCH IN A NUTSHELL
This project followed a complete cycle of research, ideation, prototyping, testing, and refinement [full documentation].
Inspired by the real-life experience of trying on clothes in stores, the app was designed to be intuitive and easy to use, leveraging familiar interactions to enhance user understanding.
This project followed a complete cycle of research, ideation, prototyping, testing, and refinement [full documentation].
Inspired by the real-life experience of trying on clothes in stores, the app was designed to be intuitive and easy to use, leveraging familiar interactions to enhance user understanding.
This project followed a complete cycle of research, ideation, prototyping, testing, and refinement [full documentation].
Inspired by the real-life experience of trying on clothes in stores, the app was designed to be intuitive and easy to use, leveraging familiar interactions to enhance user understanding.
© 2024 Calista Christy Kartadinata. All rights reserved.
© 2024 Calista Christy Kartadinata
© 2024 Calista Christy Kartadinata.