Climafit Application Screens — Reece Van Houtven

Climafit — Case Study

Reece Van Houtven
Feb 19 · 5 min read

Dressing for the weather has never been so fashionably easy

Sick of sweating through your cosy sweater? Fed up with frozen knees? Climafit is an outfit planning application that incorporates the weather into suggested looks. No more ripped jeans in the freezing cold, no more hoodies in the humidity. The concept for Climafit derived from my own day to day Spring and Autumn life. For many people, planning an outfit for cold in the morning warm in the afternoon type weather is challenging. The goal for this application was to add a sense of ease to age-old wardrobe dilemma.

Climafit Logo / App Icon — Reece Van Houtven

Climafit is targeted towards the fashion-forward 20 somethings looking to take their style to the next level — the comfort level. Climafit offers a closet section to keep track of favourite clothing choices and combinations, a suitcase section for trip planning and packing as well as a blog style profile where the user can share their looks. Climafit offers to connect to Instagram, where you can post your favourite looks as well, however, this isn’t required to use the app.

A unique feature of Climafit is the warm or cool setting. This can be an aesthetic change made by the user which changes the colour palette of the application. Much like night or day mode in other apps, the warm or cool settings can be set to automatic in which the palette will change based on the weather — warm palette; warm day, cool palette; cool day. The user can also decide they like one look better and lock it in.

For this concept, I started with mood boards and ideation. I knew I wanted to utilize the strong weather app identity but I wanted to find a way to make it more unique and fashion forward. I wanted Climafit to be a new extension of Instagram that would allow the “ootd” (Outfit of the Day) tag to blow up again and create a world of more comfortable fashion. The wireframing process for Climafit involved researching how people generally slide through apps and what pages usually get the most traffic. I chose bottom bar navigation to keep the application simple and easy to learn and use. I chose to use iconography throughout the application rather than photos of clothing to entice mass amounts of people rather than people with a certain style or aesthetic.

The weather page is a simple layout with familiar content so that the user doesn’t need to be a meteorologist to be fashionably comfortable each day. Making the weather section the home page of Climafit made the most sense. Obviously, you know before opening the app, you want to wear clothes today. Knowing the weather and from there suggested looks created the most accessible path through the application. The suggested looks page depends on your app use and the weather. The app will make suggestions based on what you have worn other days with similar weather conditions. If you haven’t dressed for a similar day before, you will be given suggestions based on your favourite styles and looks that suit the weather.

The closet section is where you can log clothing you have or want and edit your favourite looks. The closet uses a simple layout to keep clothing organized — because no one likes a messy closet. This section utilizes icons to explain the content and help organize logged items. While logging clothing you already own is easy enough, there is a challenge with certain pieces that may not fit into any obvious category, under these circumstances, Climafit will suggest a category based on other users content or even a miscellaneous closet section. Each logged piece of clothing is allowed 5 tags to help you find it in the closet search as well. No piece of clothing left behind!

The profile is a simple blog style layout that can connect to Instagram or a stand-alone blog. On your profile, you can favourite your own looks and search for “outfit of the day” inspiration.

The suitcase section has a similar layout and structure as the rest of the application and allows you to create multiple trip plans at once. This section will show past trips, the weather and what you packed for each day. The suitcase adds a unique flare to Climafit as we all know packing for travel isn’t exactly easy. After punching in your destination and time of travel, Climafit will instantly find the most likely weather and what others have packed or suggested.

The colour palette for Climafit was inspired by the weather and traditional weather applications. Most popular weather apps utilize a light sky blue with a bright sunny yellow, I chose to create a gradient of the two for the warm daylight palate. The yellow and blue create a more traditional yet modernized look. I started with just this one colour scheme and decided the application needed something to pull it apart from traditional weather apps since Climafit is not a traditional weather application. I created the cool night palette to create a unique user experience that would allow the application to change colours based on the weather. This would allow a quick glance idea of the day’s weather. Without even looking at the day’s weather, depending on the colour scheme you could already have a feel for the day.

Climafit is a concept I have always wanted to execute. As someone who lives in southern Ontario, the weather can be unpredictable, especially in Autumn or Spring. Weather that is cold in the morning and warm in the afternoon then cold again at night is difficult — Climafit is the solution. I wanted to create an application that not only I would use but that others would also use and appreciate. Sweating through your favourite shirt is never a good feeling and Climafit is exactly what people need to stop it from happening.

The social portion of Climafit is a new unique way to share individuals fashion and lifestyle. Being on a platform dedicated to fashion and comfortable style is new to the social world and I believe could be very successful. Many other platforms incorporate fashion into their content, but Climafit is solely dedicated to it which makes it a strong addition to any socialites world.

While creating Climafit, I was learning the ropes of Adobe Xd as I went. This led to some difficulties which looking back on this project would be easy to fix now, but at the time were impossible. In the future, I plan on changing up a few of Climafits features with my now more advanced Xd skills. Coming soon Xd 2.0 with new and improved user experience, with closet items and blog post examples.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade