JOURNAL お問い合わせ

CASE 02制作事例

駅にも赤信号にも自分で止める、でんしゃの うんてんし の舞台裏

子ども向け3D運転ゲームの設計と、軽くする工夫。

レバー1本で速さを加減し、駅の停止位置へ自分の手で電車を止める、子ども向けシリーズ AMIX GAMES KIDS「おしごとたいけん」の第1弾として、2026年10月5日に公開した無料の3Dゲームです。やさしい見た目でも子どもだましにしない、という最初の決めごとから、11km×8kmの街の軽量化、131本の車内放送、名前を使わないオンライン撮影モードまで、制作の記録をたどります。

でんしゃの うんてんし のタイトル画像。ちゅうおう駅のホームに止まる、黄色に緑の帯のローカル電車「ひだまり」と、左下の AMIX GAMES KIDS のロゴと題字

OVERVIEW作品の概要

作品名
でんしゃの うんてんし(AMIX GAMES KIDS おしごとたいけん 第1弾)
ジャンル
子ども向けの電車運転シミュレーター(ひとりで運転/写真を撮る「とりてつ モード」は最大4人のオンラインあり)
中身
約11km×8kmのひとつながりの街に5路線・15駅。電車5種類、昼・夕方・夜、晴れと雨、スタンプ24個
操作
スマホ・タブレットは画面右のレバーとボタン、PCは↑↓キー・Space・F・Enter
技術
three.js(r185)・PeerJS 1.5.5(WebRTC)・Web Audio
サーバー
ファイルを配信するだけ。オンラインは入室の仲介だけ PeerJS の公開サーバーを使う
公開
2026年10月5日
制作
AMIX(企画・デザイン・3D・プログラム。BGM・発車メロディ・効果音は Audiostock の素材、植物は AMIX の FABOTANIC、車内放送とホームの案内は音声合成)

でんしゃの うんてんし で遊ぶゲームの紹介ページ

01 — PLAN駅にも赤信号にも、運転士が自分で止める

制作の入り口で決めたのは、丸みのあるかわいい絵作りであっても中身を子どもだましにしないこと、鉄橋や車両の造形も市販のゲームと同じ水準で作ることの2つでした。

「おしごとたいけん」は、いろいろな仕事にごっこ遊びのように触れられるシリーズで、その第1弾が電車の運転士です。1プレイの流れは運転士の仕事そのものをなぞっています。出発前にブレーキ・ライト・パンタグラフ・信号のボタンを順に押して点検し、駅に着いたらホームのモニターを確かめてドアを開け閉めする。「ゆびさし」ボタンで「しゅっぱつ しんこう!」と声を出してから動きだし、到着予定時刻と制限速度、信号を見ながら次の駅を目指します。終点に着くと日報が出て、駅ごとの★、乗せたお客さんの数、指差し確認の回数がそのままポイントになる仕組みです。

出発前の点検の画面。ブレーキ、ライト、パンタグラフ、信号のボタンが並び、2つに「よし!」の印が付いている ドアの操作の画面。左の窓のホームのモニターに、開いたドアから乗りこむどうぶつのお客さんが映り、右に縦長のレバーがある
左:走る前の点検。右:ドアの操作は別の窓に出る「ホームの モニター」を見ながら。「のりおり よし!」と確かめてからドアを閉める。

駅が近づいても、自動でぴたりと止まる補助は入れていません。駅の停止位置にも赤信号の手前にも、レバーで速さを落として自分の手で止めます。自動ブレーキ(ATS)が働くのは、赤信号や線路上の動物の手前でどうしても止まりきれない場面だけで、あくまで最後の安全装置という位置づけです。線路の光る枠の緑の部分、ずれ0.6m以内に収めると★3つがつきます。

停止位置を行き過ぎても、そこでゲームオーバーにはなりません。レバーを後ろへ引いてバックし、自分の手で止め直します。駅を通過してごまかす抜け道は作らず、小さな子ども向けには最高速度を65%に抑え、★3つの判定幅も1.2mに広げた「かんたん」を用意しました。

駅に近づく運転席からの画面。画面の下に「あと 130m」のゲージが出て、止まる場所が示されている 日報の画面。止まった駅ごとの★と、乗せたお客さん、指差し確認の回数、もらったポイント、新しいランク「いちにんまえ」が出ている
左:駅が近づくと止まる場所までの距離がゲージに出る。右:終点で出る日報。ランクは「みならい」から「でんせつ」まで5段階。

