Jardin de Rosas

First-person walkable rose garden built with Three.js in a single self-contained HTML file. Walk a gravel path winding up a hill to a tree at the summit, under a low golden-hour sun. Three guided therapeutic exercises are built in: diaphragmatic breathing, progressive muscle relaxation, and anger de-escalation with sensory grounding.

Quick Start

Serves from any HTTP server — file:// blocks audio loading.

python3 -m http.server 8137

Then open http://localhost:8137/index.html.

No build step, no dependencies to install. Three.js loads via importmap from unpkg.

Controls

Action	Keyboard	Gamepad	Touch
Move	WASD or arrows	Left stick / D-pad	Left joystick
Look	Mouse	Right stick	Drag right half
Run	Shift	L3	Push joystick to edge
Guided breathing	B	X	Button "Respirar"
Progressive relaxation	R	Y	Button "Relajar"
Anger calm-down	C	LB	Button "Calmar la ira"
Toggle music	M	B	—

Keys 1–5 toggle atmosphere layers (fog, bloom, light shafts, dust motes, sky) for isolation during visual tuning.

Therapeutic Exercises

Three guided practices, each with a pacing disc that floats in front of the camera.

• Diaphragmatic breathing in 4-4-6 rhythm: inhale 4s, hold 4s, exhale 6s.
• Progressive muscle relaxation, the seven-group abbreviation by Bernstein and Borkovec of the Jacobson protocol, with 5s tension and 10s release per group. Fixed clinical order: dominant arm, non-dominant arm, face, neck, trunk, dominant leg, non-dominant leg.
• Anger calm-down: three cycles of paced breathing with prolonged exhale (4s in, 8s out — the exhale lasting twice as long is what lowers arousal, not breathing deeper), followed by 5-4-3-2-1 sensory grounding.

These are common emotional-regulation practices. They do not replace professional treatment.

How It Is Built

A single index.html — no build, no installed dependencies. All textures are painted on canvas at load time: grass, gravel, bark, foliage, and petals. Zero image assets.

• Terrain: Gaussian hill; the path, roses, petals, and camera all sample the same heightAt function.
• Roses: 7500 instanced plants (2200 on phones), each bloom built from three whorls of curled petals around a bud. Wind sway runs in the vertex shader, with amplitude derived from height above terrain so stem, leaf, and bloom of one plant bend together and stay welded.
• Tree: four-level recursive branching merged into one geometry, with a canopy of noise-deformed blobs. A name is carved into the bark.
• Atmosphere: UnrealBloomPass, warm color grade with vignette, additive light shafts, and floating dust motes.
• Sky: procedural shader with layered noise clouds, sun halo, and horizon burn — no skybox texture.

File Structure

rose-garden/
  index.html          — the entire application
  audio/
    rose-garden.mp3   — ambient loop
  docs/
    architecture.md   — system design and data flow
    flowcharts.md     — Mermaid diagrams
    user_guide_es.tex — Spanish user guide (LaTeX)
    exercises.md      — clinical references for the exercises
  CONTRIBUTING.md
  README.md

Credits

Rose model, tree, terrain, and shaders: original work. Three.js under MIT license. Ambient audio: original.

License

MIT — see LICENSE.