こんにちは、Yama’s Game Dev LabのYamaです。
普段はこのブログで、UE5を使ったダンジョン探索型アクションRPG『Dungeon Wanderers』の開発記として、「パケットロスを防ぐためのRPC通信」や「循環参照を排除したUI設計」といったゴリゴリの技術記事を書いています。
しかし今回は、ちょっと毛色の違うお話です。
実は最近、3歳の息子が「ひらがな」や「車」に強い興味を持ち始めました。ChromeBookで一緒に遊ぶことがあるのですが、アプリの広告が多いこと。息子がもう広告いやだというようになりました（笑）
そこで、「ゲーム開発者のパパとして、息子が夢中になれる大好きな車の知育ゲームを自作しよう！」と思い立ち、サクッと（しかし本気で）ブラウザゲームを開発しました。
今回はその自作知育ゲームの公開と、普段開発しているハードコアなRPG『Dungeon Wanderers』とのギャップについてお話しします！
🚗 知育ブラウザゲーム『もじドライブ！』公開！
まずは完成したゲームのご紹介です！
スマホやタブレットのブラウザから、インストール不要でそのまま遊べます。お子様がいる方はぜひ一緒に遊んでみてください！
👉 『もじドライブ！』で遊ぶ（ここをクリック！）
(※音が出ます音量を下げてそこから調整してください)
どんなゲーム？
「文字のなぞり書き」と「横スクロールドライブゲーム」が合体した、車好きのこどもが絶対夢中になる知育ゲームです。
ひらがなだけでなく、カタカナ、数字、アルファベットの読み書きまで対応しています！
ゲームは、こどもが自然に文字を覚えられる「3つのステップ」で進みます。
- 👀 見て・聞いて覚える
画面に大きく文字が表示され、ブラウザの音声合成API（ここは機械っぽいですが、さくっとできる範囲でいったん良しとしてます。）を利用して音声で読み上げられます。まずは目と耳でインプット！ - ✏️ なぞって書く（ここがパパのこだわり！）
画面を指や、ペンでなぞって文字を書きます。ここには「適当にぐちゃぐちゃ塗りつぶしてもクリアできない、割とシビアな判定機能」を実装しました。親目線として、ただ遊ぶだけでなく「正しい形」をしっかり学ばせるための譲れない仕様です。 - 🏎️ ドライブでテスト（二択クイズ）
文字が書けたらドライブへ出発！道が二股に分かれ、「さっき書いた文字はどっち？」とクイズが出ます。正しい道の画面をタップして進みます。
親御さんも安心の「3つのフリー」仕様
こどもに楽しく文字の練習をしてもらいたいパパ・ママのために、以下の仕様で作りました。あと私の息子のため。
- 完全無料＆広告一切なし！
変な広告を誤タップして別のサイトに飛んでしまう心配がありません。あの広告の小さい×をタップしなくていいからいらいらしない。 - HTML1ファイルなので「めちゃくちゃ軽い」！
重いデータのダウンロードはありません。ブラウザでサクサク快適に動きます。
こどものモチベーションを爆上げする機能たち
- ガレージ機能が熱い！
文字をクリアして「⭐（星）」を集めると、パトカーや消防車だけでなく、スーパーカー、バイク、トラックなど多彩な乗り物がアンロック！タイヤのカスタマイズも可能です。 - 行クリアで「パレード」発生！
「あ行」などをすべてクリアすると、車が走り、文字が読み上げられながらクリアパレードをするご褒美演出を作りました。あいうえおのかたまりのほうが覚えやすいかなと。
⚠️ 【重要】セーブデータの保存と「確実なバックアップ」について
このゲームはWebブラウザ上で動くため、セーブデータは「ブラウザのキャッシュ」に自動保存されます。
そのため、以下の点にご注意ください。
- 消えてしまうケース： ブラウザのキャッシュをクリアしたり、「シークレットモード（プライベートブラウザ）」で遊んだりすると、次回アクセス時にデータが消えてしまいます。
- 確実な保存方法（バックアップ）：
せっかく集めた車が消えてこどもが泣くのを防ぐため（笑）、ゲームのメニューから「データを書き出す」ことができます。終わる時にデータを書き出して保存しておけば、もし次回始めるときにデータが消えていても、「データを読み込む」からいつでもセーブデータを復活できます！
一方、普段作っているゲームは……
さて、すっかり「優しい知育アプリ開発者」の顔になってしまいましたが、普段私が心血を注いで開発しているのは、全く対極にあるゲームです。
私が開発しているのは、ダンジョン探索型アクションRPG『Dungeon Wanderers』。
自由な冒険と成長をテーマにした、4〜8人程度の少人数協力プレイを想定した作品です。
コンセプト：プレイヤーの「判断」が冒険を形作る
本作で一番こだわっているのは、固定的な攻略手順をプレイヤーに強要しない設計です。
ダンジョン内では、戦うか、逃げるか――。
プレイヤーが直面する状況に対し、どのような判断を下したかがそのまま探索の成果となり、キャラクターの成長に直結する仕組みを作っています。
レベルを上げてポイントを振るのではなく、「何度も回避に成功した」といった行動や経験をトリガーにしてスキルを発見・獲得するシステムを実装中です。
技術的な挑戦：マルチプレイにおける「完全同期」
『もじドライブ！』はHTML1ファイルでめちゃくちゃ軽く動きますが、『Dungeon Wanderers』はマルチプレイでの協力体験を重視しているため、技術的ハードルが跳ね上がります。
プロシージャル生成（Dungeon Architectを使用）されたダンジョン内で、「パケットロスやPCスペック差による同期ズレ（空中落下やUIバグ）」ラグの影響をどう防ぐかが現在の最大のテーマです。
これまでに以下のようなコアシステムを構築しました。
- ハンドシェイク方式による生成同期: クライアントの地形生成完了をサーバーが確認するまでワープさせない、確実な遷移システム。
- 循環参照を排除したUI設計: 大規模アセットと共存してもプロジェクトを壊さない、インターフェースを介した疎結合なUI管理。
- 高信頼性テレポート: パケットロスしても確実にワープを成功させる Reliable RPC 経由の移動命令。
「通信が不安定な環境でも、全員が同じスタート地点に確実に立てる」というオンラインゲームの最大の基盤を構築する作業は骨が折れますが、完成した時の達成感はひとしおです。
まとめ：対象年齢3歳からハードコアゲーマーまで
3歳の息子のために「広告なし、サクサク動く、車、文字のゲーム」を組み、「パケットロスに耐えうる高信頼性テレポートRPC」を組む。
今回息抜きにサクッとつくりましたが、どちらも「遊ぶ人の体験を一番に考える」というゲーム開発の本質は同じだなと感じています。まだまだ無限に改良できますが、きりがないのでいったん無理やり区切りました。
現在は『Dungeon Wanderers』の最小構成（Vertical Slice）の構築を進めています。
次回からは、この強固な基盤の上でどのようなギミックや戦闘体験を実装していくか、具体的な技術的試行錯誤を記録していく予定です。
普段の大人向けRPG開発にも興味を持っていただけた方は、ぜひ今後のブログ更新やSNSのチェックをよろしくお願いします！
（そして、お子様がいらっしゃる方はぜひ『もじドライブ！』で遊んでみてくださいね！感想聞かせてもらえると嬉しいです。）
