---
title: "桜幻想 Sakura Fantasy"
url: "https://aigamehub.app/ja/games/sakura-fantasy-bd2034"
source: "https://github.com/billpwchan/sakura-fantasy"
source_type: "github"
play_url: "https://sakura.billpwchan.art/"
platform: "both"
login_required: false
pricing: "free"
origin: "original"
ai_tools: ["Claude", "Claude Code"]
game_languages: ["ja"]
author: "billpwchan"
author_handle: "billpwchan"
category: "アドベンチャー"
categories: ["adventure", "casual", "simulation"]
tags: ["generative-music", "japan", "procedural-generation", "relaxing", "three.js", "webgl"]
added: "2026-10-16T17:08:51.520Z"
updated: "2026-10-16T17:08:51.520Z"
locale: "ja"
content_locale: "ja"
---

# 桜幻想 Sakura Fantasy

四季、リアルタイムの昼夜ライティング、生成音楽を備えた、ブラウザでレンダリングされる日本の渓谷の舟旅。

## Description

葦葺きの泊船（とまぶね）に乗り、船頭が漕ぐ舟で川を下る。朝霧の浅瀬、桜並木、朱塗りの太鼓橋、五重塔の下の村、竹の峡谷、千本鳥居のトンネル、水の中に鳥居が立つ湖を通り過ぎていく。季節は巡り、旅は繰り返される。植物は実際の日本の植物のフォトグラメトリースキャンから作られ、光は太陽を追い、天気は変わり、箏、尺八、笙のための楽曲は旅をしながら作曲される。three.js 上の素の JavaScript で作られ、エンジンやフレームワークは不使用。ブラウザでライブに動作する。

## Original post

A boat journey through a Japanese river valley, in four seasons and at any hour, rendered live in the browser with three.js.

Topics: 3d, ai-generated, browser-game, claude, claude-code, creative-coding, generative-music, japan, javascript, photogrammetry, procedural-generation, real-time-rendering, sakura, threejs, vibe-coding, web-audio, webgl, webgl2

<div align="center"> <a href="https://sakura.billpwchan.art/"><img src="docs/media/hero.webp" width="100%" alt="A reed-roofed boat drifts under cherry trees at dawn, its lantern lit, the low sun on the water"></a> <h1>桜幻想 &nbsp;<sub><i>Sakura Fantasy</i></sub></h1> <p><b>A boat journey through a Japanese river valley, in four seasons and at any hour,<br>rendered live in the browser.</b></p> <p> <a href="https://sakura.billpwchan.art/"><b>Take&nbsp;the&nbsp;journey</b></a> &nbsp;·&nbsp; <a href="docs/ARCHITECTURE.md">How&nbsp;it&nbsp;works</a> &nbsp;·&nbsp; <a href="docs/SOUND.md">The&nbsp;score</a> &nbsp;·&nbsp; <a href="README.zh-CN.md">中文</a> &nbsp;·&nbsp; <a href="README.ja.md">日本語</a> </p> <p> <a href="https://sakura.billpwchan.art/"><img alt="Live demo" src="https://img.shields.io/badge/live-demo-c0392b?style=flat-square"></a> <a href="https://threejs.org/"><img alt="three.js r186" src="https://img.shields.io/badge/three.js-r186-1f2937?style=flat-square"></a> <img alt="WebGL 2" src="https://img.shields.io/badge/WebGL-2-1f2937?style=flat-square"> <img alt="No engine, no framework" src="https://img.shields.io/badge/engine-none-1f2937?style=flat-square"> <a href="LICENSE"><img alt="MIT licence" src="https://img.shields.io/badge/code-MIT-e8a0b4?style=flat-square"></a> </p> </div> <br> You sit in a *tomabune*, a reed-roofed river boat, while a boatman sculls you down a river. You pass through: - morning mist on the shallows; - an avenue of cherry trees; - a vermilion drum bridge; - a village beneath a five-storey pagoda; - a bamboo gorge; - a tunnel of a thousand torii; - a lake where a torii stands in the water. 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. <br> <p align="center"><img src="docs/media/seasons.jpg" width="100%" alt="The same stretch of river in spring, summer, autumn and winter"></p> <p align="center"><sub>The same trees across the year: blossom, then summer green, then autumn colour turning leaf by leaf, then snow on the boughs.</sub></p> ## The journey <table> <tr> <td width="50%"><img src="docs/media/journey-1-asagiri.jpg" alt="Shallows of Morning Mist"><br><b>朝霧の瀬</b> &nbsp;Shallows of Morning Mist<br><sub>Reeds, stones and heavy dawn mist.</sub></td> <td width="50%"><img src="docs/media/journey-2-avenue.jpg" alt="The Cherry Avenue"><br><b>桜並木</b> &nbsp;The Cherry Avenue<br><sub>Banks lined with sakura, and rafts of fallen petals.</sub></td> </tr> <tr> <td><img src="docs/media/journey-3-bridge.jpg" alt="The Vermilion Drum Bridge"><br><b>朱の太鼓橋</b> &nbsp;The Vermilion Drum Bridge<br><sub>The boat passes under the arch.</sub></td> <td><im
