DeepSeek V4.1 Flash · Three.js
- 15 finished runs
- 15 prompts
- 1 model
- every prompt published
Cinematic fjord boat scene (Three.js)
Build a playable, cinematic single-page Three.js experience: a small boat drifting through a Norwegian-style fjord / coastal mountain landscape. Requirements: - ONE self-contained index.html file (HTML + CSS + JS inline). No external assets of any kind (no textures, models, fonts, audio files) EXCEPT Three.js itself, loaded via an import map from this exact pinned CDN: "three": "https://cdn.jsdelivr.net/npm/three@0.160.0/build/three.module.js", "three/addons/": "https://cdn.jsdelivr.net/npm/three@0.160.0/examples/jsm/" All textures (water normals, rock, snow, bark, clouds, etc.) must be generated procedurally in code (canvas / DataTexture / shaders). - Scene content: steep procedural fjord walls and mountains with snow caps, rock and grass coloring by height/slope; procedural conifer forests (instanced); a water surface with animated waves and sky/landscape reflections; a lighthouse on a rocky point with a rotating beam that matters at night; a small wooden boat with 2 simple stylized 3D characters on it (one rowing/steering, one looking around, with small idle animations); distant islands; birds or other small life if cheap. - Dynamic weather cycling clear -> fog -> rain -> storm -> clearing, with smooth transitions: fog density, cloud cover, rain particles, lightning flashes + wind and bigger waves in the storm. - A full day/night cycle: sunrise, day, golden hour, sunset, night with stars and moon, lit lighthouse and boat lantern. Sky color, sun/moon lights, and fog color must track time of day. - Controls: keyboard (WASD/arrows to steer and throttle the boat, C to switch camera, T toggles auto-tour, 1-5 to force weather, N to jump time) and touch (on-screen joystick/buttons on phones). Camera follows the boat in play mode. - An "auto-tour" cinematic camera mode: slow, smooth, film-like camera moves (orbits, low water-level glides, high establishing shots, close-ups of the characters) while the boat drifts along a path through the fjord and the weather and time of day progress. - Minimal, elegant UI: small title "Fjordlys" (or a better name of your choice), a tiny hint line for controls, fading out in tour mode. - Must run smoothly on desktop and phone browsers: keep geometry/particle counts moderate, cap devicePixelRatio at 2, handle resize/orientation. - IMPORTANT for automated video capture, support these URL parameters: ?tour=1 start directly in auto-tour mode ?capture=1 hide ALL UI overlays (title, hints, touch controls) ?cycle=40 when present, compress one complete showcase into that many seconds: the time of day goes from morning through golden hour, sunset and night, and the weather passes clear -> fog -> rain -> storm -> clearing within that span (so a 40-second recording shows everything). Without it, use a relaxed pace suited to live play. Drive all animation from the requestAnimationFrame timestamp / performance.now() (not from wall-clock-independent accumulators that ignore time), so that overriding those functions steps the scene deterministically. Set window.__sceneReady = true once the first frame has rendered. - No console errors or warnings in a current Chrome. Use modern Three.js r160 APIs only (no deprecated/removed ones). Output ONLY the complete index.html, starting with <!DOCTYPE html> and ending with </html>, with no explanation and no markdown fences. Build it as index.html (plus any local asset files you create) in the current directory. Three.js may load from a pinned CDN. You may serve it locally and open it in headless chromium (/usr/bin/chromium, software WebGL, no GPU) to screenshot and inspect your own output, and iterate on your own until it looks genuinely cinematic before finishing. Close any browser you open as soon as you've taken your screenshot.
Creature robot blueprint
Design a giant desert sandworm re-engineered as a robot, presented as an engineering blueprint. Deliver ONE self-contained index.html (SVG and/or canvas, inline CSS and JS, no external assets, libraries or fonts). It must include: an animated robotic worm that moves through sand, with segments that articulate as it burrows and surfaces; a labelled segment-by-segment mechanical breakdown (for example head and mouth assembly, drive segments, sensor ring, power core, tail) with callouts naming each part and what it does; a cross-section diagram of the mouth showing the grinding and intake mechanism; and a terrain and operations map showing the worm's route, depth and working zones. Everything must share one cohesive blueprint style: blueprint-blue background, white and cyan line work, grid, dimension lines, title block and technical lettering. It must look good on desktop and phone. Write everything into the working directory and finish with a short README.md.
Folding road threejs
ok here it is - my first Opus 5.5 vibecoded threejs 3D experience my God!! Opus is creative!! I made a road that forgets which way is down. It folds 90° up a yellow wall, runs upside down across a ceiling, and turns into sheet music: steer through the notes to play each street's melody. Watercolour. Ink. A radio on the roof. #vibejam Build it as index.html (plus any local asset files you create) in the current directory. Three.js may load from a pinned CDN. You may serve it locally and open it in headless chromium (/usr/bin/chromium, software WebGL, no GPU) to screenshot and inspect your own output, and iterate on your own before finishing. Close any browser you open as soon as you've taken your screenshot.
Game battleship
Build a complete, polished Battleship game playable in the browser (index.html plus any JS/CSS, no build step). Player vs computer on 10x10 grids: ship placement (drag or click, with rotate), a computer opponent with a sensible hunt/target strategy, hit/miss/sunk feedback with animation and sound, turn indicator, win/lose screen and restart. It must work with mouse and touch and look good on desktop and phone. Write everything into the working directory and finish with a short README.md.
Gpu fluid sim
Build a GPU-accelerated fluid simulation in a single HTML file using WebGL, no external libraries. Dragging the mouse or a finger should push colorful dye through the fluid, with a soft glow. Make it look stunning and run smoothly. Build it as a self-contained index.html in the current directory, with WebGL/WebGL2 shaders you write yourself; no libraries and no CDNs; interactive with mouse or touch input. You may serve it locally and open it in headless chromium (/usr/bin/chromium, software WebGL, no GPU) to screenshot and inspect your own output, and iterate on your own before finishing. Close any browser you open as soon as you've taken your screenshot.
Humanoid motion cycle
Build a single-page Three.js scene (one index.html file, no build step, three.js from a pinned CDN) with a rigged humanoid character (a procedural skeleton and simple body meshes are fine) that plays walk, run and jump cycles, with on-screen buttons or keys to switch between them and blend smoothly from one to the next. The motion must look human, not spider-like: respect realistic joint limits (knees and elbows bend one way only, no joint rotates past a human range), feet plant on the ground with no sliding while in contact, the pelvis bobs and the torso stays upright with natural counter-rotation of shoulders and hips, and arms swing opposite to the legs. Include a ground grid, an orbit camera and a toggle that shows the skeleton. It must run at 60 fps in a desktop browser and work with touch. Write everything into the working directory and finish with a short README.md describing the controls.
Threejs ant vs gardener
Build a small playable 3D game in Three.js: an ant defends its home from a furious giant gardener. The player controls the ant on the ground of a lush garden, seen from a low third-person camera that makes the grass blades, pebbles and flowers feel huge. The gardener towers over the scene and sweeps a humming string trimmer back and forth, chasing the ant and throwing up clippings. The ant fights back with a tiny slingshot: aim with the mouse, fire pebbles at the gardener and dodge the trimmer's swings. Show a health bar for the ant and a large health bar for the gardener at the top of the screen, with hit flashes, a clear win or lose message and a restart. Warm afternoon sunlight falls through the leaves overhead, casting moving dappled light and soft shadows, with dust drifting in the light beams. Keep the controls simple (WASD or arrow keys to move, click to shoot) and show them on screen. Everything is built in code from Three.js geometry and materials; no external models or textures. Build it as index.html (plus any local asset files you create) in the current directory. Three.js may load from a pinned CDN. You may serve it locally and open it in headless chromium (/usr/bin/chromium, software WebGL, no GPU) to screenshot and inspect your own output, and iterate on your own before finishing. Close any browser you open as soon as you've taken your screenshot.
Threejs eiffel
Build the Eiffel Tower in Three.js. Build it as index.html (plus any local asset files you create) in the current directory. Three.js may load from a pinned CDN. You may serve it locally and open it in headless chromium (/usr/bin/chromium, software WebGL, no GPU) to screenshot and inspect your own output, and iterate on your own before finishing. Close any browser you open as soon as you've taken your screenshot.
Threejs jellyfish
Build a Three.js scene of a huge glowing jellyfish walking through a rainy city at night on very tall, thin, jointed legs, presented as a live disaster news broadcast. The jellyfish's translucent bell pulses with soft bioluminescent light, its tentacles sway beneath it, and each slow stride steps between the towers while rain streaks through the light and wet streets reflect neon signs and headlights. Frame it like a TV emergency broadcast: a main camera feed plus several smaller feeds from other angles (street level, a helicopter, a rooftop) that update as the creature moves; a HUD with a channel logo, a red LIVE badge, a scrolling news ticker, a clock and coordinates; and an event log panel that adds timestamped entries as the jellyfish crosses the city. Keep the mood tense and cinematic, with fog, flickering streetlights and flashing red and blue emergency lights. Everything is built in code from Three.js geometry, shaders and materials; no external models or textures. Build it as index.html (plus any local asset files you create) in the current directory. Three.js may load from a pinned CDN. You may serve it locally and open it in headless chromium (/usr/bin/chromium, software WebGL, no GPU) to screenshot and inspect your own output, and iterate on your own before finishing. Close any browser you open as soon as you've taken your screenshot.
Threejs momijigari
Build an interactive Three.js scene of a single red Japanese maple (momiji) standing on a small rocky island in a still, misty lake. Its leaves are deep autumn red and orange; some drift down onto the water, where they float and leave gentle ripples. Low mist hangs over the lake and soft mountain silhouettes fade into the haze behind. A stone lantern stands beside the tree with a warm flame inside. Let the viewer interact: dragging across the water stirs the floating leaves and sends ripples through them, clicking the lantern makes it swing so its light sways across the water, and a dial turns the time of day from dawn through day and dusk to moonlight, changing the sky, the colour of the mist, the lighting and the reflections, with the moon and its reflection at night. Keep the mood calm and painterly, with a light wind moving the branches. Everything is built in code from Three.js geometry, shaders and materials; no external models or textures. Build it as index.html (plus any local asset files you create) in the current directory. Three.js may load from a pinned CDN. You may serve it locally and open it in headless chromium (/usr/bin/chromium, software WebGL, no GPU) to screenshot and inspect your own output, and iterate on your own before finishing. Close any browser you open as soon as you've taken your screenshot.
Night Train
Build a Three.js scene: A night train crossing a landscape. A passenger train of a locomotive and at least four carriages with warm, glowing lit windows travels along a track that winds through rolling hills, over a bridge across a river and past a small village with a few lit houses. A full moon lights the scene with cool blue light and casts soft shadows; stars fill the sky, the river reflects the moon, and the locomotive's headlight throws a beam ahead of the train. The train moves continuously and loops forever along the track, its wheels turning and a faint trail of steam or exhaust drifting behind it. The camera slowly follows the train by default; OrbitControls let the viewer take over, and a button switches between the follow camera and a free camera. Everything is built in code from Three.js geometry, materials and shaders; no external models, textures or fonts. The scene must visibly animate from the moment it loads and run in a browser with software WebGL (no GPU). Deliver ONE self-contained HTML file; load Three.js only through an import map from https://cdn.jsdelivr.net/npm/three@0.170.0/build/three.module.js (addons from https://cdn.jsdelivr.net/npm/three@0.170.0/examples/jsm/), with no other external requests (no image, texture, model, font or audio files): build every shape and texture in code. It must work when opened directly from disk in a current desktop or mobile browser, fit the window responsively, and run without console errors. Output ONLY the complete HTML file, starting with <!DOCTYPE html> and ending with </html>, with no explanation or markdown fences.
Paris Tower
Build a Three.js scene: The Eiffel Tower and its surroundings in Paris, as an interactive 3D scene. The tower is recognisable, with its four curved lattice legs, the arches between them, the platforms at its levels and the tapering lattice up to the antenna, in its bronze-brown colour. Around it: the Champ de Mars lawns with rows of trees, the river Seine with a bridge and gently moving water, a few blocks of cream-coloured Haussmann-style buildings with grey mansard roofs, streets with a few lamp posts, and a sky with soft clouds. Lighting is a warm late-afternoon sun with long shadows; a toggle switches to night, when the tower lights up with warm golden lights and occasionally sparkles. OrbitControls to look around, limited so the camera stays above the ground. Everything is built in code from Three.js geometry, materials and shaders; no external models, textures or fonts. The scene must visibly animate from the moment it loads and run in a browser with software WebGL (no GPU). Deliver ONE self-contained HTML file; load Three.js only through an import map from https://cdn.jsdelivr.net/npm/three@0.170.0/build/three.module.js (addons from https://cdn.jsdelivr.net/npm/three@0.170.0/examples/jsm/), with no other external requests (no image, texture, model, font or audio files): build every shape and texture in code. It must work when opened directly from disk in a current desktop or mobile browser, fit the window responsively, and run without console errors. Output ONLY the complete HTML file, starting with <!DOCTYPE html> and ending with </html>, with no explanation or markdown fences.
Threejs procedural armor suit
Build a single self-contained index.html using Three.js (imported from a pinned CDN; no external models, textures or other assets) that shows a full humanoid powered-armour suit built only from code: primitives, extruded shapes, lathes and generated geometry. Aim for 500 or more distinct mesh parts (plates, joints, pistons, vents, bolts, cables, lights) with a coherent, detailed design and good materials and lighting. Include an assemble / explode animation (parts fly in and lock into place, and can be exploded back out), a sci-fi HUD overlay (targeting reticle, part labels that track parts on screen, a system status panel), orbit controls, and buttons to trigger assemble and explode. It must run smoothly and work with touch on mobile. When the suit is built, log the total number of distinct mesh parts to the console as: PART_COUNT <n>. Write everything into the working directory and finish with a short README.md.
Threejs slime softbody
Build a single-page Three.js scene (index.html, no build step, three.js from a pinned CDN or vendored) showing a glossy translucent slime/jelly blob resting on a floor. It must behave as a soft body: clicking or dragging pokes and squishes it, it wobbles and settles with visible jiggle and damping, and it casts a soft contact shadow on the floor. Include subsurface-like translucency, specular highlights, and a small UI to reset and to drop the blob from height. Target 60 fps on a mid-range phone; mobile touch must work. Write everything into the working directory and finish with a short README.md describing controls.
Threejs stillwater pond
Build "Millbrook Pond", a calm countryside pond diorama in Three.js, seen from above at a three-quarter angle. An irregular pond with soft grassy banks, rocks and reeds sits in a clearing ringed by trees and bushes, with a dirt path running around it. On one shore stands a small timber watermill cabin with a shingled roof and a stone chimney, and on its side a large wooden waterwheel turns continuously, its paddles dipping into the water and churning it. A plank dock juts out from the mill, a small arched wooden footbridge crosses an inlet, and a rowboat floats on the pond with a seated figure fishing, rod and line out; the boat bobs and drifts gently and the line's float makes small rings. The water is the star: a real-time reflective and refractive surface (a planar or render-target reflection of the mill, trees and sky; refraction of the shallow pond bed near the banks; depth-based tint from clear shallows to a dark centre) blended with a Fresnel term, soft normal-mapped wind ripples, and dynamic ripple rings from the waterwheel, the boat, the fishing float and the occasional rising fish, which spread and fade. Add gentle ambient life: swaying foliage, a few lily pads or drifting leaves, dragonflies or birds, and soft afternoon sun with shadows. The camera slowly orbits the pond on its own; the user can drag to orbit, pinch or scroll to zoom, and tap the water to make ripples, and a small unobtrusive control pauses the orbit and switches the time of day (for example afternoon and golden hour). The look is stylized and cohesive (low-poly or soft-shaded), and everything is built in code; no external models, textures or HDRIs. Also add a capture mode: opening index.html?capture=1 hides all UI and plays a scripted 12-second camera move around the pond that ends where it started, so it can be recorded as a seamless clip. Build it as index.html (plus any local asset files you create) in the current directory, with no build step; three.js and any addons may load from a pinned CDN. Aim for 60 fps on a laptop and at least 30 fps on a mid-range phone, with touch working. You may serve it locally and open it in headless chromium (/usr/bin/chromium, software WebGL, no GPU) to screenshot and inspect your own output, and iterate on your own before finishing. Close any browser you open as soon as you've taken your screenshot. Finish with a short README.md describing the controls and the capture mode.