Tranquility · Real-time 3D

// 01 · IN MOTION

The river, in motion.

showcase film

// 02 · THE SCENE

A stream, rendered live.

live render · drag to look around

The camera sits in the middle of the stream. Drag in any direction and the whole valley is there: mossy boulders, ferns, spruce and willow, birds crossing now and then, koi holding in the current.

Looking up the valley: tall spruce and weeping willows over the stream and a small waterfall

// 03 · JAKARTA TIME

Morning, golden hour, night.

time-lapse · 03 times of day

The sky, the sun angle, the water color and the sound all follow the clock in Jakarta. Open it at lunch and it is bright midday; open it after dinner and you get moonlight, crickets and frogs.

Morning, a low sun over the default view — Morning

Golden hour, looking back downstream to the snowy peak and its reflection — Golden hour

Moonlit night over the default view — Night

// 04 · PROCESS

From a koi pond to a river.

engine swap · pond → river · scans · fixes

A hand-built river came first and never quite convinced. So we switched to a proven open-source water engine, Sourany Phomhome's Koi Pond Garden: real reflection and refraction, caustics on the bed, light that fades with depth. Then we took the garden out of it and turned the pond into a long mountain river, inside a fixed budget of 4.5 million vertices and 112 draw calls. Scanned stones, ferns and trees arrive a second after the river appears and dissolve in over the simple ones, so the first view stays as light as it was before them. The last round fixed what still looked wrong: one natural summit instead of a spiky crown, golden light instead of mauve, and a night foreground you can actually read.

Left: the koi pond phase. Right: the same engine rebuilt as a mountain river.

BeforeAfter

Before and after: the procedural stones and trees replaced by scanned stones, ferns and modeled trees

BeforeAfter

Before and after: the spiky crown peak becomes one natural summit in golden light

BeforeAfter

Before and after: the night foreground brought up so it reads under moonlight

BeforeAfter

// 05 · DETAIL

Stones, falls, a kingfisher.

closeups · wildlife · loader

Scanned stones and ferns, trees and birds from open libraries, all slimmed down for the web. Every so often something happens: a few koi pass, a kingfisher or a sparrow crosses, and at night there are fireflies and an owl. Sound joins on your first tap, placed in 3D. Even the loading screen is built in code: five koi varieties, animated from two generated stills, swim while the scene arrives.

Mossy stones in front of the falls — Stones and falls

Rocks and caustics on the stream bed — Rocks and caustics

A kingfisher crossing the stream — Kingfisher

The loading screen: five koi varieties swimming — The loading screen, built in code

// CREDITS · EXPERIMENTAL

Credits.

third-party assets + tools

Scene based on Koi Pond Garden by Sourany Phomhome (MIT License). Rendering with three.js (MIT). Geometry decoding with meshoptimizer by Arseny Kapoulkine (MIT).

Trees: Spruce and Willow by evolveduk, Conifer (medium-Poly) by Sereib, oak trees by DJMaesen, on Sketchfab, licensed under CC BY 4.0. Adapted for the web: simplified, materials merged, textures resized.

Birds: Belted Kingfisher, in Flight and Song Sparrow, in Flight by osuecampus on Sketchfab, licensed under CC BY 4.0. Adapted for the web: legs and specular map removed, textures resized.

Stones and ferns from Poly Haven (CC0): Rock Moss Set 01 and 02 by Kless Gyzen, Fern 02 by Rob Tuytel and Rico Cilliers.

Sounds from Freesound (CC0): Rice Field by qubodup, Outdoors_Night_CricketsLoop by MrFossy, Ambiance_Frog_Night_Loop by Nox_Sound, Owl Hoot by Breviceps. Stream sound in the video: water river stream creek close soft good detail by kyles.

Loading screen: koi animated in code from two stills made with OpenAI gpt-image-2.

Not affiliated with any brand or rights holder referenced.