Weather websites are often outdated and ugly, they provide the information you need but often times the average user gets overwhelmed with the amount of information displayed and doesn't know where to look anymore.

Weatherz aim's to create a minimal and clean website where the information that user needs most is displayed first and the more detailed information is displayed second. The second goal was to give my developer partner a hard website to code visually.

As the UI/UX Designer, I had to dive into the world of Weather and research what information needed to be displayed, and understand the everyday weather user.

In my role as a UI/UX Designer, I shaped the visual design, and crafted the brand. For this specific platform the requirements were aesthetics due to my partner who wanted to practice his coding skills.

We started by conducting research on the existing weather websites and the user needs. Checking the top weather websites and jotting down all the information that was displayed, seeing what we needed to show and what was some extra information that could be removed to a different screen where more advanced users would want to go. Checking which API to use and what information it had that we needed to display. I compiled a mood board with some modern looking weather designs and then went on to whiteboard designing with me and my friend where we just threw out ideas and design layouts.

First finding was that Weather APIs are expensive. Specific APIs give more information, others are more accurate, and the list goes on. Casual users who use weather applications rarely look at the in depth information that weather websites provide. Using heat-map data, weather applications usually focus on current weather, the weather for the next couple of hours, days, and some other extra information would be glanced at. The focus then turned to providing those information on the main screen and then the extra information on other screens. Starting out with some wireframes and tiny interactions that made the website look and feel modern, Weatherz slowly started coming along to look good.

The alternating theme was inspired by a game that had a different main menu depending on what time you log in. The images were created using MidJourney AI.

Konde is a sans-serif font that is legible and easy to read, making it a suitable choice for presenting large amounts of information. TimeBurner is a bold and attention-grabbing font that helps to create a strong visual impact. The font's unique and edgy style adds character and personality to the website while still remaining easy to read. This can help to enhance the website's visual appeal and make it more memorable for users.

The use of simple sky colors, one for night/bad weather, and one for day/sunny weather. The application would switch colors depending on the weather conditions.

The main motivation behind this project was to enable a developer friend of mine to experiment with a weather API while also enhancing his design implementation skills. Together, we collaborated on creating Weatherz. Although we couldn't keep the website up and running due to the expensive nature of weather API and that we did this to practice our skills, we opted to take the website down.