# Miniature Cherry Island

- Author: @Adidotdev
- Card: Creator prompt
- Theme: Objects & products
- Stack: Not rebuilt
- Interaction: Drag
- Licence: Credited link (Shared publicly by the author; full text with credit, removed on request)
- Verified: not yet
- Original post: https://x.com/Adidotdev/status/2118710396509208760

## Original prompt

```text
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.
```

Not rebuilt by 3dmotion yet. Credit stays with @Adidotdev.

Prompt by @Adidotdev (https://x.com/Adidotdev/status/2118710396509208760) via 3dmotion.io/e/miniature-cherry-island