IBM · The Weather Company · Case study
Android notifications and a resizable widget
- Android Native Patterns
- Notification UX
- Android Widgets
- Severe Weather Alerts
- Competitive Research
- Information Density
- Material Design
- Role
- Lead Product Designer
- Timeline
- Aug 2016 to May 2017
- Platform
- Android
Final notification treatments on Android M and N, with launcher widget modules at two sizes.
Overview
Engagement starts before the app.
The Weather Company on Android needed stronger engagement on the surfaces users reach before the app opens. Notifications are for moments that deserve an interruption — severe weather and alerts that cannot wait. On the launcher, the widget serves a different need: a persistent, customizable weather read users choose to keep visible throughout the day.
Each track carried its own constraints. Notification design needed to map severe weather to Android’s panel hierarchy with enough detail to drive an app open, without crowding the list. Widget design needed to scale from a 1×1 through 2×4 and stay legible on dynamic wallpapers across 26 languages. A competitive audit set the starting point for both.
Strategy
From audit insight to release plan.
- 01
What the competitive audit found
The audit compared popular consumer apps and weather competitors on panel density, expandable layouts, and alert hierarchy. Every app in the sample used the same visual weight for a routine forecast update and a severe-weather alert, and TWC was no different. That finding became the release brief: if the product could not distinguish urgent from routine, no visual polish would matter.
- 02
Alerts when needed, widget by choice
Notifications are reserved for moments that deserve an interruption: severe weather and alerts the product needs the user to see. The launcher widget answers a different question: how does someone want weather to look throughout their day? Treating both as the same broadcast channel would have blurred urgent and ambient, so notification design mapped NWS alerts to Android’s priority scale while widget design focused on module sizing and user-controlled density.
- 03
From references to final notification specs
Design moved through Material references, composition studies, and a gap analysis before spec work began. The key decision on Android N was replacing separate forecast and alert rows with a combined notification, because duplicates had been pushing TWC content down the lock screen during severe weather. Both M and N shipped in parallel because one spec set would have left a significant share of the install base unsupported.
- 04
Widget audit through engineering handoff
Widget design treated the launcher as a preference surface, not a second notification channel, because repeating the notification model would have turned the widget into clutter users remove. Competitor research set formatting limits and hierarchy rules, and from there concepts explored module sizes from 1×1 through 2×4 so users controlled how much weather stayed visible. Engineering redlines locked in touch targets, padding, RTL mirroring, and legibility on dynamic wallpapers across 26 languages.
Research
The notification competitive audit
Before concept work began, the team gathered notification examples from popular consumer apps and weather competitors into a research board. The focus was panel density, expandable layouts, and whether any app visually separated routine updates from urgent alerts.
Across the sample, nearly every app treated routine and urgent messages with the same visual weight, and TWC was no different. That pattern became the starting point for the release brief and the two-track approach that followed.
Design
Designing for Android notifications.
Reference boards for notifications
References spanned Material Design guidance, third-party panel density, and weather-specific layouts on Android M and N. The boards set practical limits for media, quick actions, and type hierarchy on expanded notifications.
Material notification patterns on M
These frames are reference research for established Material Design notification patterns on Android M: standard collapsed and expanded layouts, actions, and hierarchy. They were a baseline for the team, not a TWC competitive comparison.
Panel composition explorations
Before concepting, the team mapped how enhanced previews, expandable collapsed and expanded states, and alert integration could close the gap against competitors while matching the native Android theme refresh.
TWC beside competitor notifications
Competitor notifications were placed beside TWC treatments so the brand and finish gap read as a brief, not a critique. The comparison showed the same visual weight for a routine forecast update and a severe-weather alert. TWC needed clearer tiers before a visual refresh.
Exploring AI chat in notifications
Early exploration of Watson-powered chat inside the notification panel. The flows tested how assistant content could appear in expanded notifications and what still fit within Android quick-action limits.
Photos and video in notifications
Embedding video, radar, and photo content in the panel was the primary differentiator TWC could offer over aggregators. Variants tested how much media belonged in the collapsed notification versus the expanded layout.
Three quick actions, chosen carefully
Quick actions were constrained by Android tap-target rules and a maximum of three actions. Finals favored radar, hourly, and severe-destination shortcuts over editorial extras, with spacing that stayed legible at collapsed height.
Temperature and brand color
Temperature display variants explored whether color cues on the condition line improved scan time without competing with alert legibility.
Android priority scale and one list item
Android ranks notifications by importance on a priority scale. Each TWC alert type had to map to the right level so urgent weather could surface above ambient panel noise. Separate forecast and alert rows during severe weather created overlap and pushed content down the list. The unified ongoing notification carried forecast context and escalated in place when a watch, warning, or advisory was active.
Three tiers for severe weather
The NWS watch, warning, and advisory hierarchy maps to distinct user actions. The app expressed that as three visual tiers (ongoing, alert, and warning) with stronger color, a larger glyph, and fewer quick actions at the top tier.
Combined severe states on Android N
Android N refinement applied the unified notification strategy from the priority-scale work. One list item replaced duplicate forecast and alert entries during severe weather so warnings stayed visible and ranked higher on the lock screen.
Color passes before finals
Screens were refined for Android M and N: ongoing palette, alert breaks, and expanded states before the final spec pass.
Final notification states on Android M
Final M screens consolidated ongoing, alert, and warning collapsed and expanded states, including media and video variants.
Final notification states on Android N
Final N screens applied the same three-tier system with OS-specific refinements: combined severe states, expanded alert copy, and video-capable ongoing treatments.
Design
Weather on the launcher, on their terms.
Competitor widget benchmarks
Before TWC-specific layouts began, a competitor benchmark set the bar for what a credible weather module on the launcher should look and feel like.
What the widget audit required
Widget reference research audited competitor modules and documented constraints: formatting limits, a deprecated information hierarchy, and layout export rules. Layouts were validated across size breakpoints, tested for accessibility on dynamic backgrounds, and checked across 26 languages.
Full and lite app variants
Full-experience concepts refined the widget against measured layouts, including adjustments for the Android Lite app style so smaller installs kept the same hierarchy.
Module sizes from 1x1 to 2x4
The final widget system used dynamic styling for LTR and RTL content. Modules scaled from 1x1 up to 2x4 so users could choose how much weather stayed visible without opening the app.
Engineering redlines for the widget
Final redlines specified touch targets, padding, and RTL mirror rules for engineering handoff.
Outcome
What shipped on each track.
3
Notification tiers: ongoing, alert, warning
2
Android OS generations (M and N)
16
Widget layouts: 8 grid sizes × LTR and RTL
26+
Languages tested for widget integration
Reflection
Why the panel and widget mattered
For Android users, weather often reached the notification panel or the launcher widget before the app itself. Notifications earned attention during severe weather by treating interruption as something to justify, not default to. The widget gave users a consistent, resizable read they controlled on the launcher.
For The Weather Company, the two surfaces played distinct roles in engagement. Notifications carried urgent alerts when the product needed to break through, while the widget carried the everyday read users chose to keep visible. Parallel M and N specs ensured the same tier system reached the full install base, and a resizable widget module gave TWC a credible presence alongside native-first competitors.