[2026/10/31]

[Sky Today] 夜の空の向こうから列車が走ってくる（銀河鉄道の夜）WebXR対応

[Sky Today] 夜の空の向こうから列車が走ってくる（銀河鉄道の夜）WebXR対応

概要

TOP ページの空（Sky Today）に、ひとつだけ、仕掛けを隠しました。空のどこかに、ゆっくり回る暗い渦があります。見つけて、クリックしてみてください。

  • 探す: 夜の空だけに現れます。メニューの CAMERA を FREE にして、空を見回します
  • 反応する: 渦にマウスを当てると、縁がにじんで、回る速さが変わります
  • 押す: クリックすると、汽笛が鳴って、渦の向こうから列車が走ってきます
  • 止まる: 目の前で止まって、駅名標が現れます
  • 乗る: 駅名標をクリックすると、確認が出て、列車の中に乗り込めます（2026-11-01 追加）
  • 旅する: 発車すると、列車は空へ昇り、草原、光の波、白い鳥の群れ、光の回廊を通って、駅に着きます（2026-11-02 追加）
  • その先へ: 駅からもう一度発車すると、光る砂丘、観測所を通り、昼の野に出て、最後の駅に着きます。ホームに降りて歩けます（2026-11-04 追加）
  • 無料: 登録も、ダウンロードも要りません

宮沢賢治『銀河鉄道の夜』と、1985 年のアニメ映画版へのオマージュです。映画の画像・映像・音は使っておらず、見た目は、すべてコードで作っています。位置は、天文として正確ではありません。

開く

スクリーンショット

渦の向こうから走ってきた列車

停車した列車と駅名標

看板をクリックすると、確認が出ます

乗りますか？の確認

乗り込むと、向かいの席にアバターが座っています

列車の車内

動画

探し方

1. 夜の空にする

渦が見えるのは、夜だけです（太陽が地平線より、10° 以上下にあるとき）。昼や夕方は、見えず、押しても反応しません。TOP の空の設定が、今いる場所の夜空になります。

右クリックメニューの「SKY」タブから「Sky Today」を選び、夜になるのを待ちます。

CAMERA を FREE にする

2. CAMERA を FREE にする

メニューの CAMERA の [＜] [＞] を押して、FREE にします。ほかの視点では、ドラッグしても空は動きません。

CAMERA を FREE にする

3. 空を見回す

  • 左ドラッグ: 空をつかんで、見回します
  • ホイール: 画角を変えます（広く見たり、拡大したり）

アバターを押したときは、見回しになりません。空の何もない所を、つかんでください。

空を見回す

4. 渦を探す

ヒントです。

  • 天の川の中の、北から北西のほうの空を探します
  • 暗い、小さな渦です。ゆっくり回っています（約 78 秒で 1 周）
  • 見えない日は、時間をおいて、もう一度見てください。渦の見える時間帯は、日ごとに、約 4 分ずつ早くなります

5. クリックする

渦の上にマウスを置くと、カーソルが指の形になります。そのままクリックしてください。

  1. 汽笛が鳴ります（低い音）
  2. 3 秒ほどたつと、渦の向こうから、列車が走ってきます
  3. 走るにつれて、シュッポシュッポという音が、大きくなります
  4. 目の前で止まって、汽笛が鳴ります。駅名標が現れます

6. 列車に乗る

駅名標に「▶ クリックで乗車」と出ています。クリックしてください。

  1. 「この列車に　乗りますか？」と聞かれます。「乗る」を押すと、画面が暗くなります
  2. 列車の中の席に座っています。向かいの席には、アバターが座っています
  3. 少し待つと、汽笛が鳴って、発車します。窓の外の星が流れます
  4. 野原を走り、列車は空へ昇っていきます。窓の外の景色が、次の順に変わります
  5. 降りるときは、Esc キー、または、視界の下の「降りる」を押します。TOP に戻ります（旅の途中でも、いつでも降りられます）

列車自体は動いていません。窓の外の景色を流して、走っているように見せています。

旅の順番（2026-11-02 追加）

乗ってから駅に着くまで、今は 7 分ほどです。景色は、次の順に変わります。

  1. 野原: 街の灯りの中を走ります
  2. 離陸: 地面が沈んでいき、街の灯りだけが残ります
  3. 宇宙: 遠い星の中を進みます
  4. 草原: 星の下に、草が揺れる野原が広がります。そこに、リンドウが少しずつ咲いていきます
  5. 光の波: 光が波のようにうねる地面の上を走ります
  6. 白い鳥: 窓の外を、白い鳥の群れが飛んでいきます。だんだん数が増えます
  7. 光の回廊: 光の輪が並ぶトンネルを抜けます
  8. 白鳥の停車場: 駅に着いて、止まります。ここで、旅は一区切りです。「降りる」を押すと、TOP に戻ります

駅のあとの旅（2026-11-04 追加）

白鳥の停車場で「出発」を押すと、旅は続きます。駅から最後の駅まで、6 分ほどです。

  1. 砂丘: 光る砂丘の上を走ります。空から落ちてくる鳥がいます
  2. 観測所: 窓の左右に、巨大な円柱の塔が立つ遺跡を抜けます
  3. 昼: 白い光に包まれて、夜空が昼の青空と雲に変わります
  4. トウモロコシ畑: 一面の畑のなかを走り、だんだん減速します
  5. 最後の駅: 骨組みだけの屋根の頭上に、巨大な六角形の時計が浮かんでいます。目の前で巨大な振り子が揺れて、振り切るたびに「カチッ」と鳴ります

最後の駅では、「ホームに降りる」を押すと、板張りのホームを歩けます。列車に戻るには、床に出る光の円に入ります。「降りる」を押すと、TOP に戻ります。この駅には、「出発」はありません。

