Motion & 3D · Intermediate
One unbroken first-person drone run through a sunlit red-rock canyon, flown like a cinematic FPV showpiece. The drone hangs beside the top of a waterfall, dives down the cliff with the water falling beside it, pulls out over a jade plunge pool, threads a stand of hoodoos, carves through a slot canyon at 130 km/h under a chockstone and a natural arch, punches through a waterfall curtain at the end of a rock tunnel, and glides out level over the next valley before settling back where it started. The speed comes from proximity and parallax; the horizon stays nearly level. There is no drone, no footage and no 3D package: the canyon is a signed distance field traced in a WebGL2 shader inside HyperFrames, the flight is a smoothed spline, and the world is a staircase of identical canyon sections, which is what lets the flight loop seamlessly. You get four exact prompts (terrain, flight spline, FPV camera, water and waterfalls) with a check for each, the complete source and the 20-second Reel,
The recipe
Every step gives you the action, the exact input (a prompt, settings or a file) and a check to compare your result against the original.




Claude Code — Claude Opus 5.5 (claude-opus-5-5) — wrote every file — your Claude plan Node.js — 24.x (24.13.1 here) — the HyperFrames CLI and the dev harness — free HyperFrames — 0.8.74 (npx hyperframes@0.8.74) — check, render (HTML → MP4) — free, runs locally GSAP — 3.14.2 (jsDelivr CDN) — the one paused timeline HyperFrames seeks — free WebGL2 — in Chrome (SwiftShader, software) — the raymarcher — free puppeteer-core — 24.22.3 (tools/ only) — dev snapshots and the clearance probe — free FFmpeg — any recent build — the Instagram re-encode, contact sheet and loop test — free Codex or any agent that can write files and run commands works too. No GPU is needed: HyperFrames renders WebGL in software, and this piece was built for that (see step 3). Provenance: Recorded September 28, 2026, and re-rendered September 29, 2026 after the rendering fix: Claude Code with Claude Opus 5.5 (claude-opus-5-5); GSAP 3.14.2 from jsDelivr; HyperFrames 0.8.74 rendering WebGL2 in Chrome 152 headless shell with SwiftShader at 1080×1920, 30 fps, 21.067 s (632 frames), no audio; the scene traced at 810×1440 and upsampled in the motion-blur pass. The render took 26 min 55 s with 4 workers on a 24-thread machine shared with other agents (beginframe capture, software GPU, HF_DE_STALL_MS=600000); the master is 38.3 MB, and the Reels copy was re-encoded with FFmpeg (libx264, CRF 21, aq-mode 3, maxrate 22M, faststart) to 19.3 MB. check passed with 0 errors and 4 warnings, all Chrome's "GPU stall due to ReadPixels" driver notes (about 11 minutes, with --timeout 180000). Camera (every frame): roll at most 14.6 degrees (mean 4.7 through the run), roll rate at most 30 degrees per second, no scripted rolls. Distance field (tools/lipschitz.js, 20,000 points per region): no rock inside any "safe" sphere in any region except a 0.003% residual of 0.19 m near the headwall base. Whole-video overstep audit (tools/audit.js, every third frame at 0.3 scale): 0.038% of pixels on average, none above 0.2% (before the fix: 0.18%, up to 1.0%). Loop test (Gaussian blur sigma 3, then SSIM, on the master): 0.8496 across the seam (last frame to frame 0) against 0.8519 and 0.8460 for the steps either side, and PSNR 24.42 dB against 24.69 and 24.14; the steps change smoothly on both sides (0.8636, 0.8593, 0.8554, 0.8519 into the seam; 0.8460, 0.8430, 0.8399, 0.8379 out of it). On the Reels copy: 0.8510 against 0.8536 and 0.8480. Numerically, the camera moves 0.2674, 0.2685 and 0.2699 m over the frames either side of and across the seam. Minimum clearance to rock along the flight: 1.53 m. No external images, footage, textures, models or generative-media models were used.