Playing in more places
Folded the data into the page itself, so it works as a single file, including in previews that open one file at a time.
About this project
A narrated animation, a little over two minutes long, in landscape and in an upright version for phones, explaining the 2026 El Niño: how El Niño works, how this one compares with the biggest on record, and what it is doing around the world.
It is made entirely with code. The pictures are drawn in the browser with JavaScript, frame by frame, from NOAA and Met Office data. The same code plays in a web page and renders the MP4 video. The narration is a synthetic voice (Kokoro), generated offline on a laptop; no voice service was used.
Every figure on screen is checked against its original source, listed in sources.md alongside the claims we chose to leave out.
A note on “record”
Whether this El Niño has broken the record depends on the measure. On the traditional measure it has matched the 2015 peak of 3.0C. On NOAA’s official measure, which since February 2026 strips out the warming of the whole tropical ocean, it has not yet passed the 1982 record. What holds on every measure: it has grown faster than any El Niño on record, and forecasters expect it to become the strongest. The video says so.
Diary
Milestone
Upright for phones, and published
Added a vertical version for phones. It is the same animation, with every scene laid out again for an upright screen: the charts grow taller, the world map gets numbered dots and a list, and the captions are about twice the size. On a phone it starts by itself, silently, when it scrolls into view, with a button to hear the narration from the start. It never starts by itself for people who have asked their phone to reduce motion.
The narration now loads only when someone turns the sound on, which makes the page a tenth of its old size. Published on GitHub Pages.
Milestone
A look of its own
Dropped the Guardian fonts, colours and styling, so the piece can stand on its own. The new look pairs Newsreader, a free serif designed for news, with Instrument Sans for captions and labels, on a night-ocean background with warm cream type. Heat runs from amber to crimson, cool water is teal, and the key numbers in each caption are picked out in colour. The trade winds now flow as streaks rather than arrows.
Milestone
Narration, and a change of headline
Added narration with a synthetic British voice, run offline so the script never leaves the machine. The scenes are now timed to the voice rather than the other way round.
Checking the sources showed that NOAA’s official measure had changed in February, and that on it the record has not yet fallen. The headline changed from “has broken its record” to “the fastest-growing El Niño on record”, which is true on every measure. A projection of 451,000 extra heat deaths was left out because it has not yet been peer-reviewed.
Milestone
First version
Researched the current El Niño from NOAA, WMO, the Met Office, Carbon Brief and Guardian reporting, then built a seven-scene animation: how El Niño works, the weekly record since 1981, this year against the biggest El Niño years, global temperature since 1850, effects around the world, and what comes next.