Skip to content

Marble Run

Glass marbles rolling round a wooden roller-coaster track, speeding down slopes and slowing over crests. Loops perfectly.

3D object, V2 Objects3DSeamless loop, verified145 lines of codev1.0.0

In Toys, games & parties

Next: Jelly CubeSurprise me

Marble Run preview
Starting live preview…
00:00:00:00 / 00:00:00:01

Live, running the real source at reduced resolution.

Your current settings go with it. Combine several clips and hand them over together from your sequence.

Effect controls

Presets

4
1

The preview runs the same code your AI receives. These settings travel with the hand-off.

Info

What it is

Glossy glass marbles rolling round a wooden track that rises and falls in hills and swings through bends, held up on slender posts. The track is a closed circuit, so the marbles never stop: each one accelerates down every slope and slows over every crest, with its speed worked out from the height of the track, and together they make exactly one lap of the circuit per loop. Choose the number of marbles, the track layout (gentle, rollercoaster or figure), the wood (oak, walnut or birch), the laps per loop, the backdrop colour and whether the camera sways.

Reuse it in your own idea

  • Toy brand: Oak rollercoaster.
  • Soft: Birch, gentle.
  • Busy: Walnut, six marbles.

Which part is reusable

src/marble-run.js is the ingredient your AI reuses. demo.js is only the example scene around it, and uses chrome-material only for the demo.

Good to know

  • The marbles' speed follows height but is not a rigid-body simulation: they do not leave the track.
  • Marbles do not collide with each other.

Technical details

Technical details
Implementation
Three.js 0.185.1 (WebGL) · ES module src/marble-run.js
Exports
  • createMarbleRun({ marbles?, track?, wood?, laps? }) => { group, setProgress(progress), dispose() }
  • TRACKS: { gentle, rollercoaster, figure }
  • MARBLES: string[]
Dependencies (exact)
  • three@0.185.1 (source) — Renderer, geometry and shader materials.
  • chrome-material@1.1.0 (demo) — Studio environment light, backdrop and contact shadow.
  • apw-runtime@1.0.0 (demo) — Demo harness.
How it fits a scene

Coordinates: The circuit is centred on the origin, 9–12 across, rising to about 6.5 above the floor; marbles of radius 0.3 roll in the trough; the camera looks down at 29°.

Lighting: A warm key light with a shadow map, a shadow-catching floor and the studio environment.

Timing: setProgress(progress) places each marble from a precomputed time table of the circuit; frames render in any order.

Output
1080×1080, 30 fps, 16 s · procedural (computed from the frame number) · seamless loop — The marbles make a whole number of laps of the closed circuit per loop with their speed set by the track's height, each marble turns a whole number of times per lap and the camera sway is a sine of the loop, so the last frame meets the first.
Tested
Rendered 480 frames on 2026-10-06 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 track mesh of about 3 600 triangles, 28 posts and up to six marbles with a shadow map: about a millisecond a frame on an integrated Intel GPU. Software WebGL renders in about two seconds a frame.
Export a video yourself
Download the source, then in the folder: npm install npm run render -- marble-run/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:a5cfaafa510ef54e…
Files
License
MIT. Copyright (c) 2026 AI Pixel Wizard. Released under the MIT License. See LICENSE in this folder. License details
Provenance
Adapted from the owner's threejs-sketches/objects-scenes/marble-run (MIT) and rebuilt for AI Pixel Wizard in October 2026 as an original studio object: a closed wooden roller-coaster circuit swept from a space curve, with marbles whose speed is tabulated from the track's height, on an exact loop.
BinMore like this

Jelly Cube

3D object3DSeamless loop10 seconds

Ball Clock

3D object3DSeamless loop16 seconds

Coin Stack

3D object3DSeamless loop12 seconds