INDUSTRY:
PRODUCT DESIGN
CLIENT:
AI COLLECTIVE
YEAR:
2026
Twiice
Helping shoppers reduce clothing overconsumption through AI-powered wardrobe comparison
about.
Twiice is an AI-powered mobile application that helps users make more intentional clothing purchases by comparing potential purchases against items they already own. Using computer vision and multimodal similarity search, users can photograph a clothing item and instantly discover whether they already have something visually similar in their wardrobe.
When I joined the project, the backend infrastructure and AI pipeline were already under development, but the product lacked a complete user experience. Working closely with the product manager, I designed the application's entire visual identity and user experience, from information architecture and wireframes to a scalable design system, interactive prototypes, and production-ready assets for the App Store.
The result was a polished mobile experience that transformed a complex AI workflow into an intuitive tool users could understand in seconds.
the problem.
Fast fashion and impulsive shopping often lead people to purchase clothing they already own without realizing it. While AI can identify visually similar garments, presenting those results in a way that feels trustworthy, understandable, and useful is a highly significant design challenge.
Our research found that users preferred a clean, minimal interface and valued features that made organizing and comparing clothing effortless. Core needs included uploading clothing items, categorizing garments, searching their closet, and quickly comparing new purchases against their existing wardrobe.
Our challenge became:
How might we transform a technically complex AI comparison system into an experience that feels simple, approachable, and effortless to use while shopping?
understanding the product.
Before opening Figma, I wanted to understand both the technology and the people using it.
I began by meeting with the product manager to understand the application's goals, reviewing user research, and learning how the underlying AI similarity engine functioned. I was then provided with the required screens, user flows, and technical constraints for the MVP.
Rather than immediately designing interfaces, I translated these technical requirements into a user-centered experience by defining the application's information architecture, identifying missing states, and mapping complete user journeys before moving into visual design.
This early planning established a clear foundation that both designers and engineers could reference throughout development.
defining the experience.
With the product requirements established, I defined several design principles that guided every decision throughout the project.
SPEED + SIMPLICITY
Users often interact with Twiice while shopping, making quick purchasing decisions. Every screen was designed to reduce cognitive load and present only the information necessary to complete the current task. I optimized common user flows so that most actions could be completed in three taps or fewer, minimizing unnecessary navigation and input.
SUSTAINABILITY
Rather than emphasizing environmental messaging through visual clichés, I focused on creating an experience that naturally encouraged more thoughtful purchasing decisions.
CLARITY
AI-powered recommendations can easily feel like a "black box." My goal was to make every result understandable at a glance, helping users feel confident in the application's recommendations.
To establish the overall visual direction, I created a mood board inspired by modern fashion marketplaces and clothing retail applications before developing an information architecture diagram and low-fidelity wireframes for each primary workflow.
Once these concepts were reviewed and approved by the team, I translated them into interactive prototypes within Figma.
building the design system.
To ensure consistency across the application, I built a complete design system before moving into high-fidelity designs.
The system included typography, color styles, spacing tokens, reusable components, interaction states, and layout guidelines that could easily scale as new features were added.
COLOR
While green was initially considered to reinforce environmental sustainability, I chose a vibrant blue instead. Blue communicates reliability and trust—qualities especially important for an AI-powered product—and the brighter accent helped the application stand out on both users' home screens and the App Store while maintaining a clean, minimal interface.
TYPOGRAPHY
Roboto was selected for its simplicity, excellent readability, and strong performance across a wide range of screen sizes. Combined with a restrained typography scale, it established a clear visual hierarchy without overwhelming the interface.
LOGO
I also designed the Twiice logo by combining the number 2 with a clothing hanger, creating a simple mark that references both the application's name and its core purpose.
The completed design system became the single source of truth throughout development, allowing both design and engineering to work from a consistent set of reusable components.
the UX challenge.
The most challenging screen to design was the AI comparison results page.
Unlike traditional shopping applications, Twiice needed to communicate AI-generated similarity results in a way users could immediately understand without overwhelming them with technical information.
Through multiple layout explorations, I designed a swipeable comparison component that highlights the strongest matches while keeping the user's scanned item visible for reference.
Each recommendation clearly presents the matching garment, similarity percentage, and supporting context, allowing users to quickly compare items while maintaining confidence in the AI's suggestions.
By prioritizing visual hierarchy and progressive disclosure, the final design transformed a technically complex process into an interaction that feels simple and intuitive.
designing for everyday shopping.
Because users interact with Twiice in busy retail environments, the interface was designed around speed, clarity, and accessibility.
The experience focused on two primary principles: simplicity and accessibility.
SIMPLICITY + CLARITY
Every screen minimizes unnecessary visual elements, allowing users to understand AI recommendations immediately without needing to interpret complex information.
ACCESSIBILITY + EASE OF USE
Most tasks can be completed in three taps or fewer, making the application quick to use while shopping.
To further improve usability, I introduced a floating bottom navigation bar that improves thumb reach, reduces accidental touches, and visually separates persistent navigation from page content.
The interface also supports both light and dark mode, while all primary color combinations meet WCAG AAA contrast standards to improve readability across different lighting conditions.
figma to production.
As the sole designer, I remained closely involved throughout implementation.
I worked alongside the frontend engineer through weekly design reviews, shared interactive prototypes, documented interactions within Figma, and used comments to clarify implementation details during development.
Our team communicated through Slack and managed development tasks in Linear, allowing design and engineering to stay aligned throughout each sprint.
When additional features—such as dark mode—were introduced later in development, I expanded the design system and updated the necessary screens before handing revised assets back to engineering for implementation.
I also created the App Store screenshots used for Twiice's public launch.
challenges.
DESIGNING FOR PRODUCTION
Unlike classroom projects, every design decision needed to consider implementation complexity, engineering constraints, and future scalability.
SMALL TEAM
With only one designer and one frontend engineer, each design deliverable needed to be organized, documented, and implementation-ready to minimize development overhead.
EXPLAINING AI
One of the largest design challenges was making AI-generated recommendations feel transparent and trustworthy. Rather than exposing technical details, I focused on presenting results through familiar visual patterns that users could understand immediately.
outcomes.
Following implementation and final user testing, Twiice launched publicly on the App Store in May 2026.
As the sole designer, I delivered:
Complete product UI and UX
Brand identity and logo
Design system
Information architecture
Interactive prototypes
Light and dark mode interfaces
Production-ready developer handoff
App Store marketing assets
The project successfully transformed a technically sophisticated AI workflow into a clean, intuitive mobile experience ready for public release.
reflection.
Twiice fundamentally changed how I think about product design.
Unlike designing a prototype for a class project, designing for production required every decision to account for engineering feasibility, accessibility, scalability, and long-term maintenance. I learned that great product design is not only about creating polished interfaces—it is about building systems that can be implemented efficiently and evolve alongside the product.
Working as the sole designer also strengthened my ability to organize complex Figma files, build reusable component libraries, and communicate design decisions to teammates with different technical backgrounds. Creating detailed prototypes and clear documentation allowed engineers to confidently translate designs into production while keeping the team's shared vision aligned.
