Claude Codeで、シューティングを作ってみる【AIでゲーム開発】
Claude Code に3行の文を1回頼むと、約2分でブラウザで遊べるシューティングが HTML ファイル1つでできました。敵の編隊を撃つと色の粒になって飛び散り、そのままこのページで遊べます。
完成したシューティングを遊んでみる
用意するもの
- 使った AI:Claude Code(2.1.280)
- モデル:Sonnet 5
- エフォート:指定していない(既定のまま)
- かかった時間:約2分
Claude Code に頼んだ文
空のフォルダで Claude Code を開き、日本語で次の文を1回だけ頼みました。
1回目に頼んだ文
ブラウザで遊べるシューティングゲームを HTML ファイル1つで作って。自機は画面下を左右に動き、スペースキーで弾を撃つ。敵は上部で編隊を組んで左右に動きながら降りてきて弾を撃ち返す。
敵に弾が当たると小さく爆発して消える演出をつけて。自機や弾の色は鮮やかにして、撃つ・当てるのが気持ちいい見た目にして。
敵を全部倒すとスコアが加算され、自機に敵の弾か敵本体が当たるとライフが1減り、ライフが0でゲームオーバー、Enterでやり直せるようにして。HTML ファイルが1つでき、ブラウザで開くとすぐに敵の編隊(4行×8列)が出て遊べました。左右キーで自機を動かし、スペースキーで水色の弾を撃つと、当たった敵は色の粒になって飛び散り、消えました。
敵を1体倒すごとに得点が入りました。敵は赤い弾を撃ち返し、自機に当たるとライフ(左上のハート)が1つ減り、ライフが0になると「GAME OVER」と得点が出て、Enterキーでやり直せました。編隊を全部倒したときの動きは、確かめた25秒のあいだには届かず、見ていません。
うまくいかなかったら
この作例では、動かないところは出ませんでした。開いても何も出ないときや、頼んだとおりに動かないところがあるときは、起きたことをそのまま書いて頼み直します。
画面に何も出ないとき
ブラウザで開いても画面に何も出ない。原因を探して直して。動きが頼んだとおりでないとき
弾が敵に当たっても消えないことがある。どんなときに起きるか調べて直して。次にやってみること
できあがったファイルがあるフォルダで、続けて1行を頼みます。完成品の写しに1回頼みました。
ハイスコアを残す
いちばん高いスコアを覚えておいて、ブラウザを閉じても次に開いたときに表示されるようにして。60秒遊んだあと、それまでのいちばん高い得点がブラウザに保存されていました。ページを読み直すと、画面の上部の中央に「HIGH SCORE」として保存された得点が出ました。
ここから本格的なゲームにするには
段階ごとに、1行の頼み方と、関わりのあるページを並べます。3は、完成品の写しに1回頼んだ結果も書きます。1と2は頼み方の例で、試していません。
1. 難易度の段階を増やす
難易度の段階
決めた点数を超えるたびに難易度の段階を1つ上げて、次の編隊から敵の行数を増やし、弾を撃つ間隔も短くするようにして。頼み方の例です(試していません)。段の組み立て方はレベルデザインにまとめています。
2. 効果音を自分で作ったものにする
自分で作った効果音
効果音を、自分で用意した音のファイルに差し替えられるようにして。頼み方の例です(試していません)。ブラウザだけで効果音を作れるツールにはjsfxrがあります。操作への反応を大きく見せる演出はジュースにまとめています。
3. itch.io で公開する
itch.io に上げる形にする
itch.io に上げられるように、このゲームを index.html という名前のまま1つの zip ファイルにまとめて。中に index.html だけが入った zip ファイルが1つでき、中の index.html は完成品と同じ中身でした。itch.io に上げるところは試していません。上げ方はClaude Codeで、初心者がブラウザゲームを作るの「itch.io で公開する」と、itch.ioのページにあります。
情報源
- Claude Code の始め方(Quickstart・Claude Code の公式ドキュメント)https://code.claude.com/docs/en/quickstart確認日 2026-09-24
- モデルとエフォートの設定(Model configuration・Claude Code の公式ドキュメント)https://code.claude.com/docs/en/model-config確認日 2026-09-24
- Claude Code(公式の製品ページ)https://claude.com/product/claude-code確認日 2026-09-24

