The Living Land
An interactive WebGL gallery of six Kazakhstan landscapes with real-time video-texture compositing.
6
landscapes composited in WebGL
−70%
mobile photography transfer (7.14 → 2.15 MB)
0
build steps or runtime dependencies
Six Kazakhstan landscapes, each photograph composited in real time with timelapse video, water displacement, and light/mist animation through scene-specific mattes — in plain JavaScript and WebGL, with full keyboard and reduced-motion support.
Motion only where the world moves
Each landscape starts as a photograph. WebGL adds restrained motion — timelapse skies, water displacement, mist, and light — and scene-specific mattes keep it where it belongs: water motion is perspective-scaled and confined to the lake mattes, so reflections move without bending shorelines, trees, or foreground objects.
The site is plain JavaScript and WebGL with no build step or runtime dependencies. Mobile visitors get lighter photography and 1280px video loops, video pauses whenever it is out of view, and visitors who prefer reduced motion get the still photographs.
Highlights
- Real-time WebGL compositing of photography with timelapse skies, water displacement, and light/mist animation, confined by scene-specific mattes
- Mobile photography transfer cut from 7.14 MB to 2.15 MB while desktop keeps the original 2400px images; lighter 1280px video loops below the mobile breakpoint
- WebGL portraits start lazily near the viewport, and video pauses when off-screen or in a hidden tab
- Keyboard navigation with fullscreen previous/next controls, Escape handling, and a reduced-motion mode that falls back to still photographs