Spring 2021
Sustainable custom clothing
Transforming Fashion Through Personalization
Designing a website helping people create personalized & sustainable clothing
Product
Web Application
Skills
Product Design
Heuristic UX Audit
User research & usability testing
Visual & interactive prototyping
My Role
UX/UI Designer & Researcher
Timeline & Status
2 months
Designing a website helping people create personalized & sustainable clothing
In my final course project, our group of 4 designers was tasking with creating a digital platform that helps customers to customize clothing, promoting both sustainability and personalization.
Unlike traditional fashion retailers, the goal of “Custom Fitz” stands out by integrating digital innovation into the shopping experience. Customers can tailor garments to their exact preferences using unique customization features, ensuring a perfect fit and style while reducing waste associated with mass production. As one of the few brands globally adopting this approach, the goal was to create a seamless, intuitive, and engaging online platform that enhances the shopping journey while aligning with the brand’s sustainable mission.
Project goal
Design an online platform that will provide users with seamless shopping experience by offering customization, intuitive search filters, and fit assurance through technology.
Understanding the users and their main problems
What we learned
Main issues
Most of users usually have size and fitting problems.
Users are often disappointed when they can't can't visualize the final look of their customized clothing.
The majority of users consider quality as their main concern.
Users often struggle to find clothing for formal and special occasions, seeking more unique styles and outfits that match their personal preferences.
How might leverage digital innovation to make online shopping for custom clothing more interactive and engaging?
Researching customers & competitors
Competitor analysis
we analyzed 8 competitors to understand their features and user flows, gathering valuable insights to shape our UX strategy. While these websites are successful in their own right, we identified gaps in their customization workflows, which lacked simplicity and failed to fully meet user expectations.
Common challenges
After putting together all of our research findings, we grouped our insights together and identified patterns that are important to recognize.
User pain points
Opportunity
How can we make personalized clothing accessible while minimizing environmental impact?
Defining the site map
To organize the pages, sections, and contents and specify how they are interconnected, we did a Card Sorting process with our potential users and based on that we created the following diagram as a part of Information Architecture, showing the structure and hierarchy of the website.
Early designs
We started out the wireframes by focusing on ideation which helped us map out the paths without getting in too much details. Then we went through a couple rounds of iteration before the final content was developed.
Bringning it to life
We started off by creating the mood board. we were drawn to muted natural colors to emphasis on sustainability. Green evoked a calm yet comforting feeling. Overall, I envisioned the website to be clean and light yet, easily accessible
Usability testing
It was time to introduce the first concept to users.
We created high-fidelity versions of the wireframes for usability testing. Participants were asked to navigate through 2 tasks:
1- Visual Search & Customization
Upload an image of a desired look, explore similar items, and customize one based on personal style and preferences.
2- Product Discovery & Customization
Search for a dress using filters or categories and customize the selected item to match specific preferences.
Throughout the sessions, we observed participants’ interactions, noted usability pain points, and gathered qualitative feedback to refine the user flow, improve clarity, and ensure the customization experience felt seamless and engaging.
Users can upload an image of a dress to find similar styles available on the platform. From there, they can personalize the design and tailor it to fit their body shape, ensuring a truly customized clothing experience.
After multiple iterations and usability testing, we discovered that the “Shop the Look” feature resonated most with users. This feature helps them visualize styling options for each item, making the customization process more intuitive and inspiring.
Organizing product categories was a challenge, so we combined filters by clothing type and occasion to better match how users shop.
To enhance discovery, we also introduced a visual search feature, allowing users to upload outfit images and find similar styles based on key elements like color and pattern. This helped create a more intuitive and personalized browsing experience.
To enhance discovery, we also introduced a visual search feature, allowing users to upload outfit images and find similar styles based on key elements like color and pattern. This helped create a more intuitive and personalized browsing experience.
To ensure accurate sizing, we introduced a pop-up body scanning tool that guides users through a quick, AI-powered measurement process.
For those less comfortable with digital tools, a video tutorial. is available to help them take manual measurements with confidence and ease.
For those less comfortable with digital tools, a video tutorial. is available to help them take manual measurements with confidence and ease.
Multiple steps customization
In the initial version, users had to navigate through multiple steps by clicking a “Next” button repeatedly, making the customization process lengthy and tedious. This added unnecessary friction and impacted the overall experience.
Seamless One-Page Customization
To improve usability and efficiency, the final version introduced a single-page customization interface, allowing users to see and select different customization steps seamlessly. Additionally, real-time visualization at each step provides immediate feedback on design choices, helping users confidently refine their selections and reducing uncertainty about the final product. These enhancements create a more intuitive, engaging, and efficient customization journey while minimizing frustration.
Smart sizing & measurement
To enhance accuracy and ease in the customization process, we introduced a smart sizing method that offers two options tailored to different user preferences.
AI-Powered Body Scanning
For users seeking a quick and precise measurement process, a step-by-step AI measurement experience is available via a pop-up. This feature enables customers to generate unique measurements effortlessly, ensuring a perfect fit with minimal effort.
Guided Manual Measurement
Understanding that some users may feel hesitant about digital scanning, we integrated a video-assisted guide to help them take measurements manually. This ensures they can confidently input their size with greater accuracy.
Measuring success
As I look back at my project goals, my hope for the website is to ultimately create a positive impact on people and environment by accomplishing the following:
What did I learn
Enhancing the financing flow
I learned that speaking directly with our potential users was invaluable. By understanding their real experiences, I gained insight into their mindset and could design a website that’s both relevant and easy to use. During user research and usability testing, participants were genuinely excited to choose a model and iterate it based on their personal taste.
Prioritizing accesibility and ease of use over visual
This was crucial since online clothing–shopping platforms must serve a wide range of users. In the future, I’d like to explore AI assistant technology more deeply and discover how designers can leverage it to ensure every type of user with different desires benefits from the product.
Next project
Ongoing 2025
Retail Account Management
Optimizing the user experience of financing management for +500k users