WeatherWear
Dressing Smart, Whatever the Weather. A personal project that bridges the gap between knowing the forecast and knowing what to wear.
Context & Problem
WeatherWear is a personal project I started after constantly struggling to figure out what to wear each morning. Checking the weather app, guessing how it might feel, then cross referencing that with my calendar and preferences was not exactly fun. I wanted a smarter, friendlier tool that took the thinking out of it for me. So, I built one.
How Might We...
How might we help people dress confidently and comfortably without overthinking the weather?
People (myself included) often check the weather but still end up feeling too hot, too cold or just mismatched for the day. There was a clear gap between knowing the forecast and knowing what to wear. I wanted to bridge that.
Role & Responsibilities
- Product Designer (UX, UI, Copy)
- Product Manager
- Feature Prioritization
- Roadmapping
- User Research
- Prototyping & Testing
Goal
Design a weather app that tells you the forecast in a fun, human tone, suggests what to wear based on your wardrobe and preferences, and learns from your feedback over time.
Discovery & Early Thinking
The idea started as a simple "what to wear" widget. I sketched a rough morning routine with pain points, then mapped a cleaner version of the ideal experience.
Current Morning Routine (Pain Points)
I mapped out the typical morning struggle that many people face when trying to decide what to wear.
This sketch shows the frustrating journey: waking up, checking a weather app that gives too much data, Googling outfit ideas, and still ending up confused in front of the wardrobe.
Key Pain Points Identified
- • Weather apps provide too much irrelevant data
- • No clear connection between weather and outfit choices
- • Decision fatigue at the wardrobe
- • Time wasted searching for outfit inspiration
Proposed Solution Flow
I designed a streamlined experience that eliminates the guesswork and reduces decision fatigue.
The new flow is simple: Open app → See weather + outfit → Approve/switch items → Done. This eliminates multiple steps and reduces the morning routine to just one decision point.
Solution Benefits
- • Single app for weather and outfit decisions
- • Personalized suggestions based on preferences
- • Quick approval or easy item swapping
- • Learns from user feedback over time
User Journey Mapping
I created a detailed journey map to understand emotions and pain points at each step of the morning routine.
The journey map revealed that the biggest emotional low points occurred during outfit decision making and wardrobe confusion. These insights directly shaped which features to prioritize in the MVP.
Journey Insights
Users experience the highest stress during the "decision moment" at their wardrobe. WeatherWear aims to move this decision point earlier in the process with confident, personalized suggestions.
How WeatherWear Solves the Pain Points
Every little friction in the morning routine added up. Here's how I tackled each one:
| Pain Point | What Usually Happens | What WeatherWear Does Instead |
|---|---|---|
| Too much data in weather app | Users feel overwhelmed by wind, UV, dew point, etc. | WeatherWear simplifies the forecast and highlights what to wear. |
| No clear outfit advice | Users Google ideas or scroll Pinterest | WeatherWear suggests complete outfits based on user style and preferences |
| Decision fatigue at the wardrobe | Staring at clothes with no clue what fits the weather | Provides a single confident suggestion you can approve or swap |
| Missed context like wind chill | Users underestimate how it'll feel outside | Factoring in feels like temps and wind for better outfit accuracy |
| No way to learn or improve | Outfits feel random over time | Users give simple feedback that improves future suggestions |
Feature Prioritization
I ran a quick MoSCoW analysis to prioritize features and define the MVP scope.
Must Have
- Weather forecast
- Outfit suggestions
- Wardrobe builder
Should Have
- Style preferences
- Feedback loop
- Dark mode
Could Have
- Social sharing
- Outfit history
- Weather alerts
Won't Have
- AI closet scanning
- E-commerce integrations
- Social features
User Inputs & Personalization
WeatherWear personalizes recommendations based on user preferences and lifestyle factors.
Style Preferences
Streetwear vs classic, casual vs formal, color preferences
Activity Level
Mostly sitting, walking commute, outdoor work
Work Environment
Indoor vs outdoor, dress code requirements
Weather Sensitivity
Sensitivity to cold or heat, preferred comfort range
Wardrobe Items
Manually entered items or browsed from presets
Lifestyle Context
Meeting schedules, social events, daily routines
Tone of Voice
I wanted the app to feel cheeky and warm, like a friend texting you outfit advice.
"It's raining. Again. Dress smart or embrace the soggy chic look."
Instead of "Light rain forecast" — WeatherWear speaks human
Design System
I used a flat, colorful illustration style for weather scenes and clean UI for content. Each screen changes visual tone with the weather: sunny, cold, rainy or sunset.
Typography is legible, UI spacing is breathable and everything is designed to feel friendly, not robotic. Close attention was paid to contrast and accessibility.
Impact Goals
Even though the app hasn't launched publicly yet, here are the metrics I would track:
Testing Plan
Since this project started from a personal pain point, I haven't run user testing yet, but that's next on my list:
Reflection
WeatherWear taught me how to blend product thinking with playful UX. It pushed me to think beyond UI and explore lifestyle, habits and context. Most of all, it reminded me that design is at its best when it's personal, delightful and useful.
If I had more time, I'd:
- • Run A/B tests on cheeky vs neutral tone
- • Create adaptive outfit logic for temperature swings throughout the day
- • Test emotional design moments (e.g. animated avatars dressing up)
Tools Used
Figma, FigJam, Midjourney (for visual references), Notion
Role
Product Designer (UX, UI, Copy) + Product Manager (Feature Prioritization, Roadmapping)