プロジェクト概要
claude-opus-5-5-demo は、Claude Opus 5.5のコード生成能力を検証する実験です。リポジトリには、そのままプレイできる3つの3Dウェブゲームが含まれており、各プロジェクトは1つのプロンプトだけを使い、1回のClaude Codeセッション内で資料の検索、プロジェクト構築、コーディング、ビルド、テスト、デプロイまで完了しています。
リポジトリの説明によると、3つのゲームのソースコードはすべてモデルが生成したもので、人によるコードの変更はありません。プロジェクトではThree.jsで3Dシーンを構築し、esbuildでプログラムをバンドルして単一のHTMLファイルにインライン化しています。モデル、テクスチャ、アニメーション、効果音はすべてコードでプロシージャルに生成され、外部の画像、音声、第三者素材には依存していません。
これは従来型のゲーム開発テンプレートではなく、実行、ビルド、検証が可能なワンショットコード生成実験の成果です。
3つのゲームと特徴
ペリカン・バイク
海岸道路をのんびり走るサイクリングゲームです。プレイヤーはヘルメットとサングラスを着用し、赤いスカーフを巻いたペリカンを操作して、自転車で魚を捕まえます。布の物理演算によるスカーフ、波と岸辺の砕け波、昼夜サイクル、プロシージャルな効果音と音楽、フレームレートに応じて画質を自動調整する仕組みを備えています。
- W、S：加速と減速。
- A、D：車線変更と魚への接近。
- スペース：ジャンプ。
- T：翼を広げて前輪を持ち上げる。
- オートドライブ：長時間操作しないと、ペリカンが自動で魚を追います。
ゲームには14個の実績、5種類のカメラモード、タッチボタン、ペダル回転数に合わせて変化するブラウザ上のリアルタイム合成音楽も用意されています。
クロスファイア・輸送船
『クロスファイア』の名作マップ「輸送船」の再現を試みたプロジェクトです。生成時にはまずレイアウト図と攻略情報を検索し、細長い甲板、両端の船室にあるリスポーン地点、中央にV字型で斜めに置かれたコンテナ、両側の一方向パイプなどの特徴をもとにシーンを構築しています。
銃器の弾道、反動、ボットAI対戦、ヒットフィードバック、キル通知、プロシージャルな銃声やその他の効果音を備え、タッチ操作にも対応しています。
QQスピード
レースゲームでは、Shiftドリフト、Ctrlニトロ、ショートブースト、ダブルブースト、リセットなどの操作を再現し、公式マップ風にデザインされた4つのコースを提供しています。
- 十一城：11か所のカーブとヘアピンカーブを含む、夜の都市コース。
- 情迷愛琴海：上り坂と連続カーブが特徴。
- ファラオのピラミッド：直線の終点にジャンプ台を設置。
- 雪原アドベンチャー：8の字型の立体交差構造を採用。
本格的な開発の前に、コース形状をスクリプトで俯瞰図として生成し、カーブの配置と交差点を確認しています。
始める前の準備
ローカルでビルドするには、npm とNode.jsスクリプトを実行できる環境が必要です。リポジトリにはnode_modules/とdist/が保存されていないため、ソースコードをクローンまたはダウンロードした後、プレイしたいゲームごとに依存関係をインストールしてビルドを実行する必要があります。
3つのサブプロジェクトは独立しているため、1つだけビルドすることも、順番にすべてビルドすることもできます。主な依存関係はThree.jsとesbuildです。
リポジトリ構成
pelican-bike/
src/
index.template.html
build.mjs
package.json
cf-transport-ship/
src/
build.mjs
package.json
qq-speed/
src/
build.mjs
wrangler.jsonc
package.jsonpelican-bike/src/には、ペリカン、自転車、海、魚、空、エフェクト、オーディオなどを扱う11個のモジュールが含まれています。cf-transport-ship/src/には、マップ、銃器、武器、ボット、プレイヤー、物理演算、FPS用武器モデルをカバーする18個のモジュールがあります。qq-speed/src/には、車両、コース、レイアウト、AI、マップ、アイテムに関する15個のモジュールがあります。
インストールとビルド
方法1：ペリカン・バイクをビルド
cd pelican-bike
npm install
node build.mjs方法2：クロスファイア・輸送船をビルド
cd cf-transport-ship
npm install
node build.mjs方法3：QQスピードをビルド
cd qq-speed
npm install
node build.mjs各プロジェクトのビルドが完了すると、成果物は対応するディレクトリ内のdist/index.htmlに書き込まれます。リポジトリに記載された方法では、このファイルをブラウザで直接開いてプレイできます。
3つのビルド成果物のサイズは約700 KBから840 KBです。JavaScriptはHTMLにバンドルされているため、実行時にゲームモデル、テクスチャ、効果音のリソースを追加で読み込む必要はありません。
基本的な利用手順
- 3つのサブディレクトリからゲームを1つ選びます。
- 対応するディレクトリに移動し、
npm installを実行します。 node build.mjsを実行します。dist/index.htmlが生成されたことを確認します。- そのファイルをブラウザで開きます。
- ゲームの種類に応じてキーボードまたはタッチ操作でプレイを開始します。
ソースコードの確認や再ビルドをせず、すぐにプレイしたいだけであれば、Cloudflare PagesまたはCDNにデプロイ済みのオンラインURLを直接開くこともできます。
単一ファイルのビルド方式を理解する
ここでいう「単一ファイルHTML」とは、最終ページでバンドル済みのJavaScriptをHTMLにインライン化する方式です。src/は開発と保守をしやすくするため、機能ごとに複数のモジュールへ分割されています。build.mjsを実行すると、esbuildがこれらのモジュールをブラウザで実行可能な成果物にまとめます。
ペリカンのプロジェクトでは、index.template.htmlをページテンプレートとして使い、ビルド時にバンドル済みのJavaScriptとog:imageを注入します。リポジトリにはソースファイルだけがコミットされているため、ソースコードを変更した後は、ビルドスクリプトを再実行して新しいdist/index.htmlを生成する必要があります。
発展的な読み方とデバッグのヒント
モジュールから機能を特定する
コードを読む際、完成したビルド成果物から始める必要はありません。まずはディレクトリ内のモジュール名から機能を特定できます。たとえばペリカンのプロジェクトでは海、空、オーディオ、エフェクトのモジュールを確認し、FPSプロジェクトでは銃器、ボット、プレイヤー、物理演算のモジュールを、レースプロジェクトでは車両、コース、AI、マップレイアウトを確認します。
変更後は必ず再ビルドする
開発時はdist/index.htmlを主要なソースコードとして扱わず、src/内のソースファイルを変更してください。変更が完了したら、もう一度次を実行します。
node build.mjsdist/はリポジトリに含まれていないため、リポジトリを再クローンした場合や作業ディレクトリを消去した場合も、再度ビルドが必要です。
長時間の安定性を確認する
リポジトリの記録によると、ペリカンゲームでは完全な昼夜サイクルをカバーするため、320秒間の早送りによる連続稼働テストを実施し、ジオメトリ数、テクスチャ数、JavaScriptヒープメモリが安定しているかを観察しました。また、走行距離36キロメートルの剰余境界も個別にテストしています。
無限道路、昼夜システム、パーティクル、海面、テクスチャのロジックを変更した場合は、同様の方法を採用できます。ゲームを長時間実行してリソース数が増え続けていないかを観察し、走行距離、タイマー、ループアニメーションの境界値をテストしてください。
無効な数値がポストプロセスに与える影響を確認する
プロジェクトの公開後、まれに画面が黒くなる問題が発生しました。記録によると、NaNを注入して問題を再現した結果、Bloomポストプロセスが無効なピクセルを拡散させて黒い塊を生じさせていることが判明しました。修正方法には、ブルーム処理の前にクリア用パスを追加することや、海面のフレネル効果など、無効な数値の発生源を処理することが含まれます。
これは、シェーダー、海面、ライティング、ポストプロセスのコードを変更する際、構文エラーだけでなく、計算結果がNaNなどの無効な値を生成する可能性にも注意する必要があることを示しています。
操作と完全なゲームプレイを検証する
元のプロジェクトでは、ヘッドレスブラウザを使ってページの読み込み、実行時エラー、キー入力のシミュレーションを確認し、完全なゲームプレイも実行していました。ゲームロジックを拡張した場合は、トップページが表示されることだけでなく、起動フロー、キー入力への反応、勝敗条件、リセット動作、長時間実行時の状態を重点的に検証してください。
デプロイ時も単一ファイルの利点を維持する
ビルド成果物は独立したdist/index.htmlで、静的ページのホスティングサービスに適しています。リポジトリ内の3つのゲームはすでにCloudflare Pagesへデプロイされています。qq-speed/にはwrangler.jsoncのデプロイ設定も含まれています。実際に公開する前に、まずローカルでビルド成果物が正常に開けることを確認し、その後にプロジェクト作成、ドメインの紐付け、キャッシュ更新、証明書の状態確認を行ってください。
プロジェクトの範囲と説明
- 3つのゲームは、Claude Opus 5.5がClaude Code上で生成した能力テスト作品です。
- リポジトリの説明では、生成環境に1Mコンテキストとxhigh推論強度を使用しています。
- 各ゲームには要件プロンプトを1文だけ入力し、1回のセッションで完成させています。
- 『クロスファイア』と『QQスピード』関連のプロジェクトは、敬意を表した能力テストであり、原メーカーとは関係ありません。
- リポジトリに記載された生成時期は2026年9月です。
まとめ
claude-opus-5-5-demoは、1つのプロンプトから完全な3Dウェブゲームを生成した結果を示すとともに、検証可能なモジュール構成のソースコードと統一されたビルドフローを提供しています。任意のサブプロジェクトを選び、依存関係をインストールしてnode build.mjsを実行すれば、そのまま開ける単一ファイルHTMLを生成できます。さらに学ぶ際は、プロシージャルなリソース生成、ゲームモジュールの分割、長時間の安定性テスト、WebGLポストプロセスにおける異常値対策に注目するとよいでしょう。