temp weather app

temp weather app - student project

Alrighty, my weather app. This is a tough one since there have been so many designs out there, especially on good ole dribbble, but here's my best shot!

My main goal for this initial design is to focus on the people who just want the quick-hit info about the weather: location, current temperature and conditions, highs/lows for that day, and the option to view a simple 7-day forecast. These are the things I usually look for when checking the weather, so I wanted to keep it simple with the most imporatant info front and center. Here are my initial sketches:

temp weather app - image 1 - student project

Since I won't be displaying very much information compared to other weather apps, I thought the design should reflect that, so I decided to go with a flat UI design approach. I wanted to take advantage of the color pallete Sarah provided us and thought it would work well with a flat design approach, and the fonts would help add a fresh and clean aspect to the design as well.

The one thing that I wanted to add in to help jazz it up a bit was a description of the weather, and the option to change the language/tone of the description. For example, if it's sunny out the description could read "It's sunny, yo!" or "Ah crikey, it's bloody bright out here!" Because who doesn't love reading something with an accent, right?

So here's what I came up with:

**UPDATED 4/28**

So after sitting on the design for a week I decided it wasn't really necessary to have the description of the weather, and that having actual quick facts would be much more helpful, so I took out the descriptions and ulitized that area for more specific information. In the below mockups I have the current weather conditon, a wind indicator, and a chance of rain indicator. Then, below that info I have a plus sign that would allow people to customize that area and add in any other facts (or take out) to have it show whatever information they were looking for.

temp weather app - image 2 - student project

temp weather app - image 3 - student project

temp weather app - image 4 - student project

temp weather app - image 5 - student project

Derek Hart

Graphic Designer