2026 Spotify Interactive Web Design UI/UX Editorial Design

FitCheck


FitCheck is a mobile app prototype that simplifies the daily task of choosing outfits by organizing fashion into a digital closet, tracking outfits, and offering style inspiration, making outfit planning more time-efficient and stress free.


Context

Choosing an outfit is a small but recurring decision that can become surprisingly time-consuming and mentally draining. Whether getting ready for work, school, or a special occasion, deciding what to wear often adds unnecessary stress to the start of the day. FitCheck was created to simplify this everyday experience.

This project was developed from the ground up through a complete UX/UI design process, from problem discovery and user research to interviews, analysis, information architecture, user flows, wireframes, prototyping, branding, design systems, and high-fidelity UI. The result is a digital product designed to help users maximize their personal style while minimizing decision fatigue.

Team

  • Solo project

Skills

  • Figma
  • User Experience Design
  • User Interface Design
  • Product Ideation



01
DISCOVERY

Defining The Problem

Problem Statement People interested in fashion often struggle with disorganized closets, limited storage space, and last-minute outfit decisions. This leads to daily indecisiveness, unnecessary clothing purchases, and wasted time getting dressed.

Why it mattersGetting dressed should be an enjoyable part of the day, but cluttered wardrobes and decision fatigue can turn it into a frustrating daily task.
User Environment 
  1. At home while organizing their closet
  2. In stores while shopping for clothing
  3. On the go while planning outfits for busy mornings or special occasions

Why does the user use this product?Users use the app to organize their wardrobe digitally, plan outfits in advance, revisit past looks for inspiration, and make more intentional shopping decisions by avoiding duplicate or unnecessary purchases.

How does the user feel while using this product?The experience helps users feel organized, confident, and inspired. By simplifying outfit planning and wardrobe management, the app saves time while making fashion more enjoyable and less stressful.

Research Methods
1. Interview
Interview Objectives

Conducted 5+ semi-structured interviews with participants to understand how they organize their wardrobes, plan outfits, and shop for clothing. The research explored existing habits, pain points, and attitudes toward digital wardrobe management to identify opportunities for a solution that naturally fits into users' daily routines.

  1. Understand how users currently organize their wardrobes and plan outfits.
  2. Identify common frustrations and unmet needs throughout the outfit planning process.
  3. Evaluate perceptions of digital wardrobe management tools.
  4. Explore how fashion inspiration, social influence, and sustainability influence purchasing decisions.
Interviewees

  1. College students interested in fashion and personal styling
  2. Fashion bloggers and content creators who regularly document outfits
  3. Busy professionals who plan outfits for efficiency
  4. Individuals practicing mindful or minimal fashion consumption
  5. An "extreme" interviewee with little interest in fashion or outfit planning

Key Insights from the Interview

  1. Outfit planning is highly personal:
    Users approach outfit planning differently. 
    Some dress based on mood, while others prioritize the occasion, weather, or simply minimize the time spent deciding.

  2. Wardrobe inspiration is social:
    Participants expressed interest in viewing friends' or creators' wardrobes and sharing their own outfits to discover new styling ideas.

  3. Closets don't reflect what's actually owned:
    Limited storage, folded clothing, and visual clutter cause users to forget items they already own, making it difficult to fully utilize their wardrobe.

  4. Shopping often leads to duplicate purchases:
    Many participants reported buying similar pieces because they couldn't remember whether they already owned something while shopping.

  5. Styling new purchases is challenging:
    Users frequently struggle to incorporate new clothing into existing outfits, leading to pieces that are worn infrequently.


2. Competitive Analysis

Analysis Objectives

Conducted a competitive analysis to evaluate how existing wardrobe management, planning, and organization tools address users' needs. The goal was to identify opportunities for FitCheck to deliver a more intuitive, engaging, and rewarding experience that encourages long-term use.
Key Insights from the Competitive Analysis 

  1. Organization tools excel at planning:
    Apps such as Notes, Google Calendar, TickTick, and journaling apps provide effective planning through timestamps, reminders, and flexible calendar views, helping users organize their daily routines.

  2. Digital wardrobe apps prioritize cataloging over experience:
    Fashion apps like Whering and Smart Closet successfully help users organize their clothing collections but often rely on manual input and lack intuitive interactions.

  3. Opportunity for FitCheck:
    There is an opportunity to combine efficient wardrobe management with a more intuitive interface, outfit planning features, and social inspiration to create a more engaging experience that users want to return to regularly.