閉まりかけたドアへ駆けてくるお客さんに気づいたら、ドアを開け直して乗せる場面も入っています。運転士の安全確認として入れた演出ですが、現実の駅では駆け込み乗車が危険であることを、車内のセリフや駅の放送、紹介ページの「おうちの方へ」の欄で重ねて伝えています。

02 — BUILD11km×8kmの街を、ブラウザで60コマに乗せる

舞台になる街は、約11km×8kmがひとつながりになった空間です。都心のちゅうおう駅から田んぼ、山あいの温泉町、海ぞいの岬まで5路線・15駅が結ばれ、自分が運転している間も別路線の電車や踏切待ちの車、ホームの乗客がそれぞれの時刻で動いています。

雪の残る山を背に、高架橋を走る白い高速電車「あおぞら」 桜の咲く森の中を、煙を吐いて走る蒸気機関車「もくもく」 海の近くの、かもめはま駅に入ってくるピンク色の展望電車「きらきら」
左から、最高速度約208km/hの高速電車「あおぞら」、単線を走る蒸気機関車「もくもく」、屋根まで窓の展望電車「きらきら」。電車ごとに速さもブレーキのきき方も違う。

車窓の街並みは、同じ四角い箱を碁盤の目に並べないよう気を配りました。戸建ての並びにマンションが混ざり、ビルの高さも不ぞろいにしてあります。屋根の色は原色を避けて、れんが色・いぶし瓦・くすんだ青に落ち着かせ、季節は春に統一して紅葉は混ぜていません。線路ぎわや駅前、海辺の木々と草花には、AMIX の植物素材 FABOTANIC を使いました。

これだけの広さをそのままブラウザで描くと、やはり重くなります。公開前にちゅうおう駅の300m手前で測ったところ、1秒あたり39コマまで落ちていました。原因を調べると、足を引っ張っていたのは描画(GPU)ではなくプログラム(JS)側の計算です。動かない建物や柵など約1.6万個の姿勢を毎コマ計算しなおしていた処理を止め、景色と運転台で前照灯の条件が食い違って毎コマすべてのシェーダーを選びなおしていた箇所も光をそろえて解消しました。細かい部品も約1,950個から約420個へ統合した結果、1コマあたりの処理は約25msから約11msまで縮み、60コマで回るようになっています(いずれもヘッドレス環境の Mac での計測値で、実機計測ではありません)。

うしろからの視点で、ひだまりが都心のビル街へ向かう8秒の映像。AMIX GAMES の一覧の紹介ウィンドウで流しているもの。

軽さと引き換えに削った演出もあります。タイトル画面で街の上空を飛び回るカメラと、運転中の横・上空からの視点は外し、視点を運転席と後方カメラの2つに絞りました。画質は「きれい」と「かるい」の2段階で、スマホや小型タブレットは最初から「かるい」で起動します。走行中にコマ落ちが3秒続けば解像度を15%下げ、余力が戻れば少しずつ引き上げる自動調整も入れました。

公開後、遊んだ人からの報告で直した不具合もいくつかあります。スマホの Chrome で車窓とホームのモニターだけが真っ白になる現象は、端末のメモリ不足でブラウザが3D描画の領域を手放していたのが原因でした。今は「がめんを もどして います…」と表示して進行と音をいったん止め、復帰すればそのまま続きを走れるようにしています。5秒待っても戻らないときだけ、別タブを閉じる案内と再読み込みボタンを出します。ボタン連打で画面がズームされたまま戻せなくなる報告には、連打拡大と2本指拡大を抑止したうえで、万一拡大されても2本指で縮小だけは効くように改めました。

03 — SOUND車内放送は日本語と英語で、131本の声

駅を発車して少し走ると、「つぎは、たのさと。たのさとです。」と車内放送が入り、続けて英語のアナウンスが流れます。音声合成で作った声は、車内の日本語55本・英語37本・ホームの案内39本の計131本。英語放送は制作の途中で本物の列車らしさを出すために足したもので、画面の「こえ」ボタンからいつでも止められます。

駅のホーム案内は「ホーム上のスピーカーから鳴っている音」として処理しました。運転台からホームまでの距離に応じて音量が下がり、少しこもって反響が増える仕組みです。車内放送とホームの案内が重なって聞こえる瞬間もありますが、実際の駅でも重なるためそのまま鳴らしています。

走行音・踏切・警笛・発車メロディは Audiostock の音源です。発車メロディは車両ごとに曲を変え、蒸気機関車だけは発車ベルにしました。電車の速度に合わせて走行音の再生速度が変わり、踏切の警報音は近づく速さで音程が変化します(ドップラー効果)。実録の素材が鳴っている間は、プログラムで合成した「カタン」などの効果音を重ねない決まりです。

