by billpwchan
A boat journey through a Japanese river valley, in four seasons and at any hour, rendered live in the browser with three.js.
# Add to your Claude Code skills
git clone https://github.com/billpwchan/sakura-fantasyGuides for using ai agents skills like sakura-fantasy.
See how sakura-fantasy compares with popular alternatives.
sakura-fantasy is an open-source ai agents skill for AI coding assistants such as Claude Code, Codex CLI, and ChatGPT, built by billpwchan. A boat journey through a Japanese river valley, in four seasons and at any hour, rendered live in the browser with three.js. It has 65 GitHub stars.
sakura-fantasy's catalog security scan is still queued. You can run an instant dependency and prompt-injection check now with the "Scan for vulnerabilities" button above.
Clone the repository with "git clone https://github.com/billpwchan/sakura-fantasy" and add it to your Claude Code skills directory (see the Installation section above).
sakura-fantasy is primarily written in JavaScript. It is open-source under billpwchan on GitHub, so you can review or fork the full source.
Yes. SkillsLLM lists many other AI Agents skills you can browse and compare side by side. Open the AI Agents category from the badge at the top of this page, or use the Related Skills and comparison links further down to weigh sakura-fantasy against similar tools.
No comments yet. Be the first to share your thoughts!
Based on votes and bookmarks from developers who liked this skill
Available after the catalog security scan passes.
⚠️ Third-Party Software Notice
This skill is third-party open-source software developed and hosted independently on GitHub. SkillsLLM is an informational directory and does not control or maintain the underlying repository.
Any security checks, ratings, or warnings displayed by SkillsLLM are automated and limited in scope. They do not constitute a security certification or guarantee that the software is safe, error-free, or free from malicious code, vulnerabilities, compromised dependencies, or prompt-injection risks.
Review the source code, permissions, dependencies, and configuration before installing or running any third-party skill. Use is at your own risk. To the maximum extent permitted by applicable law, SkillsLLM is not liable for losses arising from third-party software.
The deep catalog scan for this skill is still queued. Run an instant dependency check now instead.
You sit in a tomabune, a reed-roofed river boat, while a boatman sculls you down a river. You pass through:
Then the season turns and the journey begins again.
Every tree, flower and blade of grass is drawn from photogrammetry scans of real Japanese plants. The light follows the sun through the day, and the weather changes. The music is composed as you travel, for koto, shakuhachi and shō, among field recordings from temples and gardens in Kyoto and beyond.
It is about 10,000 lines of plain JavaScript on three.js, with no engine and no framework.
Each place opens with a classical haiku chosen for it and for the season.
Thirteen of these scenes are free to download as 4K wallpapers (3840×2160, straight from the renderer).
Real plants. Leaves, blossom and grasses are rendered in Blender into photo atlases (colour, AO and normal), from CC0 scans of Japanese species:
Trees are grown in code and instanced. They have three detail tiers by distance from the river, and up close they swap to full detail.
Light, air and weather.
Water. Reflections stretch and break in the ripples, and blur with distance as real water does, so the river never reads as a mirror. Gusts roughen it in drifting patches. Lanterns, fireflies and fireworks all reflect, and each burst lays a broken column of its colour on the water. The boat leaves a Kelvin wake and a bow wave, foam gathers along the shore and petals rest on the surface.
The boat and its crew.
Night. Lit windows, foxfire wisps and lanterns floating on the lake. Sky lanterns rise from the island.
Sound.
| Layer | What you hear |
|---|---|
| Score | A live score in the Japanese modes (hirajōshi, yō, kumoijōshi). The koto plays phrases, a danmono before the bridge and Sakura Sakura under the cherries in spring. The shakuhachi plays long breaths, and the shō holds chords at the shrine. |
| Recordings | Temple bells from Ōhara and Zōjō-ji, a suikinkutsu and shishi-odoshi from Kyoto gardens, cicadas, bell crickets, the uguisu. |
Every recording is placed by place, season and hour. The score →
Smooth. The valley is generated in a pool of workers. A frame-time governor keeps the render scale where frames hold their budget. The quick tier draws the first frame, and full-detail assets stream in behind it.
| W S / ↑ ↓ | faster, slower |
| A D / ← → | steer within the channel |
| drag · wheel | look around · zoom |
| C | camera: follow → seat → cinematic |
| Space | stop and drift / row on |
| M | sound on and off |
| P | photo mode (orbit camera, PNG export) |
| H | hide the interface |
The kanji dock sets the season, hour, weather, camera and sound, and the scroll of the journey jumps to any place.
git clone https://github.com/billpwchan/sakura-fantasy.git
cd sakura-fantasy
npm install
npm run dev # http://127.0.0.1:5190
npm run build writes a static site to dist/ that any web server can host. The assets are in the repository, so
nothing else needs downloading.
Any scene can be opened straight from the URL, skipping the opening:
| Parameter | Meaning | Example |
|---|---|---|
z |
position along the river, from 40 (start) to about -2300 (the lake) |
z=-1640 |
s |
season: 0 spring, 1 summer, 2 autumn, 3 winter |
s=2 |
h |
hour, 0–24 |
h=17.5 |
w |
weather: clear mist rain storm snow |
w=mist |
mode |
camera: follow seat cinema |
mode=seat |
cam, look |
a fixed camera position and target, x,y,z |
cam=4,3,-690&look=0,6,-720 |
tier |
hi streams the full-detail assets, lo keeps the quick tier |
tier=lo |
intro |
play the opening anyway | intro |
For example, autumn dusk at the bridge or a winter night in the village.
| Document | What it covers |
|---|---|
| docs/ARCHITECTURE.md | The renderer and passes, the frame, the governor, world generation, vegetation and level of detail, the boat and people, night, the journey and camera, loading tiers. |
| docs/SOUND.md | The score: modes, koto gestures, ma and jo-ha-kyū, how each instrument was made from free recordings, and how the mix was measured. |
| pipeline/ | The offline tools that made the assets: Blender scripts for the plant atlases, people, boat and props, and the audio build. |
On an Apple M4 Max at 1920×1080 @2×, the full tier runs at 60 fps with a p95 frame time of 18.4 ms. The governor holds the render scale at 1.0 for most of the river and 0.85–0.95 in the cherry avenue, the heaviest stretch. Phones and tablets get the quick tier.
src/
├── main.js boot, frame loop, input
├── core/ render passes, post chain, shared uniforms, loaders
├── env/ time of day, season and weather
├── world/ layout, terrain, water, trees, grass, buildings, props, boat, people, sky
├── fx/ petals, leaves, snow, rain, fireflies, wisps, lanterns, fireworks
├── journey/ the voyage, the camera director, the haiku
├── audio/ score, soundscape, sound bank
└── ui/ loader, title, chapter cards, dock, About, photo mode
public/assets/ textures and atlases, models, KTX2 transcoder, audio
pipeline/ offline asset tools (Blender, Node, Python)
scripts/ texture fetch, perf and capture harnesses
deploy/ Docker + Caddy deployment
Th