echohive
← All field notes

BEHIND THE LIVING PAINTINGS

Fifteen paintings
you can step inside.

A volcano that erupts on the beat. Ten thousand lanterns. A sheep, a duck and a rooster in a balloon. This is how we turned moments from history into two-minute worlds that run live in your browser.

Directed by echo. Built with Opus 5.5 in Claude Code. Painted with Grok Imagine. Music by echohive.

· 15 scenes · About a 10 minute read

THE COLLECTION · IN THE ORDER WE MADE THEM

Fifteen worlds, fifteen mediums.

Red-cloaked knights on horseback charge across a golden plain beneath shafts of light.
Krakatoa: the eruption column rises with lightning above a crowd of watchers on a painted tropical beach.
A tyrannosaur looks up as a blinding light fills the evening sky over a forest.
A whale shark glides through sunbeams beside a coral wall.
Chariot teams race past the turning post in a stadium made of mosaic tiles.
An ink-drawn London seen from above, with whole streets burning orange.
Courtiers throw their hats in the air as the balloon rises over the palace courtyard.
Hundreds of glowing paper lanterns drift up over misty blue mountains.
A blue streamlined steam locomotive with red wheels speeds through a Futurist landscape.
In a pop-art comic style, Blondin carries a man on his back along a rope above the gorge.
Thousands of orange monarch butterflies pour past the camera over a river valley in gouache.
A tall stone moai is rocked along a red dirt road by ropes beneath fresco clouds.
A royal procession on horseback crosses a golden square filled with cheering people.
In cyanotype blue, a laughing boy points past the Eiffel Tower toward a small red balloon.
The blue and white Earth rises above the grey horizon of the Moon.

01

The Golden Ford

Multiplane oil painting

The momentAn imagined battle painting you can move inside, from the first clash at the river to the siege beyond.

Look forRiders slide past each other as the camera moves, because every figure is a painted plate at its own depth. This is where the collection began.

Step inside The Golden Ford

02

Krakatoa

Volcanic painting · 1883

The momentA quiet tropical dawn, then the eruption, the towering wave and the red skies that followed it around the world.

Look forThe biggest blast lands on a drop in the song. The whole timeline sits on its beat grid, 129.8 beats a minute.

Step inside Krakatoa

03

The Last Day

Prehistoric panorama · 66 million years ago

The momentA golden river valley, a second sun growing in the sky, then the long night and the small survivors who inherit the world.

Look forThe herds are individual animals, each with its own pose, gait and reaction time, spread through the depth of the valley.

Step inside The Last Day

04

Into the Abyss

Painted ocean · the dive of the Trieste

The momentFrom a humpback breach at the surface, past whales and a giant squid, down to the deepest point in the ocean and back up again.

Look forOne pass of maths draws the sea surface from above and below, the reef, the trench walls and the lamp beams. Every creature is painted and placed on top.

Step inside Into the Abyss

05

The Hippodrome

Living mosaic · Constantinople

The momentFour chariot teams, seven laps, a crash at the turning post and a photo finish beneath the emperor.

Look forThe picture sets itself tile by tile at the start and shatters back into mosaic on the last lap. Each team is built from separate horse, car and wheel parts.

Step inside The Hippodrome

06

The Great Fire

Graphic novel · London, 1666

The momentFour days in September, from a bakery in Pudding Lane to a rebuilt skyline.

Look forThe City is a real 3D map of 216 by 130 plots. Each plot has its own ignition time, so houses catch, burn and fall on their own while a counter climbs to 13,200.

Step inside The Great Fire

07

Climb to the Sky

Hand-coloured engraving · Versailles, 1783

The momentA sheep, a duck and a rooster become the first passengers ever carried by a hot-air balloon, watched by the whole court.

Look forHats fly as the balloon lifts. For the chase, the camera runs with the crowd at 3.6 metres a second so the faces stay big in the foreground.

Step inside Climb to the Sky

08

Night of Ten Thousand Lanterns

Painted animation · an imagined night inspired by Yi Peng

The momentOne lantern leaves the riverbank, rises through pink mist and above the clouds, as a whole valley lets go of its wishes.

Look forAbout 10,200 lanterns are simulated one by one: painted up close, small glowing lamps in the middle distance, points of light far away.

Step inside Night of Ten Thousand Lanterns

09

Mallard, 126 mph

Futurist painting · 3 July 1938

The momentOne blue engine chases the world speed record for steam.

Look forAs the speed climbs, the landscape breaks into Futurist echoes and colour while a speedometer and a recorder chart ride along.

Step inside Mallard, 126 mph

10

Blondin over Niagara

Pop-art comic · 1860

The momentCharles Blondin walks a rope across the gorge, then does it again with his manager, Harry Colcord, on his back.

Look forComic panels open over a real 3D gorge, with the printed dots of a newsprint comic laid into the light.

