2026年7月16日 木曜日
AI時短ラボ
活用· 約6

Claude Codeで初心者がゲームを作る手順──未経験から公開までの4ステップ

プログラミング未経験からClaude Codeでブラウザゲームを作り、Vercelなどで公開するまでの4ステップを解説します。実際にタワーディフェンス風とローグライクの2作を公開した筆者の経験から、AIが出す「動くが正しくない」ものへの向き合い方も正直に書きます。

Claude Codeで初心者がゲームを作る手順──未経験から公開までの4ステップ
執筆・編集:
目次

プログラミング未経験でも、Claude Code(ターミナルで動くAIコーディングツール)を使えば、ブラウザゲームを0から作って公開するところまで到達できます。ただし「一発で完成」ではありません。この記事では、実際に未経験から2作のゲームを公開した筆者の経験をもとに、注文→最短で動かす→現象で直す→公開という4ステップと、途中で必ずつまずくポイントを説明します。

・Claude Codeなら日本語の注文だけでゲームの土台が作れる。コードを自分で書く必要はない ・ただしAIは「動くが正しくない」ものを出すことがある。人間の仕事は遊んで検品すること ・公開はVercelなどの無料ホスティングで可能。未経験の筆者もこの流れで2作を公開した

Claude Codeとは何か──ターミナルで動くAIコーディングツール

Claude Codeは、Anthropicが提供するAIコーディングツールです。ターミナル(コマンドを打ち込む画面)で日本語の指示を書くと、ファイルの作成からコードの記述、動作確認までを一通り代行してくれます。「コードを書いてもらう」というより「作業ごと任せる」に近い使い勝手で、公式ドキュメントでも機能開発やバグ修正を任せられるツールと位置づけられています。

未経験でも本当にゲームが作れるのか

筆者の場合は作れました。プログラミング未経験の状態から、Claude Codeでタワーディフェンス風ゲーム(迫ってくる敵から拠点を守るジャンル)とローグライク(ランダム生成のダンジョンを探索するジャンル)を制作し、どちらもWeb上に公開しています。ただしAIに任せれば勝手に完成するわけではなく、「触って、違和感を伝えて、直させる」往復が制作の本体でした。

最初の題材選びは意見が割れるところなので、2案を併記します。

  • A案:ブラウザで動く小さなゲーム(HTML/JavaScript)。環境構築がほぼ不要で、ブラウザで開くだけで遊べます。初回はこちらが試しやすい構成です。
  • B案:ゲームエンジン(Unityなど)を使う本格構成。スマホアプリ化などを見据えるなら選択肢ですが、AIとの往復以外に覚えることが増えます。

手順は4ステップ──注文、最短で動かす、現象で直す、公開

筆者が2作で実際に回した流れは次の通りです。

ステップ1:雑でいいから完成形のイメージを言葉で注文する

「敵がだんだん強くなるタワーディフェンス風のゲーム。ブラウザで動くようにして」程度の、仕様書とは呼べないレベルの注文で構いません。細部はAIが仮決めしてくれるので、最初から完璧に書こうとしないのがコツです。

ステップ2:動くものを最短で出させて、まず触る

見た目やバランスの注文は後回しにして、とにかく遊べる状態を最短で出してもらいます。触ってみて初めて「自分が欲しかったもの」との差が分かるからです。

ステップ3:直してほしい点を「現象」で伝える

コード用語は不要です。「敵が画面の外に出ていく」「ボタンを連打すると固まる」のように、画面で起きている現象をそのまま書けば、原因の特定と修正はClaude Code側がやってくれます。

ステップ4:Vercelなどの無料ホスティングで公開する

ブラウザゲームなら、Vercelなどの無料ホスティング(作ったものをWeb上に置いて公開できるサービス)にアップするだけで、URLを人に共有できます。GitHub Pagesなども選択肢です。公開前に確認しておきたい項目はVercelデプロイ前チェックリストにまとめています。

最大のつまずき:AIは「動くが正しくない」ものを出す

制作中いちばん注意したいのがここです。Claude Codeは、エラーなく動くけれど仕様として間違っているもの──当たり判定がずれている、特定の条件でスコアが増えない、といった状態──を出すことがあります。コードが読めない非エンジニアにできる検品は「実際に遊ぶこと」です。遊んで、おかしい現象を言葉にして返す。この役割は今のところ人間側にあります。なお、動作確認の様子を録画で残したい場合は、Playwrightで録画するとカクつく問題も参考にしてください。

筆者の現場から

未経験でも2作公開できましたが、AI任せで一発完成だったわけではありません。「触って、違和感を言葉にする」往復こそが制作の本体でした。逆に言えば、その往復さえ続ければ、コードが読めなくても完成まで行けた、というのが正直な実感です。

正直な但し書き

  • Claude Codeの利用には原則としてClaudeのサブスクリプションまたはAPI課金が必要です。最新の料金・条件は公式ドキュメントで確認してください。
  • 本記事の手順はブラウザゲーム前提です。スマホアプリや3Dゲームでは必要な知識も難易度も変わります。
  • AIの出力は毎回同じではありません。同じ注文でも筆者と違う結果になる可能性があります。
  • 「未経験でも作れた」は筆者個人の体験であり、誰でも同じ期間・品質で作れることを保証するものではありません。

出典

シェア: ポスト はてブ

出典・参照資料

AIニュースの解説を動画でも

YouTubeでは注目ニュースの背景を解説し、Xでは新着記事をお知らせしています。

コメント

まだコメントはありません。最初のコメントを書いてみませんか?

AIについて聞きたいことはありますか?

質問箱で無料で受け付けています。回答は公開され、他の方の参考にもなります。

質問箱を見る →

関連記事