Designing an application for live weather forecast, news and community

At a glance

This is a redesign project for WeatherBug, with the vision of becoming a weather forecast platform that allows tracking and sharing among community, competing with iOS weather app and AccuWeather.

The goal of this particular project was to identify any usability issues with the current release and determine the critical features to prioritize for the next iteration of the product.
Redesign Project
My Role
Product Designer
September - December 2020

Current WeatherBug app is confusing to use...

" The overall design seems confusing to me and Iโ€™d prefer a simpler app without a lot of scrolling happening. "

- Tina, 24, Interviewee

" Itโ€™d be cool if there are additional features to make this app stand out and more interesting to use! "

- Jeff, 25, Interviewee

Problem Space

Based on user research, here are major problems of current WeatherBug app that could be redesigned to bring more traffic and higher user conversions:


Random news feed can be overwhelming
Visual design is packed and outdated


Not many users understand how to use tracking system
It takes a lot of scrolling to find key weather metrics


The app doesnโ€™t portrait a connection with users
Users wish for additional features to make it more engaging

Problem Statement

"How might we bring more interactions to the app space by helping users understand its functions and incorporating them to everyday life?โ€

WeatherBug focuses on providing up-to-date weather info, but there is an opportunity to build a connection within the community so users want to keep coming back.

Design Goals


A weather forecast platform that allows tracking while traveling and sharing among community


All-in-one platform for weather updates and news

Separate news page while searching to keep usersโ€™ attention without taking away their interest in searching for weather


Stay updated on weather condition, wherever you go!

For users traveling from one location to the next, they can track the weather along the way to make sure they are fully prepared.


Share real-life mood boards for inspirations

Stay connected with friends by sharing your current weather condition at your, and let them know how you are doing ๐Ÿ˜„

The Comparison

Homepage now has a clean and modern style with clear sections for weather, news and moodboards

There is so much more to weather details other than just degree that can be represented by creative icons. Fluctuations are shown in graphs.

Clear Call to Action and metrics measure so users know exactly what tracking function is for and can start seeing the results

Design Challenges

How might we show necessary weather metrics to users without making them feel overwhelmed?
In the process of designing daily weather details page, I got caught up with what information to present and how I might want to show it. I was deciding between a version using text to describe weather condition on a certain day and a second version where icons and charts are dominant.

I decided to conduct A/B testing facing potential users to get a better sense of user needs and what they prefer. It turns out up to 90% users selected the second version! ๐Ÿ˜„
How might we categorize weather updates, local & national news and mood boards sections in a concise and simple way?
In the old version of WeatherBug, all information about weather, news and ads are crumped up together on a single page, which is quite distracting and can be overwhelming.

In my redesign, I used tabs to categorize the information on the platform to give users a clear pathway for the type of information they are looking for on the homepage.

Weekly weather updates with details for each day

Local and national news is one of the main features of WeatherBug

Mood boards for users looking for inspirations from real-life examples

Weekly weather updates with details for each day

Local and national news is one of the main features of WeatherBug

Mood boards for users looking for inspirations from real-life examples

What do users want to see on app landing page?
I also struggled deciding between showing location options on landing page as an entry point and showing directly the weather condition in current location. After A/B testing, users chose 100% version B because people want to be able to get weather information of current location as soon as they open up the app.

Final Design

Learnings & Next Steps

1. At the beginning of design phase, I was overly ambitious - trying to implement as many features as possible in a single user flow. Later on during usability tests, I realized that sometimes "Less is More". My design became so much more clear and functional during the second round of testings.

2. I now value the importance of doing usability testings more than ever as they are the direct feedback from actual potential users, even when your design is still in incubation phase.

3. I plan to add more features to the existing redesign in order to make the app interfaces more interactive: ranking system for top three cities or even include a travel plan.