Step inside Blondin over Niagara

11

Monarchs

Moving gouache · a Mexican mountain forest

The momentA fir forest wakes, and the monarchs pour off the trees in a river of wings.

Look forAbout 218,000 butterflies. The far ones are tiny solid specks, so the river stays vivid instead of melting into haze.

Step inside Monarchs

12

Moai: The Walk to the Sea

Fresco · Rapa Nui

The momentAn imagined journey: a new statue leaves the quarry and is rocked along the road on three ropes, all the way to its platform by the sea.

Look forThe statue is a sculpted 3D form, not a picture, so it can rock, lean and walk while the light moves across its face.

Step inside Moai: The Walk to the Sea

13

Mansa Musa: The River of Gold

Gold leaf · 1324

The momentThe great caravan leaves Niani, crosses the Sahara under the stars and reaches Cairo, where it spends so much gold that the price falls.

Look forA price board in the market slips from 25 to 22 dirhams. Gold in the picture is laid as leaf in a final pass.

Step inside Mansa Musa: The River of Gold

14

The Eiffel Tower

Cyanotype · Paris, 1887 to 1889

The momentA white line drawing of the tower sketches itself on the sky, then the iron is built into it, up to the 1889 World’s Fair.

Look forEverything is blueprint blue except warm things: glowing rivets, lamplight, and one red balloon that becomes the thread of the film.

Step inside The Eiffel Tower

15

Earthrise

Shin-hanga woodblock · Apollo 8, 1968

The momentLiftoff from the Cape, the long coast out, ten orbits of the Moon, and then a small blue world rising over the grey horizon.

Look forThe Earth appears on the drop of the song, after two quiet bars on the empty lunar horizon.

Step inside Earthrise
  1. The Golden Ford
  2. Krakatoa
  3. The Last Day
  4. Into the Abyss
  5. The Hippodrome
  6. The Great Fire
  7. Climb to the Sky
  8. Night of Ten Thousand Lanterns
  9. Mallard, 126 mph
  10. Blondin over Niagara
  11. Monarchs
  12. Moai: The Walk to the Sea
  13. Mansa Musa: The River of Gold
  14. The Eiffel Tower
  15. Earthrise

What is a living painting?

It is not a video. When you press play, your browser builds every frame on the spot, sixty times a second: a real 3D world, with painted people, animals, buildings and skies standing inside it. You can pause it, scrub through it, drag to look around, and watch it on your phone.

Each one tells a single moment in about two minutes, set to an original song. And each is painted in a different medium, because fifteen oil paintings in a row would feel like one long museum corridor. Instead you get mosaic, engraving, cyanotype, gold leaf, woodblock, comic book and more.

THE RECIPE

Nine steps from a moment
to a world.

01

Start with a moment worth feeling.

Every scene starts with one question: what would make someone lean toward the screen? We look for moments with a clear rise and a payoff. A first flight. A record. A reveal.

We learned the rest the hard way. The Great Fire came out powerful, and watching it back, it made us sad. So the brief changed: wonder, triumph and joy come first, and human cost stays off screen. Every scene since then ends somewhere that lifts you.

THE RULES WE ENDED UP WITH

  • About two minutes. Scenic aerials are the first thing cut.
  • Spectacle inside ten seconds. No slow openings.
  • Every act escalates. Something new must visibly happen.
  • Faces in the lulls. Close-ups whenever a wide shot starts to drag.
  • No religious or national symbols. The stories belong to everyone.
  • Depth above everything. If it looks flat, it is not finished.

02

Paint the kit before the film.

Before a single line of scene code, each scene gets a complete kit of painted pieces: skies, far hills, buildings, crowds, heroes, animals, smoke, sparks and faces. Dozens of images per scene are generated with Grok Imagine, reviewed side by side on contact sheets, and regenerated with a better prompt whenever something is off.

Almost everything is painted on a flat green or magenta background, like an actor on a green screen. A cutting tool keys out the colour, cleans the edges, splits each sheet into single sprites and remembers exactly where every piece came from.

The raw generated image: a sheep, a duck and a rooster drawn as an engraving on a flat green background.
The same three animals cut out cleanly and standing in the cobbled courtyard of Versailles.
As generatedKeyed and placed
Drag across the picture. Left: the raw study sheet for Climb to the Sky, exactly as generated. Right: the real cut-out sprites from the scene’s kit, standing on the Versailles courtyard from the same kit.

FROM THE ACTUAL PROMPT

