Atelier – Digital Wardrobe App
Client
Academic Project (HCI Graduate Program)
Role
Creative Director, Product Designer
Year
2024
Deliverables
iOS Mobile Prototype, Apple Watch Companion Prototype, Usability Test Plan and Findings
Atelier is a digital wardrobe application designed to reduce the mental overhead of getting dressed each day. The product helps users catalog their clothing items, generate outfit combinations based on real-world events, and receive timely reminders, transforming the daily ritual of choosing what to wear from a stressful decision into an effortless background task. By connecting with users' calendars and understanding the context of their lives, Atelier provides thoughtful outfit suggestions that consider not just what's in their closet, but where they're going.
The application serves as both a practical organizational tool and a creative styling assistant. Users can photograph their garments, and Atelier automatically processes these images to create a clean digital catalog. From there, the app generates personalized outfit combinations for the week ahead, suggests additions from partner brands, and provides just-in-time reminders through a companion smartwatch application.
This case study explores the design process behind Atelier, from initial research and competitive analysis through prototyping, usability testing, and iteration. The project demonstrates how thoughtful interaction design and user-centered research can transform a common pain point into an elegant solution that fits seamlessly into people's daily routines.
The Problem
Choosing an outfit each morning costs time, attention, and confidence. For professionals rushing to get ready for work, fashion enthusiasts preparing for events, or anyone facing a closet full of options with no clear direction, the daily question of "what should I wear?" becomes a significant source of stress. This isn't merely about indecision; it's about cognitive load, decision fatigue, and the real impact that feeling underdressed can have on someone's day.
Existing digital wardrobe solutions overemphasize cataloging while neglecting contextual elements that inform outfit choices. Users are left with neatly organized digital closets but no meaningful guidance on what to wear for specific occasions. These apps rarely account for accessories, fail to integrate with calendars, and don't provide styling intelligence that would actually reduce the burden of getting dressed.
There's a fundamental gap between how people think about clothing and how technology has approached the problem. People don't get dressed in a vacuum; they dress for meetings, dates, presentations, and casual outings. An effective solution needs to understand this context and provide guidance that goes beyond simple organization to offer genuine styling intelligence adapted to daily life.
Research & Competitive Analysis
The research phase began with a thorough review of existing digital wardrobe applications, focusing on Indyx and Whering, two of the most established players in the space. Indyx offered professional styling consultations and resale integration but locked much of its useful functionality behind subscription paywalls. Whering attempted to streamline cataloging with background removal but ultimately placed the burden of outfit curation entirely on the user.
Through this analysis, several critical gaps emerged. Neither application meaningfully integrated with personal calendars to suggest event-appropriate outfits. Both overlooked the importance of accessories as essential components of a complete look. The styling recommendations that existed felt generic and disconnected from the specific contexts in which people actually get dressed.
These findings informed Atelier's strategic direction toward context-first design. Rather than building another wardrobe inventory system, the team decided to focus on the moments when users actually need help: before events, during busy mornings, when planning their week. Success would depend on understanding user context deeply enough to provide timely, relevant outfit suggestions that reduced cognitive load.
Personas & Scenarios
To ensure the design would serve real user needs rather than assumptions, the team developed two research-based personas representing different user motivations for a digital wardrobe solution. Maya Chen, a 29-year-old content creator and brand consultant, struggles with outfit repetition across her busy schedule of client meetings, content shoots, and networking events. Despite having a carefully curated wardrobe, she finds herself scrolling through phone photos before getting dressed to avoid wearing the same combination to recurring events. Her primary need is a system that helps her maximize existing pieces and reduces morning decision fatigue.
Jordan Williams, a 34-year-old product manager, represents users who value looking polished but lack confidence in styling. Working in a tech company with ambiguous dress code expectations, Jordan defaults to the same three safe outfit combinations because he's uncertain what's appropriate for different contexts. He finds traditional fashion advice overwhelming and needs clear, actionable suggestions that help him dress for both casual team meetings and formal executive presentations without the guesswork.
These personas guided scenario development throughout the design process. For Maya, key scenarios involved preparing for a week of diverse professional commitments while tracking outfit history to avoid repetition. For Jordan, scenarios focused on last-minute wardrobe decisions for high-stakes meetings and building confidence through consistent, appropriate outfit recommendations. Both personas shared a common thread: they needed intelligent assistance that worked with their existing wardrobes rather than requiring extensive cataloging or fashion expertise.
Defining the Experience
Three core principles emerged to shape Atelier's experience design. The first principle, context-first design, meant that every feature would be built around the specific moments and situations in which users need help. Rather than starting with the wardrobe as a static inventory, Atelier begins with the calendar, the event, and the context, then works backward to suggest appropriate combinations.
The second principle centered on assisted generation rather than full automation. While the app would offer AI-powered outfit suggestions, users would maintain meaningful control over their choices. The design avoided treating outfit selection as a problem to be solved through algorithmic optimization alone. Instead, Atelier positions itself as a knowledgeable assistant that offers suggestions but respects that personal style requires human judgment.
The third principle involved purpose-built multi-channel user experience design. The mobile app would serve as the primary hub for cataloging, planning, editing, and shopping. The smartwatch companion would focus exclusively on what wearables do best: delivering timely notifications and enabling quick confirmations through simple gestures. This deliberate division of functionality ensured each platform played to its strengths.
Interaction Design & Prototyping
The interaction design phase began with rapid sketching sessions where team members independently explored different approaches to the home screen and core navigation patterns. The visual direction drew inspiration from high fashion brands, embracing minimalism and neutral palettes that wouldn't compete with the clothing images users would be viewing.
For the mobile experience, the design centered on a bottom navigation bar with clearly defined sections: wardrobe management, outfit generation, shopping, and calendar integration. The outfit generation flow became the app's centerpiece, guiding users through event type selection, automated AI suggestions, and the option to set reminders. The editing interface allowed users to swap individual garment pieces, with the system intelligently filtering options to show only relevant categories.
The smartwatch interface took a fundamentally different approach, optimized for quick glances and simple gestures. The primary interaction involved receiving outfit notifications as events approached, viewing the suggested combination through a card-based interface, and either confirming the outfit or making quick edits through swipeable garment cards. The team created interactive prototypes in Figma for both channels, ensuring realistic transitions and the ability to conduct meaningful usability testing.
Usability Testing
Usability testing involved seven participants with diverse backgrounds, from HCI graduate students with software development experience to professionals in corporate environments. Each participant completed a series of scenario-based tasks across both the mobile and smartwatch prototypes while team members observed and took detailed notes. The testing protocol emphasized that the research focused on evaluating the app rather than the participants' abilities.
The mobile tasks covered the app's core functionality: generating an outfit for a fashion show, editing an existing outfit, purchasing a new clothing item, and creating an outfit with a reminder. The smartwatch task focused on receiving a notification that an outfit was prepared and either confirming or editing it. Participants were encouraged to think aloud during task completion, providing insight into their decision-making process and moments of confusion.
Testing sessions revealed patterns that transcended individual participants. Multiple users struggled with identical pain points, particularly around iconography, phrasing, and the reminder flow integration. This methodical testing process generated both quantitative data and rich qualitative insights that would prove essential for prioritizing improvements.
Key Findings
The most significant usability issue centered on iconography and navigation entry points. All seven participants initially struggled to begin the outfit generation task, with most gravitating toward the wardrobe icon rather than the plus icon that actually initiated the generation flow. In users' mental models, outfit creation logically started in the wardrobe where their clothes lived, not through an abstract action button. The shopping bag icon similarly caused confusion.
Language and phrasing emerged as another critical pain point. Multiple participants explicitly stated they couldn't differentiate between "choose a new outfit" and "generate a new outfit," finding the wording too similar to convey meaningfully different functionality. In the editing flow, terms like "wardrobe" felt too general and didn't clearly communicate their purpose. This ambiguity caused users to hesitate or abandon tasks entirely.
The reminder and calendar integration functionality presented the most complex challenge. When asked to create an outfit and set a reminder, participants universally struggled to understand where to begin. After being shown that reminders were part of the outfit generation flow, most participants expressed that this integration felt unnatural. They expected calendar functionality to exist as a separate, dedicated section where they could view upcoming events and assign outfits to them.
Iteration & Refinement
Based on testing findings, the team developed a prioritized list of iterations organized into four categories: iconography reevaluation, phrasing revisions, structural changes, and bug fixes. The icon redesign focused on the two elements that caused the most confusion: the outfit generation entry point and the shopping section. The team researched icon conventions across fashion apps and e-commerce platforms to identify symbols that carried stronger cultural recognition.
Language revisions addressed the ambiguity between "choose a new outfit" and "generate a new outfit" by testing alternative phrasings that more clearly distinguished manual selection from AI-powered suggestions. Options like "build your own outfit" versus "get AI suggestions" were evaluated for clarity and tone. In the editing flow, "wardrobe" was replaced with more specific language like "choose a replacement" or contextual labels that explicitly referenced what action the user was about to take.
The most substantial iteration involved restructuring the calendar and reminder functionality. Rather than embedding reminder setting within the outfit generation flow, the team designed a dedicated calendar section accessible from the main navigation. This new section would display upcoming events synced from the user's calendar, allowing them to view their schedule and assign outfits to specific dates. Additional bug fixes ensured that features would be accessible from multiple entry points and that the menu would be consistently available across all screens.
Final Solution
Atelier's final solution delivers event-based outfit planning through a thoughtfully designed two-channel experience that anticipates user needs and reduces decision fatigue. The mobile app serves as the comprehensive hub where users catalog their wardrobe, receive AI-generated outfit suggestions for upcoming events, manually build custom combinations, and discover new pieces from partner brands. Calendar integration ensures that outfit suggestions arrive at the right time for the right context.
The smartwatch companion focuses exclusively on the moments when users need quick access without the friction of unlocking their phone. As event times approach, notifications deliver outfit suggestions directly to the wrist, where users can quickly review the complete look including clothing and accessories. The interface supports rapid editing through swipeable garment cards, allowing users to cycle through alternatives for any piece without complex navigation.
Together, these channels create a system that feels less like software and more like having a knowledgeable stylist who understands your schedule, your style preferences, and your wardrobe. Atelier handles the cognitive work of remembering what you own, considering appropriate combinations for different contexts, and ensuring you're prepared for events before they arrive.
Outcome & Learnings
This project reinforced several fundamental principles of user-centered design. The importance of aligning with user mental models emerged as perhaps the most critical lesson. Regardless of how logical an interaction pattern seems from the designer's perspective, if it doesn't match how users naturally conceptualize the problem space, it will create friction. The calendar integration issue exemplified this perfectly.
Language precision proved equally crucial, particularly in an app where multiple features could be described with similar words. The confusion between "choose" and "generate" revealed that designers must be ruthlessly specific with terminology. Ambiguous language doesn't just slow users down; it erodes confidence in the application and their ability to predict what will happen when they interact with it.
The project also demonstrated the value of rigorous, structured usability testing with diverse participants. Testing seven people revealed patterns that would have been invisible with fewer participants, and the consistency of findings gave the team confidence in prioritizing improvements. System-level thinking emerged as essential; Atelier isn't just a mobile app or a smartwatch interface, but an interconnected experience where decisions about one channel have implications for the other.
