Reduce motion is on · previews stay still
All effects Objects & products Miniature Cherry Island Miniature Cherry Island Miniature Cherry Island is a published Three.js prompt by @Adidotdev. It has source credit and no verified 3dmotion rebuild.
by @Adidotdev on X · 2026-11-06
Result by @Adidotdev Original prompt @Adidotdev · X Rebuild status No verified 3dmotion rebuild. Open demo No live demo linked here. Prompt by @Adidotdev. Copies include source credit.
Original prompt Free · 3,528 characters Create a complete, production-grade interactive 3D miniature diorama called "Sakura Island" inside a single standalone `.html` file using Three.js r180 via `<script type="importmap">`. STRICT ASSET RULE: - Zero external `.glb`/`.gltf`…
Create a complete, production-grade interactive 3D miniature diorama called "Sakura Island" inside a single standalone `.html` file using Three.js r180 via `<script type="importmap">`.
STRICT ASSET RULE:
- Zero external `.glb`/`.gltf` models, zero external `.png`/`.jpg`/`.hdr` images, and zero base64 asset blobs.
- Every mesh, material, texture, sky element, and shadow decal must be generated procedurally in JavaScript / HTML5 `<canvas>` (`CanvasTexture`) / custom GLSL shaders.
VISUAL & RENDERING PIPELINE (MINIATURE DIORAMA LOOK):
1. Camera & Controls: `PerspectiveCamera` with a 30° telephoto FOV for a true tabletop miniature feel, smooth damped `OrbitControls` (gentle auto-rotate, polar angle clamped above ground), and smooth camera tweening between 4 bottom view pills: `Overview`, `Cat`, `Blossoms`, and `Ground`.
2. Studio IBL & Tone Mapping: `PCFSoftShadowMap`, `THREE.NeutralToneMapping` (to keep pastel pinks and greens rich without washing out), and a procedural `PMREMGenerator` environment scene built from warm key, cool fill, overhead, and sky-bounce light planes.
3. Post-Processing (`EffectComposer`): `RenderPass` -> toggleable `GTAOPass` + `UnrealBloomPass` ("Cinematic FX") -> custom `TiltShift` miniature depth-of-focus shader pass -> custom color-grade + subtle film grain pass -> `OutputPass` (auto-fallback if FPS drops).
PROCEDURAL SCENE GEOMETRY & SHADERS:
1. Island & Rocks: Noise-sculpted floating island mound with soil rim, procedural beveled boulders and curved stepping-stone path (`BufferGeometry` + contact AO decals), and thousands of `InstancedMesh` grass blades swaying in the wind via `onBeforeCompile` vertex shaders.
2. Sakura Tree & Petals: Multi-limb crooked cherry trunk and branches extruded along `CatmullRomCurve3` Frenet frames with smooth vertex normals and a procedural GLSL bark-grain shader; lush multi-tone pink `InstancedMesh` blossom canopy clusters with subsurface-like warmth; fallen petals resting on the grass/rocks; hundreds of drifting wind-swept petals with turbulence; clicking the canopy triggers a burst of petals.
3. Sleeping Cat on Boulder: Procedural ginger/cream cat sculpted from Three.js primitives, `TubeGeometry` curves, and custom `BufferGeometry` (curled body with breathing motion, paws, swaying tail tip, ears, triangular nose, whisker follicles + bowed whiskers, closed sleeping eyelid arcs, and hidden green vertical-slit-pupil eyes underneath). Stroking/tapping the cat wakes it up, opens its eyes, triggers purring HUD feedback and floating heart particles.
4. Sky & Atmosphere: Procedural gradient sky dome, soft drifting clouds, dust motes by day, and twinkling stars + glowing golden fireflies in `Night` mode.
UI & INTERACTIVITY (GLASSMORPHIC FLOATING HUD):
- Top-right icon toolbar: Pause/Play motion, Reset view, Save PNG screenshot (`sakura-island.png`), Load custom `.glb` model onto the island (`GLTFLoader` + drag-and-drop support + clear button), and Settings toggle.
- Collapsible Settings panel:
- 5 Lighting/Weather presets (`Studio`, `Golden`, `Soft`, `Sunset`, `Night`) smoothly transitioning sky colors, fog, directional sun/moon light, hemisphere fill, exposure, and fireflies.
- `Breeze` range slider (`0` to `2`) driving branch sway, grass waves, and petal drift speed.
- `Orbit` speed slider, toggles for `Falling petals`, `Show tree`, `Show cat`, `Cinematic FX`, and `Miniature focus`.
- Include an animated sakura-petal loading veil that fades out smoothly once WebGL and procedural geometry finish building. Prompt by @Adidotdev , posted on X on 2026-11-06. x.com/Adidotdev/status/2118710396509208760 . Copies include this credit. A Verified card includes a receipt and a pinned single-file rebuild you can run here. Recorded limitations explain what the rebuild changes or leaves out.
Miniature Cherry Island@Adidotdev · Objects & products