Claude Fable 5.2

Tidebell 潮钟

Pilot a tiny submersible from sunlit reefs to the abyss and wake seven sleeping tide bells.

  • 3.0 MB
  • 83 plays
  • Apache-2.0
  • Source
  • Exploration
  • Three.js
  • WebGL
  • Underwater
  • Procedural
Download .htmlCreated by hahaliu1029

About Tidebell 潮钟

Dive from a sunlit coral reef through kelp forests and a broken freighter, over the edge of a wall and into the abyss, waking seven sleeping tide bells along the way. Wake them and the sea sings again.

How it works

Assets. All 48 models are generated by Python inside Blender: lofted fish, sharks, anglerfish, whales, mantas, turtles and jellyfish; corals grown as branching skeletons through the Skin modifier; kelp, sponges, anemones, rocks, a wreck, a moon gate, the bells and a whale skeleton. Each vertex carries painted colour, baked ray-cast ambient occlusion and an emission mask. There are no textures or downloaded assets.

World. The seabed is one analytic height function, used for the mesh, for collision and for placing about 18,000 instances of plants and rocks by zone.

Rendering. Every surface uses one hand-written underwater shading model. Sunlight is absorbed per colour channel with depth, red first, so the deep turns blue until your lamps bring colour back. There are animated caustics, headlamp cones and distance fog matched to the open-water backdrop, rendered to an HDR target with a ray-marched light-shaft pass, bloom and a filmic tonemap. Fish schools and jellyfish animate entirely in vertex shaders.

Audio. A water bed, a drone that sinks with depth, the bells, sonar and whale song are all synthesized with the Web Audio API.

Everything is bundled into one self-contained HTML file that makes no network requests.

Controls & tips

  • WASD swim, mouse look, Space / C rise and sink, Shift boost
  • Hold E to wake a bell, Q sonar ping marks the two nearest sleeping bells, F toggles lamps
  • Tab opens the logbook, H hides the HUD, M mutes
  • The hull is rated to 45 m at first; two bells raise that to 95 m and four remove the limit

The prompt

Made from the first of three sentences: "I want to make an underwater exploration game, and it should be as stunning as possible."

Credits

By hahaliu1029, released under the Apache License 2.0.

How to play Tidebell 潮钟 online

Tidebell 潮钟 is a single self-contained HTML file (3.0 MB) hosted on fable52.games. Press Play Game and it runs in an isolated sandbox. You can also download the .html file and open it offline in any modern browser, or read every line in the Inspect Source tab.

Under the hood it uses Three.js, WebGL, Procedural.

Controls

  • WASD to Swim
  • Mouse to Look
  • Space / C Up / Down
  • Shift Boost
  • Hold E to Wake Bell
  • Q Sonar

Tip: click inside the game once to capture the mouse, and press ESC to release it. Fullscreen gives the best frame rate on large monitors.

The prompt behind Tidebell 潮钟

The exact instruction hahaliu1029 gave Claude Fable 5.2. Copy it from the View Prompt tab above.

「我想做一款水下探索游戏,而且要尽可能惊艳。」
(I want to make an underwater exploration game, and it should be as stunning as possible.)

More Fable 5.2 HTML Games

Browse Fable 5.2 game collections