はじめに
今回、AIを活用して本格的な3Dビリヤードゲームを開発しました。Three.jsを使った3Dレンダリングと物理演算、さらにCPU対戦機能まで実装できたので、その記録と学びをまとめます。
作ったもの
本格的3Dビリヤード
🔗 https://billiards-game.vercel.app/
ブラウザ上で動作する3Dビリヤードゲームです。CPU対戦も可能で、リアルな物理演算によるボールの挙動を楽しめます。
操作方法
| 操作 | 方法 |
|---|---|
| カメラ回転 | 右クリック押下中にカーソル移動 |
| 視点移動 | スペース押下中にドラッグまたは矢印キー |
| ズーム | ピンチ操作 |
| ショットモード切替 | 左クリック |
| ショット実行 | ショットモード中にドラッグ状態を解除 |
アプリの特徴
1. 自由な視点切替
プレイヤーが自由にカメラアングルを変更可能。狙いを定めやすい角度から戦況を確認できます。(視点操作はマウス推奨)
2. 2つのゲームモード
・9ボール
1〜9番のボールを順番に狙い、9番ボールをポケットに入れた方が勝利するクラシックルール。
・ベーシックゲーム
順番に関係なく、より多くのボールをポケットに入れた方が勝ちとなるシンプルモード。ビリヤード初心者にもとっつきやすいです。
3. CPU対戦機能
一人でも楽しめるよう、CPUとの対戦モードを実装。
CPU機能は生成AIではなく純粋なアルゴリズム（幾何計算） だけで実現しています。
ショット選択のロジック
CPUは以下の優先順位でショットを選びます。
① 直接ショット（ストレート）
キューボールからターゲットボールへの経路に障害物がないか判定します。経路チェックには「レイキャスト」という手法を使っており、光線を飛ばして途中のボールに当たるかどうかを数学的に計算しています。
② バンクショット（クッション）
直接狙えない場合、クッション（壁）に1回当てて間接的に狙います。角度の計算には鏡像法を使っています。ターゲットボールの位置を壁に対して折り返した「仮想ターゲット」を作り、そこへの直線がそのままバンクショットの角度になります。
③ フォールバック
どちらも無理な場合は、ターゲット方向へ弱めに打ちます。ファウルを受け入れる処理です。
「人間らしさ」の工夫
計算上は一瞬でショットが確定しますが、そのまま即打ちするとロボットっぽくなります。そこで2つの工夫を加えています。
- 思考時間の演出：0.6〜1.0秒のランダム遅延を入れてから打ちます
- 意図的な誤差：計算した正確な角度に小さなランダム誤差を加えています。距離が遠いほど誤差の影響が大きくなるため、自然と長距離ショットが難しくなります
4. リアリティのある物理演算
ボール同士の衝突、クッションの反射、摩擦による減速など、現実に近い物理挙動を再現しています。
技術スタック
- Compound Engineering（複合的なAI活用開発手法）
- Claude 4.7 Opus
- Three.js（3Dレンダリングライブラリ）
- Vanilla JavaScript（ESModules）
開発を通じて得た学び
Three.jsのようなライブラリ開発もAIで容易に
Three.jsは3D描画ライブラリとしては有名ですが、3D空間の座標計算やカメラワーク、ライティングなど学習コストが高い印象でした。しかしAIに任せることで、ライブラリの知識が浅くても本格的な3Dアプリケーションを構築できることを実感しました。
CPU機能もAIで実装可能
ビリヤードのCPUロジック（どのボールを狙うか、どの角度で打つかなど）も、AIに指示するだけで実装できました。ゲームAIの実装ハードルが大きく下がっています。
盤面のリアルな表現が難関だった
今回の開発で一番詰まったのが、盤面をリアルに見せる部分です。たとえばポケットの形状が実際のビリヤード台より広く、ボールが入りやすすぎるといった問題があり、「それらしく見える」状態にもっていくまでに何度も試行錯誤しました。
解決策として、実際のビリヤード台の画像をプロンプトとして与え、視覚的な情報をAIに共有しながら調整を進めました。それでもなかなかうまくいかず、AIに画像を検索・参照させたり、複数の生成AIモデルを使い分けたりしながら対応しました。
物理演算のロジック自体はAIが得意とするところですが、ビジュアルのリアリティはAIへの指示の言語化が難しく、最も時間がかかった部分でした。
・最初に出力された盤面
ポケットの形状が実際のビリヤード台と異なり、ゲームとしての難易度が下がってしまっていた。
AIが得意な開発領域が見えてきた
今回の開発で、AIで作りやすいアプリの特徴が明確になりました。
- UIがシンプルなもの
- ルールが明確化されているもの
- メジャーなゲームジャンル
ビリヤードのように 「ルールが世界共通で明確」 なゲームは、ロジック面ではAIが学習データから多くの知識を持っているため、開発がスムーズに進みます。
一方で、今回の一番の詰まりポイントである盤面のリアルな表現のように、ビジュアルの品質調整はルールの明確さに関係なく難しいと感じました。「もっとリアルに」「添付画像のように作って」といった抽象的な要望はAIへの指示が難しく、前回作成したピンボールアプリと同様に試行錯誤が必要でした。
前回作成したピンボールアプリ
まとめ
AIを活用することで、これまで個人開発では手が出しづらかった3Dゲーム開発のハードルが大きく下がりました。特に「明確なルールがあるメジャーなゲーム」はAI開発との相性が抜群です。
これからゲーム開発に挑戦したい方は、まずはルールが明確なクラシックゲーム（チェス、オセロ、ビリヤードなど）から始めると、AIの恩恵を最大限受けられると思います。
ぜひ一度プレイしてみてください！