Cinematic Zoom

Three.js is an open-source JavaScript 3D library developed in the mrdoob/three.js project for assembling and rendering procedural scenes in browser applications, including Fable 51 Worlds, Human Atlas, browser FPS worlds, CAD workspaces, and physics games. It creates scenes containing cameras, geometry, materials, meshes, and animations, with WebGL and WebGPU renderers and SVG and CSS3D renderers available as addons. Its official site and repository provide documentation, examples, tools, an editor, community resources, and a JavaScript module distribution.

Kage is an interactive five-chapter night walk through a Kyoto mountain temple, rendered live in Three.js and WebGL. As the page scrolls, a camera moves through procedurally constructed architecture, lantern light, fog, rain, drifting leaves, terrain, a vermilion moon, and a restrained bloom pipeline. Generated scene plates, alpha-preserving WebP foreground artwork, editorial typography, and section-specific fade and blur transitions are layered over the live 3D world. The project is a deliberately small static site contained in one HTML document, using a vendored Three.js r149 build without a package manager or build step. It includes chapter navigation, responsive mobile layout, reduced-motion behavior, and a custom cursor for precise pointer devices; it has no runtime network dependency. No license is granted for reuse or redistribution of the original Kage code or artwork, while the included Three.js runtime retains its MIT license notice.

Flute is an open-source React tool by Web Prodigies for creating cinematic 3D scenes from an application's existing live UI. It integrates with Next.js and Vite projects, and provides a portable React wrapper for other browser-based hosts. Scenes use JSON definitions paired with React components that import the host application's real components and return Flute Surface elements. The shared studio handles camera movement, depth of field, playback, scene selection, snapshots, and deterministic video capture; depth of field uses a DOM-blur approximation rather than ray-traced bokeh. The renderer preserves the app's existing providers, styles, and components instead of duplicating the UI. Flute runs locally and is distributed as the `@webprodigies/flute` npm package under the MIT license. Its CLI supports scene initialization, synchronization, preview, snapshots, and MP4 export at 30, 60, or 120 FPS; Chromium and FFmpeg are required for export. It supports React DOM 18.2 or 19 and requires Node 22.12 or newer for the CLI. A React Native application without browser DOM is not supported.

scroll-world is an agent skill for Claude Code, Codex, and other SKILL.md-compatible agents that builds scroll-scrubbed 3D world landing pages for brands and industries. It generates cohesive isometric diorama scenes and image-to-video camera flights, linking scenes through first/last-frame conditioning so the camera appears to move continuously as the visitor scrolls. The skill provides prompt templates, an AI image and video rendering pipeline using Higgsfield, Monid, Seedance, Kling, or Codex image generation, and a framework-agnostic vanilla JavaScript scrubbing engine that can be used with plain HTML, Next.js, Vue, or a Python-served page. It can also render a separate portrait chain for mobile devices and requires external rendering services or CLIs, ffmpeg/ffprobe, and Python with Pillow.

Sakura Crossing is an explorable Japanese suburban railway-crossing neighbourhood built as a real-time Three.js 3D scene and rendered to resemble a hand-painted, cel-shaded 2D anime background. The spherical town includes a railway, shopping street, shrine, school, library, residential areas, festival ground, hills and a drainage channel; users can walk, ride an e-bike, call a train, interact with vending machines and other objects, and orbit out to view the planet. Signs, lanterns and other facade details are drawn at runtime with Canvas2D rather than loaded as image assets, while the outlines use a screen-space second difference of depth instead of an edge filter. The repository runs with Node 18 or newer, Three.js and Vite, and provides development and production-serving commands.