空を見回す

補足

  • 音が出ます: クリックの汽笛から始まります。音量に注意してください
  • VR: VR のレーザーでも、押せる作りです（夜に試せていないので、実機での確認はこれからです）
  • スマホ: 空を見回す操作は、まだ、マウスだけです
  • もう一度見る: ページを開き直すと、列車は消えて、もう一度、クリックできます
  • 客車: 先頭の機関車と、客車は、3D モデルです。乗り込める客車は、設定で用意した場合だけです
  • 乗車中の音: 汽笛は発車のときの 1 回だけです。そのあとは、走行音が続きます
  • VR・スマホ: 乗車から駅までは、PC と VR で通して確認しました。スマホは、まだ確認していません
  • 長さ: 白鳥の停車場まで 7 分ほど、そこから最後の駅まで 6 分ほどです。場面の長さは、あとで調整します
  • 昼の駅の音: 振り子の「カチッ」は、近づくほど大きく、離れると小さくなります

更新情報

  • 2026-11-04: 白鳥の停車場のあとの旅を作りました。光る砂丘と落ちる鳥、アルビレオの観測所、白い光で昼に変わる切り替え、トウモロコシ畑、昼の駅（巨大な六角形の時計と振り子）です。最後の駅では、ホームに降りて歩けます
  • 2026-11-02: 乗車したあとの旅を作りました。離陸、宇宙、草原とリンドウ、光の波、白い鳥の群れ、光の回廊を通って、白鳥の停車場に着きます。駅では止まったままになり、「降りる」で TOP に戻れます
  • 2026-11-01: 駅名標をクリックして、列車に乗り込めるようにしました。車内の席に座り、向かいの席にアバターが座ります。発車すると、窓の外の星が流れます。客車を 3D モデルに差し替えました

クレジット

  • 機関車: Victorian Railways R Class Steam Train（Jotrain、Sketchfab）
  • 客車: Resident-evil train（Katydid、Sketchfab、Free Standard）
  • 効果音: 効果音ラボ
  • 原作・着想: 宮沢賢治『銀河鉄道の夜』、アニメ映画『銀河鉄道の夜』（1985 年）へのオマージュです。映画の素材は使っていません（2026-11-04 追加）
  • 駅の壁・床・柱のテクスチャ: AI で生成（2026-11-02 追加）
Victorian Railways R Class Steam Train - Download Free 3D model by JoTrain The Aussie 🇦🇺 (@Jotrain)

Victorian Railways R Class Steam Train - Download Free 3D model by JoTrain The Aussie 🇦🇺 (@Jotrain)

The Victorian Railways R class was a 4-6-4 “Hudson” steam locomotive built in Scotland by the North British Locomotive Company in 1951. Designed for express passenger services, it became VR’s final mainline steam design. Several were later refurbished by Steamrail Victoria and others for heritage and excursion runs. Of the original 70 built, seven survive today, with R 761 and R 707 being the most famous operational examples. Please support my work by donating! https://buymeacoffee.com/jotrain Created as a Transport Fever 2 mod: Feel Free to Join my Discord Community! https://discord.gg/GSMrs5zhxN To give proper credit, include the following in your credits section: Model: https://sketchfab.com/3d-models/vr-r-class-tpf2-v3-6-9-5ba3fcb243f64ac3a330147ad98ae3e7 Created by (Jotrain) – www.jotrain.com.au - Victorian Railways R Class Steam Train - Download Free 3D model by JoTrain The Aussie 🇦🇺 (@Jotrain)

sketchfab.com

技術的な話

実装は、技術記事にまとめています。

[Astro] #211 WebXR銀河鉄道: 昼への切り替え・トウモロコシ畑・昼の駅（巨大な振り子時計とホーム）をコードで作る // PROTOCOL.LAIN

[Astro] #211 WebXR銀河鉄道: 昼への切り替え・トウモロコシ畑・昼の駅（巨大な振り子時計とホーム）をコードで作る // PROTOCOL.LAIN

Three.js で、列車の出発後の場面を作る実装ガイド。砂丘と落ちる鳥、観測所、白いフラッシュによる昼への切り替え、InstancedBufferGeometry のトウモロコシ畑、減速して止まる駅、巨大な六角形の時計と振り子、振り切りの効果音、ホームを歩く処理を扱います。

lain-lab.com
[Astro] #207 星空の列車に乗り込む（客車 GLB の加工・席の特定・VRM を座らせる） // PROTOCOL.LAIN

[Astro] #207 星空の列車に乗り込む（客車 GLB の加工・席の特定・VRM を座らせる） // PROTOCOL.LAIN

Three.js で、GLB の客車に乗り込む演出の実装ガイド。EXT_texture_webp の読み込み、ドアの移植、外壁の作り直し、ポリゴンの重なりのちらつき対策、座席の座標の調べ方、客車をカメラの回りに持ってくる乗車方式、VRM と VRMA の着席、空の時刻の早送りによる発車演出、Web Audio の走行音を扱います。

lain-lab.com
[Astro] #206 夜の空に列車を走らせる（石炭袋・FREE カメラ・GLB 機関車・効果音） // PROTOCOL.LAIN

[Astro] #206 夜の空に列車を走らせる（石炭袋・FREE カメラ・GLB 機関車・効果音） // PROTOCOL.LAIN

Three.js の星空に、らせん状の暗い渦を、シェーダーの中の計算だけで開く方法と、そこから列車を走らせる実装ガイド。対数らせんのマスク、見えない球による当たり判定、FREE 視点の見回し、3 次ベジェと直線の線路、豆粒から本来の大きさへ育てる式、GLB 機関車の取り付けと車輪の回転速度、半透明のフェードイン、Web Audio の効果音、キャンバスで描く駅名標を扱います。

lain-lab.com