音量バランスは、耳で1本ずつ合わせたあと、全音源を同じ出口で数値計測して点検しました。その計測で、赤信号で鳴るはずの自動ブレーキ警報が −34dB しか出ておらず、走行音(−25dB)に埋もれていたことが判明しています。測った値は音の台帳に記録し、音量を触ったときは必ず測りなおす運用にしました。

04 — PHOTO運転しない遊び方:とりてつ モードと、名前を使わないオンライン

タイトル画面にある「とりてつ モード」は、運転席を離れて街を歩き、走ってくる電車を撮影する公開日からのモードです。路線図から駅のホーム19か所、鉄橋・田んぼ・浜辺・踏切などの撮影地14か所を選んでワープし、自分の足で立ち位置と構図を探します。ズームは11倍まで寄り引きでき、背景のボケ具合も変えられます。

とりてつ モードの画面。赤い鉄橋を渡る汽車を写真のわくに入れている。左に次の電車までの時間、右にズームとぼかしの操作がある とりてつ モードで撮った写真。谷川にかかる赤い鉄橋を、煙を吐いて渡る蒸気機関車
左:撮るときの画面。わくの中だけが写真になる。右:撮った1枚。たにがわの鉄橋を渡る「もくもく」。

切ったシャッターは最大24枚のアルバムに残り、端末への画像保存にも対応しました。アルバム内の「げんぞう」を開くと、フィルム調・モノクロ・ジオラマ風といった仕上げや、日なたと日かげのコントラストを強める「リアルな ひかり」をかけて別カットを作れます。

このモードも公開後の声から手を加えました。「乗り降りするかわいい動物たちを撮りたい」という感想を受け、ホームで電車を待つ乗客と乗降アニメーションを追加しています。構図の邪魔になる場合もあるため初期状態では非表示とし、地図画面の「おきゃく」スイッチで呼び出す方式にしました。「シャッターを切るとタイトル画面に戻ってしまう」という報告は、撮影瞬間のメモリ超過によるページの再読み込みと見て、スマホの「きれい」設定で撮影時に使っていた291MBを156MBまで削っています(ヘッドレス Chrome での計測値。実機では現象自体を再現できていません)。

公開から8日後の10月13日には、最大4人で同じ街を歩いて撮影する「いっしょに とりてつ」を追加しました。子ども向けの作品であることから、名前の入力欄もテキストチャットも一切設けていません。お互いの区別は6種類の動物(ねこ・いぬ・うさぎなど)と帽子の色のアバターで行い、やりとりは「おーい」「いいね」「ありがとう」といった定型のエモートに限りました。ゲスト側から時間帯や天気、編成の長さを変えてほしいと「おねがい」を送り、ホストが「いいよ」を押せば全員の空模様が切り替わります。

通信にはゲーム用サーバーを置かず、入室の仲介だけを PeerJS の公開サーバーで行って端末どうしを直接結びます。送受信するのはアバターの種類・位置と向き・エモート・シャッターの合図のみで、名前も撮った画像も外へ流れません。初回利用時には相手にIPアドレスが伝わる場合がある旨の案内を出し、同意のチェックを入れてから進む手順にしました。通信用のスクリプトは「いっしょに」ボタンを押した時点で初めて読みこむため、ひとりで遊ぶ人には通信コードすら届きません。

DESIGN NOTE

自由入力の名前やチャットを持たないオンライン設計は、子どもが見知らぬ相手と言葉を交わすリスクを構造ごとなくせるうえ、投稿監視の運用コストも発生しません。入室コードを知っている家族や友だちと遊ぶ前提に絞ったからこそ成立する形です。反対に、誰でも入れる広場やサーバー保存のランキングを作る場合は、専用サーバーと監視体制が別途必要になります。

05 — DATA夕方から夜にも山が続く、公開1か月の遊ばれ方

AMIX GAMES の全作品の遊ばれ方は毎日集計し、DATA CENTRAL で公開しています。10月5日の公開から約1か月がたった時点での数字を取り出しました(割合と順位のみで、閲覧数の実数は伏せています)。

DENSHA NO UNTENSHI — PLAY DATA

集計:AMIX GAMES DATA CENTRAL(2026年11月10日までの値)

5位月間の閲覧数の順位(10月12日〜11月10日・AMIX GAMES の全作品の中で)
45%9〜15時に遊ばれた割合(11月4日〜10日)
17%19〜22時に遊ばれた割合(11月4日〜10日)
76%PC で遊ばれた割合(11月4日〜10日)

