Einstellungen

i Info & Credits

Sunset Ocean by Dr. Rami Zarife

A living tropical island in real time: a full day passes in a few minutes, from the golden sunrise over a stormy afternoon to a starry night. A small sailboat with its cat cruises between the islands while the camera dives through coral reefs down to a sunken treasure. The project keeps evolving with new features, visual refinements and performance work.

What you can see

• Day & night: Real sun path, a long golden hour at sunrise and sunset, moon, constellations that draw their lines, shooting stars and comets.
• Weather: Tropical storm with dark clouds, rain on the sea, lightning and a rainbow afterwards; a volcano on the horizon.
• Ocean & underwater: Gerstner waves with reflections, fish schools that follow the dives, coral reefs and seagrass, a wreck, cannon and amphorae, crabs, and a treasure chest you can open.
• Life on board: The boat follows an island-aware route, and the cat changes poses on its own (tap it).

Controls

• Space: pause / resume the day-night cycle · + / -: change the speed · Mouse / touch: look around.
• Settings (gear): brightness, music volume and repeat. The music plays once per visit unless repeat is on.

Technology

• Rendering: Three.js with custom shaders, GPU simulations for birds, fish and rain, an HDR pipeline with bloom and adaptive quality per device.
• Assets: Draco-compressed models, KTX2/WebP textures, background shader warmup and on-demand loading for the underwater scene.
• AI assistance: Developed with AI assistance (Claude by Anthropic and GPT-5.5) for features, performance tuning, asset preparation and code organization.

3D models (most modified & optimized)

• Boat: "Small Sailboat" by Mauro Casalino via BlenderKit, with a cloth shader for the sail and custom animations.
• Fish, crabs & corals: Purchased on CGTrader (licensed), optimized for the underwater scene.
• Treasure site: Treasure chest, cannon, barrels, coast rocks and shells by Poly Haven (CC0); "Old Broken Boat" by PolyCrate, amphora by Eleanie and ship's anchor by David Simon via BlenderKit.
• Islands, rocks, wood, palms: Based on "Tropical Island" by Elin, CC BY 4.0.
• Lighthouse: Based on "LightHouse" by DoobiDooba, CC BY 4.0, with an added light shader and beam.
• Flamingos & birds: Strongly modified from the Three.js GPGPU Birds example.

Libraries, examples & textures

• Three.js · Shader Particle Engine (modified) for clouds, stars and sparks.
• Sky & water based on the Three.js Ocean example and Sean Bradley's Gerstner waves; lightning based on the Three.js Lightning Strike example.
• Comets inspired by Shane Brumback's example, fully rewritten. Boat navigation, fish schools, rainbow, constellations and the day-night cycle are custom-built.
• Moon: NASA Blue Marble · Night sky: ESO/S. Brunier Milky Way panorama (modified).

Thanks

To all open source contributors, especially the Three.js community for its excellent examples and documentation.