Problem
People trusted the presenters, but not the app
Five years after launch, research showed why.
Different forecasts were wearing away trust
People saw differences between BBC forecasts and other apps, and it was wearing away their trust in the BBC.
Phones already came with a weather app
So fewer people needed ours. Active users fell 11.2% in two years.
People wanted more to plan their day with
The chance of rain, UV levels, pollen counts and the forecast hour by hour.
The app looked dated and was hard to find your way around
People told us these were their biggest frustrations.
Old app · Home
Old app · Hour by hour
Opportunity
A new supplier was the chance to rebuild trust
After nearly 100 years with the Met Office, the BBC moved its forecasts to MeteoGroup, cutting costs and adding the detail audiences had asked for. But leaving a British institution raised concerns about trust. The forecast had to feel equally reliable on TV, on radio, online and in the app.
Service design
Every touchpoint had to be trusted
The BBC made the redesign its first service-design initiative, bringing the teams together around one Weather service. Engine, a service-design agency, ran workshops with the Weather team and mapped how people came across the forecast in each channel.
That work set the vision. I led the app design from that vision through to launch.
What the service needed from the app
- 1Weather data: the new forecast had to feel as reliable in the app as on TV and radio.
- 2My location: hyper-local weather for wherever someone is, and the places they care about.
- 3Responsive site: one way of telling the weather across the app and the site, with the site going deeper.
- 4Television: the same brand as the forecasts on TV.
- 5Across the BBC: weather that could sit inside other BBC products, like News.
Brand direction
Bringing the brand direction to life in the app
The BBC Weather team worked with Moving Brands on the new brand direction for Weather, “Window on the Weather”. It came from something everyone does: looking out of the window to check the weather. The idea was that every device would work like a window.
On TV, that idea came through in footage of real weather conditions. My role was to bring it to life in the app, while keeping the forecast clear and easy to use.
Research and testing
Designing for everyone meant saying it three ways
Designing for everyone felt overwhelming, because what one person needed, another didn’t care about. So I led a diary study: 20 people kept weather diaries for six weeks. A trip to the shops took one quick check, but a camping holiday meant checking again and again in the run-up.
“With my angina, rain I can cope with. It’s the wind that keeps me in.”
After the diary study, interviews and usability research, the whole team agreed every screen would say it three ways, in pictures, words and numbers, at three depths.
| Under 3 secondsCheck | Under 10 secondsValidate | No time limitInvestigate |
|---|---|---|
| Check the weather and get on with the day. | Validate a plan the weather could affect. | Investigate the weather for the plans it affects most. |
| Decide without having to think. | Ask a little more, and keep it usable for everyone. | The best data available. |
Key decisions
Testing changed three product decisions
We tested fortnightly, section by section. I led the app testing, and Nick Lockington, Senior UX Designer, led the web testing.
Long-range forecasts
We kept hourly detail across all 14 days
We tested reducing long-range detail from hourly forecasts to larger blocks. People read this as information being withheld. So we kept hourly detail across all 14 days, with meteorologists and editorial explaining why forecasts change.
Tested · day 6
Launched · day 6
Day 6, before and after: three-hour slots, then every hour.
Chance of rain
We showed percentages, including 0%
People interpreted “high”, “medium” and “low” differently and wanted to know the percentages behind them. Their thresholds for acting differed too: 20% was enough for one person to take an umbrella or change their plans.
We showed the percentage for every hour, including 0%.
“That’s quite a comforting thing to see, if it’s 0%.”
Tested
Launched
The same hours, before and after.
Temperature curve
After launch, we dropped the planned temperature curve
We had planned a temperature curve for larger phones and tablets. Accessibility research found that the website’s curve made the forecast harder for some people to read, while the app’s aligned rows were easier to follow.
We dropped the planned curve and used the development time for research fixes, including moving the VoiceOver cue.
“It all lines up a lot better on the app.”
Solution
One forecast, at three depths
The more a plan mattered, the more detail people needed. So there are three depths: a three-second check, a ten-second look at your plans, and the full detail when you need it.
Now the answer is on the first screen
Most checks were a quick look before heading out, so a written summary, a high and a low, and the day ahead come first.
“The information’s clear and I like how I can reveal more by swiping.”
Before
After
The hours come next, each one at a glance
People asked for the chance of rain, so each hour shows its symbol, temperature, chance of rain and wind.
Before
After
The detail is one tap away
Bigger plans needed more detail, so one tap shows humidity, pressure and feels-like, with the hours around it still in view.
Before
After
Motion
Motion brought the broadcast into the app
The BBC’s Broadcast Design team led the icon motion. I oversaw the motion in the app, and James Robinson animated it. Symbols animate as each place loads, bringing the broadcast’s moving weather into the app.
Icon motion
Symbols that animate as each location loads
The app shares its icon motion with the TV forecasts, from the BBC’s Broadcast Design team.
Accessibility
The sky blurs behind the detail
The sky blurs back when you drag across the detail, giving the numbers a clearer background.
Planning ahead
Browse the week the way you’d look out of the window
Tap or swipe through the days and the sky, symbol and summary change together.
Each part of the app sticks to one span of time
A day gets a high and a low, an hour gets one temperature, and Now sits with the hours, not the days.
Saving a place
Your places come with you across the BBC
Sign-in had to give something back, so I placed the request when someone saved a place. Their saved places followed them into News and Sounds. Signed-in users rose 25% while sign-in was still optional.
Related case study
Each surface found its own window on the weather
The skies behind every screen came from their own project: 44 weather states from 41 reusable layers, on a £20,000 budget.
Accessibility
We tested with 12 disabled people
Every testing round included someone with access needs, and designs were checked against WCAG AA and the BBC Mobile Accessibility Guidelines.
A month after launch, we worked with an independent agency to test the app and website, most participants at home using their own assistive technology. A key concern for the app was readability over changing skies. We also analysed app-store reviews and comments, emails and other feedback.
What worked
Five of seven app participants found it clear and easy.
“The colours in the background make the information stand out.”
What didn’t
Readability depended on the weather.
With inverted colours, one participant could only read the app against sunny backgrounds. A blind participant missed the hourly forecast because VoiceOver announced “button” at the end of the summary.
What we changed
We adjusted about ten backgrounds and moved the VoiceOver cue earlier.
We did not build a plain-background setting. That remains an option I would test.
Results
We planned a quiet launch and got the Beast from the East
The app had its highest traffic ever, and the compliments outweighed the complaints we’d expected. BBC Sounds and BBC News later took up the service-design method.
signed-in users, while sign-in was optional
Back in the App Store and Google Play after launch
from more than a million ratings
Audience response
Unprompted response after launch
Weather is part of people’s day, so they notice when it changes. People posted about the new imagery, and about symbols that now moved.
Reflection
Designing for trust by making uncertainty visible
We tapered the detail in long-range forecasts to show uncertainty, but people read it as information being withheld. When we described the chance of rain in words, people interpreted the same phrases differently.
Both findings challenged my assumption that simplifying a forecast would make it easier to understand. People wanted to see the detail and the numbers behind it. They also needed the meteorologists’ explanation of what the forecast could and couldn’t tell them.
I learned that explaining uncertainty is part of the design. The detail, numbers and explanation needed to work together to help people judge what the forecast meant for their plans.
Thanks to
Tammy Gur Head of Design News and Weather, Yael Levey Creative Director, Nalika Kala Creative Director, Nick Lockington Senior UX Designer on web, Robyn Porter UX Designer on web, Anoushka Ferrari Information Architect, Mansha Manohar UX Research Manager, Amelia Stil UX Researcher Manager and Jennifer Hart UX Researcher.
