The Situation

Project

Universal Weather App

Role

Researcher, UX Designer, Visual Designer

Goal(s)

Develop and design a weather app for cross-solar system travelers

Result

Visual designs and icons for an app that let travelers see weather for multiple locations and set alerts and weather-related reminders


Universal Weather App

The Process

Tools/Techniques Used

  • Sketch
  • Paper & Pencil
  • Adobe Illustrator
  • Market Research
  • User Surveys
  • Heuristic Review
  • Wireframing
  • Visual Design

Discovery & Research

I started off this project by researching the current selection of weather apps available in the market today and what data they sought to impart on their users. Many apps favored flashy, slow-loading graphics over data, and lacked the ability to download future forecasts for a time which the user might not be connected to a reliable data network. Often times, an app would simply tell you the weather for your last given location when you checked it. There was no warning of impending weather events or situations.

While I initially focused on a design that included a tutorial, further research on how people use weather apps convinced me to make a design that was obvious, helpful, and forgiving from the start. I decided to use Google’s Material Design principles as a starting point, as the intended market for the app, Android users, would already be very familiar with the navigational principles.

User Flows

I sketched out user flows for the complete experience – ranging from selecting a location or have the app find you, downloading forecasts for specific locations, set reminders, allow for notifications in the result of an emergency weather situation (tornadoes, sudden eclipses, flooding) and choose and scroll between multiple chosen locations.

Being a universal app, settings would also allow for seamless shifting from different calendars and systems of measurements and I included this in the user flows.

I ensured that happy and unhappy paths were accounted for and that users had an easy way to self-correct any mistakes and be informed of errors that occurred outside of their control (i.e. a lack of wi-fi connections, etc.)

Wireframes

I used hierarchy of font to make the temperature and weather status pop out, with location and other information easily available.

In addition to displaying the weather information, I added in photographic backgrounds to remind you of your location.

I designed a simple system of reminders that followed an “If -random weather event- is due, within -set time-, remind me to -do this-“, complete with pre-set reminders and the ability to customize your own.

Design

I developed and designed additional weather icons would have to be created alongside the familiar sunny, cloudy, rain icons we all see in our current apps. I created a set of 6 simple vector illustrations that would be useful for more universal weather – meteor showers, sudden vacuum, etc. based on current weather iconography and other familiar symbols, from chemistry to car dashboards.

Testing

I tested my newly designed icons with users to ensure that those new icons could help promote usability of the product and accurately represent weather conditions.