遊ばれた時間帯1時間ごとの割合・2026年11月4日〜10日

遊ばれた時間帯(1時間ごとの割合) 11月4日〜10日。9時台から14時台までの6時間に全体の45%。いちばん多いのは13時台の8.7%。どの時間も同じだった場合の割合は4.2%。 9〜15時に 45% 0時台 0.5% 1時台 0.2% 2時台 0.1% 3時台 0.1% 4時台 0.0% 5時台 0.1% 6時台 0.9% 7時台 2.4% 8時台 4.6% 9時台 6.4% 10時台 8.0% 11時台 7.6% 12時台 6.1% 13時台 8.7% 14時台 8.5% 15時台 6.7% 16時台 6.5% 17時台 6.1% 18時台 6.3% 19時台 6.0% 20時台 6.6% 21時台 4.6% 22時台 2.1% 23時台 1.0% どの時間も同じなら 4.2% 8.7% 0時 3時 6時 9時 12時 15時 18時 21時

端末11月4日〜10日

  • PC76%
  • タブレット13%
  • スマホ11%

来た元11月4日〜10日

  • AMIX の中(一覧など)79%
  • 直接(ブックマーク等)11%
  • 検索10%
  • SNS0.2%

平日と週末の比は、作品ごとの値が粗く出た10月30日と、祝日の11月3日を除いて数えています。計測は Cloudflare Web Analytics(ページの表示を数える仕組み)。ゲームのページ(/tl/kids-g-train/)を開いた回数を数えていて、遊んだ時間や回数ではありません。「直接」はほかのページを経ずに開かれたもの。四捨五入のため、合計が100%にならないことがあります。

9時台から14時台までの6時間に全体の45%が集まり、多かったのは13時台(8.7%)と14時台(8.5%)でした。一方で15時台から20時台も6〜7%前後が続き、夜の19〜22時の3時間に17%入っています。SHIBA DASH!! は同じ期間に9〜15時が56%・19〜22時が11%だったため、夕方から夜にかけて開かれる割合がはっきり高い作品です。

曜日別では、平日1日あたりの閲覧が週末1日あたりの約1.6倍でした(10月14日〜11月10日、平日18日・週末8日)。端末は PC が76%、タブレットが13%、スマホが11%。画面のレバーを指で引ける作りにしてありますが、実際に開かれているのは4分の3以上が PC です。どんな場所で何歳くらいの人が触っているのかまでは、この集計からは分かりません。

流入元は79%が AMIX GAMES の一覧などサイト内からで、検索経由が10%、直接が11%、SNS は0.2%。公開から約1か月で、全作品の月間順位は5位に入りました。

06 — PERSPECTIVE仕事の段取りを、そのまま1回分の遊びにするには

運転士の業務手順をそのままゲームの進行にしたこの作り方は、企業の仕事紹介や子ども向けの企画にも応用がききます。

決まった手順がある仕事は、ルール説明が要らない

点検、指差し確認、ドアの開閉、定刻どおりの到着。実際の段取りを順番に並べただけで、1プレイの起承転結になりました。路線バスや宅配、工場のライン、店舗の接客など、現場に決まった手順がある仕事なら同じ骨格で組み立てられます。終点の日報に駅ごとの★と並べて指差し確認の回数を出したように、速さや得点とは別の「丁寧さ」を評価軸に置くことも可能です。

失敗で終わらせず、隣で見守る大人にも説明する

停止位置を過ぎてもバックで止め直せること、難しさを2段から選べること、20分ほど続けて走ると休憩を勧める案内が出ること。それに加えて、紹介ページには「おうちの方へ」の欄を設け、現実の駅では駆け込み乗車が危ないことや、記録と写真が遊んだ端末の中にしか残らないことを明記しました。子ども向けの企画では、遊ぶ本人の画面と、そばで見る保護者・先生向けの説明をセットで作ることになります。

サーバーと音源で変わる制作の範囲

今回の構成はファイルを置くだけで動き、オンライン撮影も入室の仲介に公開サーバーを借りるだけなので、毎月のサーバー運用は発生しません。端末をまたいだ記録の引き継ぎや参加者ランキングを設ける場合は、サーバーと個人情報の設計が加わります。音声アナウンスを入れるなら駅や車種を増やすたびに収録も増えるため、ブラウザゲーム制作の進め方と費用や企業・団体向けのタイアップ案内では、こうした範囲の線引きから相談を受けています。

MORE FROM JOURNAL