“A study sheet of 3 separate … farm animals in a single row with very wide empty gaps between them: a fluffy white sheep, a white duck, a proud red rooster … Rendered as a hand-coloured copperplate engraving of the 1780s … There are no letters, monograms, royal ciphers, lilies, crowns, coats of arms, emblems or symbols of any kind … isolated on a perfectly flat, uniform, unpainted pure chroma-key green background (#00FF00) … ready for compositing.”

Prompts turned out to be a craft of their own. A few things we learned:

  • Name a painting and it leaks. A style note that mentioned a famous battle painting started marching armies out of cliffs.
  • Ask for stars and you get star shapes. Ask for “tiny round dots of light” instead.
  • Long lists of “no” can summon the thing. “Nothing but stars fills the frame” works better than “no Earth, no Moon, no sun”.
  • Pink disappears on a magenta key. Ask for pale golden sand and deep blue water.

03

Build a world, not a picture.

Here is the part that surprises people. The paintings are placed inside a real 3D world. The ground, the sea, the city streets, the dunes and the gorge are calculated by your graphics card for every pixel, every frame, using WebGL2. The painted pieces stand in that world as flat cards at their true distances, like scenery on a stage that goes on for kilometres.

Move the camera and the near cards slide faster than the far ones. That difference, called parallax, is what your eyes read as depth. Try it:

Move your pointer or drag across the picture to look around.

Seven real layers from the Climb to the Sky kit: sky, palace, courtyard, crowd, balloon, a courtier and the stone rail nearest to you. In the finished scenes, the ground between the cards is real 3D, and there are hundreds of cards instead of seven.

Some of these worlds are enormous, because the simulation does the work that no painter could:

  • 10,200lanterns, each on its own path through the wind
  • 218,000monarch butterflies leaving one forest
  • 28,080plots in a City that burns on its own clock
  • 10,000gas lamps lighting a tower at night

04

Depth is the whole trick.

If one idea runs through all fifteen scenes, it is this one. A flat frame is a picture; depth makes it a place. These are the moves that made the biggest difference:

  • Put something near the lens. A rail, a fern, a shoulder. The foreground is what makes the background feel far away.
  • Choose the lens like a cinematographer. The Earth over the Moon only looks huge through a long lens. A wide lens turns it into a dot.
  • Move with the action. A camera that runs with the runners keeps them big while the palace slides behind them.
  • Walk into the crowd. In Mansa Musa the camera stands inside the celebration at eye height, with people on both sides, instead of looking down an empty road.
  • Let the air do its job. Far things turn paler and bluer, just as they do in a real landscape.
Inside the crowd in Cairo as the royal procession passes, with people close on every side.
Mansa Musa: the camera stands in the crowd.
Lanterns near the camera are large and painted, while those far away shrink to glowing points over the mountains.
Lanterns: near, middle and far are drawn three different ways.

05

Cut it to the music.

Every scene is set to an original echohive song, and the song is the clock. We map its bars and its drops first, then lay the story on top: shots begin on bar lines, big moments land on drops, and quiet moments sit exactly where the music breathes.

Loudness of the Earthrise song, beat by beat, scene bars 44 to 55 The music is steady until bar 48, drops to about 8 decibels quieter for bars 48 to 50, then returns at full strength on bar 51. The horizon shot begins at bar 48, the Earth's first edge appears on bar 50, it rises on bar 51 and fills the sky from bar 53. HorizonEdgeRiseFull Earth 444546474849505152535455
  1. The spacecraft glides over the grey lunar horizon with no Earth in sight.Bar 48 The music falls away. The ship crosses an empty horizon.
  2. The top edge of the Earth just appears above the horizon.Bar 50 On the build, the first blue edge appears.
  3. Half of the Earth has risen above the Moon's horizon.Bar 51 The drop hits. The Earth rises.
  4. The whole Earth hangs large above the lunar horizon.Bar 53 Two bars later, it fills the sky.
The measured loudness of the real Earthrise song, one bar per beat, across scene bars 44 to 55. The quiet stretch is about 8 decibels softer, and the story waits for it.

The same idea runs everywhere. Krakatoa’s biggest blast sits on a drop. When The Hippodrome needed to shrink from 2:34 to 1:58, whole shots were removed on bar lines, and every musical join was scored for how naturally one bar flowed into the next before it was allowed to stay.

06

Break every lull with a face.

Wide shots show you the world. Faces make you care about it. After seeing the finished chariot race, echo asked for more of the people: the emperor, the audience. So every kit since then includes close-ups, and they cut in for a bar or two at exactly the moment a wide shot would start to drag.

One lesson from writing these prompts: describe the expression, never its cause. A reaction prompt that mentioned “the instant of a crash” painted a crash under the balcony.

07

Make it sharp.

echo noticed that parts of the walking statues looked soft. That started a sharpness pass through every recent scene. In real-time graphics, softness usually comes from two places: blur added for a film look, and patterns that smear or shimmer once they get smaller than a pixel.

  • Less lens. Lighter depth of field and motion blur.
  • Measure the pixel. Every pattern checks how big one screen pixel is at that spot, and draws its edges exactly one pixel soft.
  • Fewer, not fainter. When pebbles or flowers get too small to draw, draw fewer of them, not paler ones. Paler ones turn to grey mush.
  • Give flat things structure. Stone gets courses and joints, decks get planks and beams, water gets six layers of little waves.
Before: the river is flat and blurry, and the bridge arches hang the wrong way up.
After: crisp little waves cover the river and the bridge arches curve the right way.
BeforeAfter
The Eiffel Tower at dusk. Before: flat water, and bridge arches that had been built upside down without anyone noticing. After: crisp wavelets, and the arches the right way up.

08

Check it like a film crew.

A scene is not done because it runs. Before it ships, it goes through the same checks every time, using small scripts that drive a hidden browser:

  • Contact sheets. Frames from across the whole film, side by side, so a dull or broken shot has nowhere to hide.
  • Frame rate. Sixty frames a second at 1280 by 720, measured at full resolution rather than a quietly lowered one.
  • A phone held upright. Every shot checked at 390 by 844, where skies and framing break first.
  • Sound. Effects measured 10 to 20 decibels under the music, so the song stays the star.
  • Framing, before drawing. A probe prints where the hero will land on screen in every shot, which catches mistakes faster than rendering.
Twelve frames from Night of Ten Thousand Lanterns in a grid: villagers, musicians, children releasing lanterns, swarms of lanterns over mountains, a riverside village and the final release.
A real contact sheet: Night of Ten Thousand Lanterns, one frame roughly every ten seconds.

09

Pack it into one file.

Each finished scene becomes a single HTML file, from about 8 to 28 megabytes, with every painting and the whole song inside it. Double-click it and it plays, offline, with nothing to install. On this website the same worlds load with prepared, compressed artwork so they start quickly.

WHAT WENT WRONG

Happy accidents,
and what they taught us.

  • The upside-down bridge

    For a while, the Paris bridge hung its arches the wrong way up. Nobody noticed until the water was sharp enough to look at closely. One line of maths fixed it.

  • The butterfly sunrise

    Seen end-on, a dense river of butterflies piled into one glowing mound on the horizon that looked exactly like a rising sun. Now we film across the flow.

  • A face in the Moon

    Blotchy noise for the lunar seas formed a face at small sizes. One soft sea and fine mottling made it a Moon again.

  • Stripes on the Moon

    Regular waves hidden in the crater pattern lined up into stripes across the whole surface. Only random craters now.

  • A prop became a sun

    A tiny balloon image drawn large turned into a glowing white disc. Hero props like that are now drawn in code, so they stay crisp at any size.

  • The blurry herd

    A painted herd looked soft at its edges. Rebuilt from individual animals, each with its own gait and timing, it came alive.

  • The canal

    A straight gorge at Niagara looked like a canal. Wandering cliff lines and many narrow trees turned it back into a gorge.

  • Too sad

    The Great Fire was strong but heavy. It changed the brief for everything after it: every scene now ends in joy.

THE COLLABORATION

Who did what.

echo

Direction and taste. Picks the moments, sets the rules, watches every cut and says what is not good enough yet.

Opus 5.5

In Claude Code: the engines, shaders, cameras and timing, cutting the kits, rendering the checks and fixing what echo spots.

Grok Imagine

The painted kits: skies, sets, crowds, heroes, animals and effects, from carefully engineered prompts.

echohive

The music. Every scene is cut to an original song, and the song sets the pace.

The work happens as a conversation. A typical note is one sentence long, like “make the boring first section go faster”, and the answer is a change measured in seconds and bars. Some scenes went through many of those rounds. Each round made the scene a little better, and each scene raised the bar for the next.

DON’T JUST LOOK

Step inside.

All fifteen are free to explore in your browser. Turn the sound up.

Credits, sources, and what you are seeing

Every still on this page is a real frame rendered from the finished scenes in a headless browser, not a mockup. Frames were compressed for the web, and The Golden Ford frame is cropped. The keying comparison uses the real raw sheet and cut-out sprites from the Climb to the Sky kit. The layer demo arranges seven real layers from the same kit for this page.

The music chart shows loudness measured from the Earthrise song, averaged per beat. The sharpness comparisons are renders of The Eiffel Tower before and after the sharpness pass of September 27, 2026. Scene facts such as lantern, butterfly and plot counts come from the scene code and build notes.

The Golden Ford, Krakatoa, The Last Day and Into the Abyss are credited as a collaboration between echo, Opus 5.5 and Grok 4.6. Mallard and Night of Ten Thousand Lanterns are credited as made with Opus 5.5, with music by echohive. Painted asset kits across the collection were generated with Grok Imagine. All music is by echohive.

FOLLOW THE THREAD

Want to build worlds
like these?

Learn the methods, join the live exploration, or bring your own project.