Logo for DaveMulder dot com

Dave Mulder

Hand-crafted and research-driven design you'll love

Building a weather app for the iPad

June 02, 2011

Though I’ve toyed around with iOS and Android app development, I’ve never gone the distance to post something in a marketplace. After picking up an iPad, I figure now is a great time to end that streak. Thus begins my summer hobby project, building a weather app.

Aren’t there other weather apps? Yes there are, and in a moment you’re going to see several examples of popular iPad apps out there. They have individual strengths and weaknesses, but none present weather forecasts in an innovative fashion. The old models are generally recycled.

The Weather Channel

The Weather Channel has a lot of brand power behind their name. They are the cable television weather network and the only way many people learn about forecasts. TWC’s visibility gives them an upper hand when marketing products, like their iPad app.

With a lot of money behind their product, you would think that TWC’s iPad app is an example to be emulated. I think the experience is cluttered. Just take a look at that screenshot. My guess is that stakeholders at TWC determined features and information that had to be in here — design by committee — and the designers were only allowed to color between the lines.

My biggest complaint is the severe weather alert. A flood advisory for a river that isn’t even near flood stage? The value and importance of that box is greatly diminished when it shows this crap all the time.

iMap Weather

Like its name suggests, iMap Weather is map mashup. It looks boring because nothing is going on in the region, but a quick scan of the rest of the country revealed some storms in New York. If you tap the tiny up arrow on those boxes in the bottom portion, an overlay appears with additional details. The play button at the top animates the radar so you can get a feel for what direction and how quickly a storm is headed.

Fahreneheit

Fahrenheit is one of the popular paid iPad weather apps. Its claim to fame is the the notifications bubble on the app icon to indicate the current temperature (tiny screenshot to the right). Aside from that, the main view is a weekly forecast. They’re not doing anything special with the data except reading in from an API and spitting it out in label/text format. Yuck.

WeatherEye HD

WeatherEye HD presents weather data with visual symbols. There’s a lot of information here, but it’s easy to scan and understand. Navigating to different pages is clunky and the conceptual model of content organization is unclear. Though advertisements are unobtrusive.

WunderMap

Brought to us by our friends at Wunderground, WunderMap is a mashup of weather data and the Google Maps API. Each of the visible temperature points on the screenshot above is a reporting station. This is a gentle reminder that even within one city, temperature will be different. (Though, I wonder where that 51 degree mark is coming from). WunderMap offers data layers like precipitation and cloud cover to get a broad view of what’s going on in your region. I like WunderMap a lot more than iMap Weather.

Weather Doodle

Unlike the other apps we’ve seen, Weather Doodle emphasizes simplicity. The only functions are current conditions and forecast, and the only information provided in both are temperature and conditions. Playful graphics (with light animation) feel appropriate for the device. I am in love with the aesthetics.

Observations

  • Every app included current conditions and a short-term forecast.
  • Every app uses a graphic to support understanding of conditions.
  • The amount of data included varies significantly.
  • A few apps mash up weather conditions with a map. Everyone understands how a map works, and it’s great for exploring.
  • There are no consistent practices in how data is arranged, except that current temperature and conditions are prominent.
  • None of these apps take full advantage of conventions to promote understanding in a touchscreen environment.
  • Every app uses location data to initially populate content. Instead of having to search for Lansing, Michigan, it made my life easier by defaulting there.

Next steps

This is a project with an audience of one — me. I’m going to tailor it around my needs and maybe other people will find it useful. I already have some ideas for an innovative new interface. The next step is to sketch them out run some paper prototype tests with friends.