Skip to content

A Planet Learns to Walk

A thumbprinted terracotta planet grows two little boots and waddles across a pastel clay studio, in stop motion at 12 poses a second. Loops.

Background, V1 Effects3DSeamless loop, verified79 lines of codev1.0.0

In Space & cosmos, Art & illustration styles, Made for phones

Next: A Door Into Four SeasonsSurprise me

A Planet Learns to Walk preview
Starting live preview…
00:00:00:00 / 00:00:00:01

Live, running the real source at reduced resolution.

Combine several clips and hand them over together from your sequence.

A finished film

It plays exactly as rendered and has nothing to adjust. The preview runs the same code your AI receives.

Info

What it is

A terracotta planet with raised green continents, a rolled cloud and a worried little face grows two ochre boots, finds its balance and waddles across a pastel clay studio. The movement is stepped at 12 poses a second like real stop motion, and the surface carries fingerprint arcs, tool marks and hand-pressed brows. It ends back where it began, so the 8 seconds loop. The film has no settings.

Reuse it in your own idea

  • Kids' intro: the planet is on its feet from about 1.5 s and keeps walking to the end.
  • Looping mascot: it ends back where it started, so it can repeat for any length.
  • Earth Day or geography clip: a friendly Earth that needs no voice-over to read.

Which part is reusable

src/clay-planet.js is the ingredient your AI reuses. demo.js is only the example scene around it, and uses the demo harness only for the demo.

Good to know

  • The film is finished: it has no settings. To change colours or timing, edit the shader.
  • It is composed for a 4:5 portrait frame.
  • Its length is fixed at 8 seconds; repeat the loop to fill a longer clip.

Technical details

Technical details
Implementation
Three.js 0.185.1 (WebGL) · ES module src/clay-planet.js
Exports
  • createClayPlanet() => { scene, camera, setSize(width, height), update(time), dispose() }
Dependencies (exact)
  • three@0.185.1 (source) — Renderer and a full-screen shader material.
  • apw-runtime@1.0.0 (demo) — Demo harness.
How it fits a scene

Coordinates: Composed for a 4:5 portrait frame and measured by the frame height: in a wider frame the picture stays centred at full height and its background fills the sides; in a narrower one, such as 9:16, the sides are cropped.

Lighting: Soft, even studio light with a gentle shadow on the pastel table.

Timing: The planet grows its boots, finds its balance and waddles across the frame; the motion is stepped at 12 poses a second, like stop motion.

Output
1080×1350, 30 fps, 8 s · procedural (computed from the frame number) · seamless loop — Every part of the film is a function of the time modulo its length, and every motion completes whole cycles, so the last frame meets the first.
Tested
Rendered 240 frames on 2026-10-10 in Chrome 154.0.8037.97 headless on Linux 7.0.0-38-generic (x64), Node 22.14.0 (WebGL 2 via SwiftShader (software)). Same frame twice from fresh pages: identical. Loop: Frame 0 vs end state (progress 1): mean |Δ| 0.0000, max |Δ| 0 of 255.
Performance
One full-screen fragment shader. About 20 ms a frame at 1080 by 1350 on an integrated Intel GPU (Iris Xe), and about 2 s a frame with software WebGL. Plays at 30 frames a second at full size on an integrated GPU.
Export a video yourself
Download the source, then in the folder: npm install npm run render -- clay-planet/1.0.0 --out my-video.mp4Needs Node 18+, ffmpeg and Chrome/Chromium. Add --params my-settings.json (from Copy settings) for your own settings.
Version
1.0.0 · sha256:7a11000711ffbe2c…
Files
License
MIT. Copyright (c) 2026 AI Pixel Wizard. Released under the MIT License. See LICENSE in this folder. License details
Provenance
From the owner's collection Twenty Impossible Worlds: the original GLSL ES 3.00 shader of the film “A Planet Learns to Walk”, created with ChatGPT / Codex and used as published, wrapped for AI Pixel Wizard as a three.js full-screen shader in October 2026. The collection's synthesised soundtrack is not part of this ingredient.
BinMore like this