Goals & Success Metrics

Improve digital wardrobe organization and reduce outfit indecisiveness. Users report spending less time choosing outfits.

Help users confidently plan outfits for different occasions.Increase in the number of outfits created and saved within the app.
Encourage more mindful shopping by improving wardrobe visibility.Reduction in duplicate or unnecessary clothing purchases over time.
Build an engaging community for fashion inspiration.Growth in outfit sharing, saved inspiration, and community interactions.

02
IDEATION


Persona
Journey Map

Amelia, The Rushed Dresser

Age: 21
Occupation: College Student

Background:Amelia lives in a small city apartment with limited closet space. Between classes, social events, and a busy schedule, she often has to choose outfits quickly, but a cluttered wardrobe makes it difficult to remember everything she owns.

Pain Points:
  • Limited closet space makes clothing difficult to organize and access.
  • Frequently forgets about items hidden in drawers or folded stacks.
  • Feels stressed and indecisive when putting together outfits on busy mornings.

Goals:
  • Easily organize and visualize everything in her wardrobe.
  • Plan outfits faster with less decision fatigue.
  • Find new ways to style the clothes she already owns.

Behaviors:
  • Scrolls through old photos to remember past outfits and clothing pieces.
  • Plans outfits only when necessary, often right before leaving.
  • Rewears favorite outfits because they're easy to remember, while other clothes go unused.



Through research, I gained a deeper understanding of users' environments, motivations, and emotions. These insights guided the design toward meaningful, high-impact features rather than feature overload, creating an experience that feels intuitive, enjoyable, and genuinely useful.


How Might We...
How might we simplify outfit selection to help users save time and reduce decision fatigue?
This question became the guiding principle throughout the design process, influencing decisions from strategy to interface design.

Core Values & Principles
  1. Efficiency First
  2. Visibility Matters
  3. Smart Planning
  4. Community & Inspiration

Feature PrioritizationEvaluated potential features based on user needs, impact, feasibility, and priority, allowing the design to focus on the most valuable solutions rather than adding unnecessary functionality.
User flowGuiding to the most efficient feature first to the least
UI DesignAbstraction can be necessary for usability.
Too many details or overly complex guidance could work against the goal of saving time.
Need to find a balance between minimalism and accuracy


03
DESIGN


FitCheck is a mobile app that enables users to organize, categorize, and revisit their outfits through a clean, image-driven interface with intuitive filters and calendar-based views.
Low Fidelity Wireframes

As an initial step, I created low-fidelity wireframes to explore the overall information architecture and layout. I experimented with balancing large imagery and supporting text while testing key features such as monthly and weekly calendar views. 

For the Explore page, I explored ways to combine image-based browsing with keyword search, making inspiration both visual and searchable.
During early iterations, I introduced a slider that allowed users to switch between different layout views. 
However, user feedback revealed that the interaction was not immediately understandable, users had to experiment with it before recognizing its purpose. Based on this insight, I replaced the slider with more familiar navigation patterns, improving discoverability and reducing cognitive effort.



Log in page
Main home screen, prompting users to add a picture of their outfit to the calendar
Another way to create an outfit and save it to calendar with items / daily and monthly view calendar
User interviews revealed how people naturally organize and think about their physical closets, which informed the structure of the digital wardrobe. From these insights, I designed a filter system that lets users quickly narrow outfits by wear frequency, weather, occasion, and other relevant criteria, minimizing decision fatigue and making outfit planning more efficient.
Multiple ways of viewing the items in the closet using toggles
Camera guidelines / image-based browsing and keyword search
Adding clothing items to the digital wardrobe, with specific categories
Multiple ways of viewing the outfits in the closet using toggles

    Design Rationale

    1. Soft, rounded corners create a friendlier and more approachable visual language, reinforcing the app's enjoyable and casual experience.
    2. High-contrast purple and orange buttons clearly distinguish primary actions and guide users toward the next step with minimal hesitation.
    3. A consistent glow effect and orange highlight indicate selected states throughout the interface, creating a clear and predictable interaction system.
    4. A dedicated filter screen separates detailed categorization from image-first browsing, reducing visual clutter while keeping advanced organization easily accessible.
    5. Vertical scrolling supports natural browsing of outfit feeds, while horizontal scrolling reveals additional filtering and categorization options only when needed, maintaining a clean interface without sacrificing functionality.

    More Projects



    Peacock


    Ruined Birthday