3DPrompt.
GitHub
Back to the library
GPT-6 AstraReference brief

Interactive 3D Koi Pond

Create a full-screen interactive Three.js and WebGL koi pond with draggable fish releases, ripples, rain, a fish-affecting whirlpool, responsive controls, and Web Audio water effects.

Created by Vib3CodedView original source
Interactive 3D Koi Pond

About this example

A starting brief based on the creator's public project, not a verbatim original prompt. Your result will vary.

Creator notes

Build a polished, full-screen interactive 3D koi pond with a top-down turquoise-water view, animated caustics, four draggable koi varieties, fish swimming behavior, splash and ripple interactions, rain, a movable whirlpool, responsive mobile controls, and synchronized water audio.

Three.jsWebGLinteractive koi pond3D fishwater simulationrippleswhirlpoolWeb Audio

The prompt

Build a beautiful, full-screen interactive koi pond using Three.js + WebGL. Use a top-down view with clear turquoise water, sunlight, animated caustics on the pond floor, and a convincing sense of depth. Place an elegant translucent selection panel at the bottom with four koi varieties: Kohaku, Showa, Golden Ogon, and Platinum. Clicking a card releases that fish into the pond. Dragging a fish from its card lets the user choose exactly where to drop it. Make each landing feel satisfying: a splash with droplets, a brief depression in the water surface, and expanding ripples. The fish should then dive beneath the surface. Use refraction and depth cues so the koi clearly look submerged. Create detailed 3D koi with eyes, scales, fins, and flowing tails. Animate their bodies, tails, and fins together. Each fish should independently change direction and speed, turn smoothly near boundaries, and avoid other fish. Let users touch and drag across the water to create ripples. Add rain and a movable whirlpool whose current affects the fish. Include Calm, Clear pond, and a control to hide the interface for screen recording. Use Web Audio to create landing splashes, soft musical droplets, gentle swimming water sounds, rain, and a whirlpool sound. Enable audio through a Sound button, fade it smoothly when muted, and pause it when the browser tab is hidden. Keep all labels and buttons in English. Make the layout responsive for mobile. Optimize rendering and animation for smooth performance with several dozen fish. Deliver a complete, working website with polished visuals and functional interactions.

How to use this prompt

01

Start with the right workspace

Open your preferred coding assistant or 3D tool. Use the model shown on the example as a starting point, and check any linked project for setup instructions.

02

Choose one thing to change

Swap the subject, art style or setting. Keep the camera and interaction clear. Build a small version first, then refine one detail at a time.

03

Give the scene its own assets

For a custom character or prop, create a 3D model from a short object description or reference image, then bring it into your project.

Previews belong to their respective creators. Check the original source and project license before reusing code or assets.