Build a cinematic 3D recreation of Bolivia’s Salar de Uyuni mirror effect using Vite, Three.js, and plain JavaScript.
Environment: Create an enormous, perfectly flat salt desert covered by a thin layer of still water. Reproduce the iconic infinite-mirror effect with a vivid blue sky, beautiful white volumetric clouds, and a distant mountain horizon. The sky and its reflection must blend seamlessly across the horizon.
Procedural human cyclist: Generate a convincing human figure entirely from procedural geometry no external models or assets. Use natural human proportions, a smooth head, torso, shoulders, articulated upper arms and forearms, thighs, shins, and feet. Position the rider naturally on the bicycle, with hands gripping the handlebars and feet attached to the pedals. Avoid a blocky or toy-like appearance.
Bicycle: Construct a detailed bicycle with a realistic frame, fork, handlebars, saddle, two wheels with rims and spokes, pedals, crank, chain, and tires. Ensure the cyclist’s proportions and riding position align correctly with the bicycle.
Animation: Animate the bicycle moving slowly across the salt flat. Rotate the wheels and crank, synchronize the rider’s leg movements with the pedals, and add subtle body movement. Keep the hands attached to the handlebars and the feet aligned with the pedals throughout the animation.
Water and reflections: Create a highly reflective, shallow water surface with convincing reflections of the sky, clouds, cyclist, and bicycle. The cyclist’s reflection must remain correctly positioned directly beneath the rider and update continuously as the bicycle moves. Add subtle ripples around the tires without destroying the mirror effect.
Lighting and atmosphere: Use realistic daylight, physically based materials, soft shadows, atmospheric perspective, and natural color grading. Create a seamless transition between the distant horizon, sky, and water reflection.
Camera and composition: Use a cinematic vertical composition inspired by photographs of cyclists crossing Salar de Uyuni. Keep the cyclist relatively small against the vast landscape, with the horizon near the middle of the frame and expansive sky and reflections dominating the scene. Use a slow tracking camera that follows the cyclist smoothly. Support optional mouse orbit and zoom.
Procedural clouds: Generate visually rich, soft, volumetric-looking clouds using procedural geometry or custom shaders. Animate them subtly and ensure their reflections match the sky.
Interaction: Add a minimal control panel for pausing the animation, adjusting the cyclist’s speed, switching between camera modes, and toggling daylight intensity.
Technical requirements: Generate everything programmatically using Three.js. No external 3D models, textures, images, videos, or other assets. Organize the code into reusable components, optimize rendering performance, maintain smooth animation, and ensure the scene works responsively on desktop and mobile.
Priority: Photorealistic mirror reflections, natural human anatomy and cycling motion, convincing bicycle geometry, seamless sky-to-water continuity, and cinematic composition. The final result should resemble a real photograph of a lone cyclist crossing an infinite reflective salt desert not a basic 3D demo.
