WardrobeR

Inspiration

Every day, people look at a closet full of clothes and still feel like they have nothing to wear. While digital closet apps are supposed to help, many of them end up making the process more complicated. Users have to manually organize every clothing item, add details, and use strict filters just to get outfit recommendations that often don’t match what they actually want or what their day looks like.

I wanted to create something simpler and more useful for everyday people. My idea was to build a website where users could interact with their wardrobe using normal language instead of complicated categories or fashion terms. Users can describe their plans naturally, like “I have summer school but I’m hanging out with friends afterward,” and the app uses their own clothes and their context to suggest outfits that fit their schedule, weather, and personal preferences.

What it does

WardrobeR is a web-based wardrobe assistant prototype. Users can upload clothing images to a digital closet and explore their wardrobe in one place. To receive outfit recommendations, users select contextual information such as weather, schedule, and preferences, then describe their plans naturally—for example: "I have summer school and dinner afterward.”

WardrobeR analyzes this context and generates outfit suggestions along with a short explanation of why the recommendation fits the situation. This prototype focuses on making outfit planning feel conversational and intuitive.

How I built it

I built WardrobeR using Next.js, TypeScript, and Tailwind CSS. The website includes three main experiences:

Landing Page: introduces the product concept Digital Closet: allows users to upload and organize clothing images Styling Page: generates recommendations based on contextual inputs and natural-language prompts

I focused on creating a responsive interface and keeping interactions lightweight, so the experience feels smooth and easy to use.

Challenges I ran into

One challenge was making recommendations feel personalized without becoming repetitive. I experimented with how contextual inputs influence outputs so recommendations changed meaningfully depending on the user’s situation.

Another challenge was managing information across different parts of the application while keeping the interface simple and responsive.

Accomplishments I'm proud of

1. Building a complete interactive prototype: I took the idea from concept to a working deployed website within the hackathon timeframe.
2. Making the experience conversational: Users can describe situations naturally instead of relying on filters or structured forms.
3. Designing a polished interface: I focused on creating a clean and cohesive experience that feels intentional and easy to navigate.

What I learned

• Product simplicity improves usability
• Context makes recommendations feel more personalized
• TypeScript helps maintain structure during rapid development
• UX decisions strongly influence how intelligent a system feels

What's next for WardrobeR

• deeper integration between the digital closet and recommendations
• smarter organization of uploaded clothing
• smoother UI/UX to improve user experience

Built With

• css
• html5
• javascript
• next.js
• node.js
• react
• tailwind
• typescript
• vercel