iOS Weather

The iOS Weather app has great features that give a lot of information about the weather but the design falls short when it comes to personalizing notifications.

ROLE

UX/UI Designer

CLIENT

Apple (Educational)

DATE

July 2022 (80 hrs)

TYPE

Mobile (iOS)

Not being prepared for bad weather sucks 😤

Have you ever overslept, been in a rush, and somehow miraculously managed to get ready within 15 minutes, only to have left the house and realized that it's about to start raining?

It would have probably been useful if you'd had a heads up about the weather. The current iOS Weather app doesn't have that option, therefore I wanted to create customizable notifications that users could set to meet their specific needs.

THE CHALLENGE

People have to actively check the weather in order to plan and stay updated.

THE OPPORTUNITY

A feature that allows users to customize notifications based on their preferences.

Final Prototype

Initial assumptions

My initial assumptions are based on some online and in-person research to try to understand the general attitude and feelings towards the reasons why people might check the weather.

👔 Users check the weather app before getting dressed in the morning.

Based on some initial googling, getting dressed appears to be the main factor for checking the weather.

☔️ Users want to know about bad weather ahead of time so they can plan.

Another finding was that people need to know about weather in order to plan for gear such as bringing umbrellas, sunscreen etc.

⚠️ Weather can be unpredictable and it's becoming more and more so.

Weather patterns have changed drastically in the last 50 years, so seasons are becoming more uncertain.

Understanding the Weather app market

The first phase of this project was market research, and I wanted to understand who the competitors were, and what they were doing to differentiate themselves. I was able to find four different competitors for the iOS Weather app which included The Weather Channel, CARROT Weather, Clime: NOAA Weather and AccuWeather.

Conducting the user research

I started my research by screening potential interviewees to see if they had an iPhone and if they used the Weather app. This led me to interview four research participants. You can see the interview takeaways below:

Developing a persona

The findings from the interviews led to my development of a persona. I focused more on defining features about the type of person that uses the iOS Weather app as well as habits that repeated themselves.

What are Alice's goals and pain points?

Through the interviews, I was able to identify goals and pain points that users have when it comes to the weather. While users have different specific preferences I was able to hone in on the ones that were the most reoccurring.

🎯 Goals

Plans what she wears depending on weather
Plans her exercise depending on weather
Wants to be as efficient as possible
Likes to plan trips and be aware of the weather where she’s going
Wants to know ahead of time if extreme weather is approaching
Wants weather knowledge to be as easy and thoughtless as possible

❤️‍🩹 Pains

Forgetting to check the weather because she’s in a rush
Forgetting to bring an umbrella
Not having enough heads up to plan for bad weather on a trip
Not being properly dressed for the temperature
Not realizing it would be colder (due to wind) or hotter (due to humitidy) than it says
Forgetting to put on sunscreen
Forgetting to delete notifications that are no longer relevant

The user journey

I created two different user flows showing Alice's journey when doing two tasks. The first one shows her flow when she's planning her running schedule for the week. The second shows her journey when she has a weekend trip planned.

Key screen flows

I decided to create diagrams depicting the different screen flows of the notification options. There are global notifications that are found in the first flow (night mode) and users can turn on the options that suit their preferences.

The second flow (light mode) requires the user to go into the detail screen of a specific location. I added the notification option there as well, giving users the possibility of muting all notifications or individually editing the notifications for just that specific location.

Flow 1 - Global Notifications

Flow 2 - Local Notifications

Usability testing

I conducted usability testing on the four candidates that I used for my user research. I asked them to walk me through three different scenarios and then asked what their overall impressions were, whether something was unclear to them at any moment and if there was anything else they wish they could do.

"I don't understand why this isn't a feature yet."

- Design Lead at 3XN Architects

"Personally, I would love to have this!"

- Student at SCAD

How can it be improved based on user feedback?

Below you can find some of the small revisions that I made based on the usability testing.

The Solution 💡

Problem 01

Forgetting to check the weather in the morning (or evening before) prior to leaving the house.

Solution

Setting up morning reports with all the information that is relevant.

For Alice, this means she is automatically aware of the weather so she can prepare for going on an outdoor run or to work.

Problem 02

Not having enough heads up to plan for bad weather on a trip.

Solution

Setting up holiday planning reports for that specific location.

Alice can set up a limited time report for the dates before she goes on her trip so she can see how the weather will be.

Problem 03

Not being prepared for bad weather, such as heavy rain, strong wing or high UV.

Solution

Setting up notifications for specific weather occurrences.

Alice can choose to set her notifications and customize the threshhold based on what her needs are.

Problem 04

Setting up detailed notifications for a specific location.

Solution

Differentiating between 'Global' and 'Local' notification settings.

Alice can choose to set her extreme weather notifications just for New York.

Final thoughts

Learnings

🧩 Designing for many possibilities in a simple way.

I wanted to give users the ability to personalize their notifications as much as possible while maintaining the simplicity and clarity of the existing interface. It was challenging, but I took inspiration from the customization aspect of iCalendar and integrated that structure into the iWeather notifications.

👾 Respecting the current interface design.

I spent some hours just doing research on the Human Interface Guidelines in order to confirm that the changes I was suggesting respected the existing framework. It was interesting to see how detailed and layered many of the components are.

Next Steps

🤖 Conducting A/B testing.

It would be helpful to test out the prototype on a group of people for a two-week period or so, in order to better understand what works and doesn't.

🛠 Development

Handing off the design to a developer and working together for smooth implementation.

‹ Previous

› Next

Selected Works