11/14【実践プログラミング】Claude Codeでゼロから自分の作品を作ろう!開発の9ステップ

AIを使えば、これまで難しかったゲームやアプリも、自分のアイデアから作れるようになりました。

今回の実践プログラミングでは、Claude Code(クロードコード)を使って、自分だけのオリジナル作品をゼロから開発します!

ただし、いきなりAIに「ゲームを作って!」とお願いするだけでは、思いどおりの作品にならないことがあります。

大切なのは、何を作りたいのかを考え、計画を立て、少しずつ完成させていくことです。

この記事では、プロのシステム開発でも使われている考え方を取り入れながら、作品を完成させるまでの9つのステップを紹介します。

今回の開発で使うもの

  • Claude Code:AIと会話しながらプログラムを作る
  • Visual Studio Code(VS Code):プログラムやファイルを確認・編集する
  • Git(ギット):プログラムの変更履歴を記録する

開発環境はすでに準備されている前提で進めます。

GitHubなどのインターネット上のサービスは使わず、自分のパソコンの中でGitを使って管理します。


STEP 1:企画・アイデアを考えよう

何を作りたい?

まずは、自分が作ってみたい作品を自由に考えましょう。

例えば、こんな作品があります。

  • 敵を倒して進むアクションゲーム
  • 友達と競争できるタイピングゲーム
  • 自分だけのクイズアプリ
  • 勉強の予定を管理するアプリ
  • オリジナルのカードゲーム

最初から細かいところまで決める必要はありません。

「誰が使うのか」「どんなことができるのか」「どこが面白いのか」を考えてみましょう。

Claude Codeへの指示例

中学生です。オリジナルのゲームを作りたいと思っています。どんなゲームにするか一緒に考えてください。質問を1つずつしながら、アイデアを具体的にしてください。

AIにアイデアを提案してもらっても構いませんが、最後は自分で決めましょう。

このステップのゴール:作りたい作品のイメージが決まっていること。


STEP 2:要件定義をしよう

作品に必要な機能を考える

「要件定義(ようけんていぎ)」とは、作りたい作品にどんな機能が必要なのかを決めることです。

例えば、タイピングゲームなら次のような機能が考えられます。

機能優先度
画面に問題を表示する必須
キーボードで文字を入力する必須
正解・不正解を判定する必須
制限時間を設定する必須
得点を表示する必須
ランキングを保存するあとで追加
キャラクターを表示するあとで追加

最初からすべての機能を作ろうとすると、開発が難しくなってしまいます。

まずは、絶対に必要な機能だけで遊べる作品を完成させることを目指しましょう。

Claude Codeへの指示例

タイピングゲームを作ることにしました。必要な機能を一緒に考えてください。必須の機能と、あとから追加する機能に分けて整理してください。決まった内容はrequirements.mdというファイルにまとめてください。

このステップのゴール:必要な機能が整理され、requirements.mdが完成していること。


STEP 3:開発スタイル・技術方式を決めよう

どんな方法で作る?

同じゲームでも、作り方にはいろいろな方法があります。

例えば、Webブラウザで動くゲームにするのか、Pythonを使ったゲームにするのかによって、使用する技術が変わります。

ここでは次のようなことを決めます。

  • 作品の種類:Webアプリ、ゲーム、デスクトップアプリなど
  • 使用する言語:JavaScript、Pythonなど
  • 動作する場所:Webブラウザ、パソコンなど
  • データの保存方法:ファイル、ブラウザ内の保存機能など
  • 開発の進め方:AIにコードを書いてもらうか、自分でもコードを書くか

難しい技術を無理に選ぶ必要はありません。

Claude Codeへの指示例

この作品を作るための技術方式を3つ提案してください。それぞれのメリット、デメリット、開発の難しさを中学生にもわかるように比較してください。できるだけ簡単に開発できる方式をおすすめしてください。

AIの提案を比較し、自分の作品に合った方法を選びましょう。

このステップのゴール:使用する技術と開発方法が決まっていること。


STEP 4:プロジェクトとGitリポジトリを作ろう

開発を始めるための準備

作品専用のフォルダを作り、Gitでプログラムの変更履歴を管理できるようにします。

Gitは、プログラムの「セーブポイント」を作るような仕組みです。

変更した内容を記録することを**コミット(commit)**といいます。

Gitを使えば、開発中にプログラムがおかしくなったときも、以前の状態を確認したり、戻したりできます。

まずは作品のフォルダを作り、次のコマンドでGitの管理を開始します。

git init

このコマンドもClaude Codeに実行してもらえます。

CLAUDE.mdを作ろう

CLAUDE.md は、Claude Codeに開発のルールを伝えるためのファイルです。

例えば、次のようなルールを記載します。

  • 中学生にも理解できるシンプルな構成にする
  • 1つずつ機能を開発する
  • 大きな変更をするときは事前に説明する
  • 開発した機能は必ずテストする
  • 必要に応じて設計書やToDoを更新する

Claude Codeへの指示例

これからこのフォルダで作品を開発します。ローカルGitリポジトリを作成し、必要なフォルダ構成、.gitignore、CLAUDE.mdを準備してください。GitHubは使いません。中学生が学習しやすいシンプルな構成にしてください。既存のファイルを削除・上書きする場合は、必ず先に確認してください。

準備ができたら、最初のコミットを作成しましょう。

このステップのゴール:作品用のフォルダとGitリポジトリが完成していること。


STEP 5:仕様・設計をしよう

作品の仕組みを具体的に決める

「設計」とは、実際にプログラムを作る前に、どんな仕組みで動かすのかを考えることです。

例えば、ゲームなら次のようなことを決めます。

画面の設計

  • タイトル画面には何を表示する?
  • ゲーム中の画面はどんな見た目?
  • ゲーム終了時には何を表示する?

操作方法の設計

  • どのキーを使う?
  • マウスでも操作できる?
  • ゲームを途中でやめられる?

ゲームのルール

  • どうなったら得点が入る?
  • どうなったらゲームオーバー?
  • 難易度はどう変わる?

必要に応じて、紙に画面の絵を描いても構いません。

Claude Codeへの指示例

requirements.mdを確認して、作品の仕様と設計を一緒に考えてください。画面構成、操作方法、処理の流れを整理してください。決める必要があることは質問してください。完成した設計はdocs/design.mdにまとめてください。

※ファイルの保存場所は、実際のプロジェクト構成に合わせて調整しましょう。

このステップのゴール:作品の画面や動きが具体的に決まり、design.mdが完成していること。


STEP 6:ToDo・開発計画を作ろう

大きな作業を小さく分ける

いよいよプログラムを作る準備です。

ただし、すべての機能を一度に作るのではなく、小さな作業に分けましょう。

例えば、タイピングゲームなら次のような順番です。

  • タイトル画面を作る
  • スタートボタンを作る
  • 問題を表示する
  • キーボード入力を受け付ける
  • 正解・不正解を判定する
  • 得点を表示する
  • 制限時間を追加する
  • 結果画面を作る

このような作業リストを「ToDo(トゥードゥー)」と呼びます。

Claude Codeへの指示例

requirements.mdとdesign.mdを確認して、開発に必要な作業を小さなToDoに分けてください。簡単な機能から順番に開発し、途中でも動作確認できる計画にしてください。docs/TODO.mdにまとめてください。

このステップのゴール:開発する順番が決まり、TODO.mdが完成していること。


STEP 7:Claude Codeで開発しよう

1つずつ機能を作っていく

ここから実際にプログラムを作っていきます。

Claude CodeにToDoの作業を依頼し、プログラムを書いてもらいましょう。

Claude Codeへの指示例

TODO.mdを確認して、次の未完了タスクを1つ実装してください。実装後はテストを行い、何を変更したのか中学生にもわかるように説明してください。次のタスクには勝手に進まないでください。

機能が完成したら、必ず自分でも動かして確認しましょう。

開発の基本サイクル

① Claude Codeに機能を作ってもらう

↓

② 自分で動かして確認する

↓

③ 問題があれば修正する

↓

④ Gitにコミットする

↓

⑤ 次のToDoに進む

このサイクルを繰り返して、少しずつ作品を完成させます。

コミットするときは、何を変更したのかわかるメッセージを付けましょう。

例えば「タイトル画面を追加」「得点計算機能を実装」のようなメッセージです。

このステップのゴール:必要な機能が実装され、Gitに開発履歴が残っていること。


STEP 8:テスト・改善をしよう

AIが作ったプログラムは本当に正しい?

Claude Codeが「完成しました!」と言っても、必ず正しく動くとは限りません。

そこで必要になるのが「テスト」です。

例えば、タイピングゲームなら次のようなことを確認します。

  • 正しい文字を入力したら正解になる?
  • 間違った文字を入力したらどうなる?
  • 制限時間が0になったら終了する?
  • 何度もスタートボタンを押したらどうなる?
  • ゲームをもう一度遊べる?

普通の操作だけでなく、わざと変な操作をしてみることも大切です。

Claude Codeへの指示例

requirements.mdを確認して、まだテストできていない機能を洗い出してください。正常な操作だけでなく、間違った操作をした場合のテストも考えてください。自動で確認できるものはテストを実行し、自分で確認する必要があるものは手順を教えてください。

テストで問題が見つかったら、Claude Codeと相談して修正しましょう。

また、友達に使ってもらうと、自分では気づかなかった問題が見つかるかもしれません。

このステップのゴール:必要な機能が正しく動き、安心して遊んだり使ったりできること。


STEP 9:作品を完成させて発表しよう

自分の作品を紹介しよう

作品が完成したら、最後にREADME.mdを整理します。

README.mdには、次のような内容を書きましょう。

  • 作品の名前
  • どんな作品なのか
  • 遊び方・使い方
  • 工夫したところ
  • 開発中に苦労したところ
  • 今後追加してみたい機能

Claude Codeへの指示例

完成した作品の内容を確認して、README.mdを作成してください。作品の説明、使い方、主な機能、工夫した点をまとめてください。工夫した点など、私にしかわからないことは質問してください。

最後に、自分の作品を友達や先生に紹介しましょう!

どんなアイデアから始まったのか、どんな工夫をしたのか、開発中にどんな問題が起きたのかも発表できるとよいですね。

このステップのゴール:作品が完成し、自分の言葉で紹介できること。


まとめ:Claude Codeで作品を作る9ステップ

STEPやること主な成果物
1企画・アイデア作品のコンセプト
2要件定義requirements.md
3開発スタイル・技術方式技術構成
4プロジェクト・Git作成Gitリポジトリ・CLAUDE.md
5仕様・設計design.md
6ToDo・開発計画TODO.md
7Claude Codeで開発プログラム・コミット履歴
8テスト・改善テスト済みの作品
9完成・発表README.md・完成作品

大切なのは「AIに全部任せること」ではない!

Claude Codeを使えば、AIがプログラムを書いてくれます。

でも、どんな作品を作りたいのかを考えたり、AIが作ったものを確認したり、もっと面白くするために工夫したりするのは、みなさん自身です。

何を作るかは、自分で考える。

どう作るかは、AIと一緒に考える。

正しくできたかは、自分で確かめる。

これからのプログラミングでは、コードを書く力だけでなく、アイデアを形にする力、問題を解決する力、AIと協力する力が大切になります。

失敗しても大丈夫。Gitで変更履歴を残しておけば、前の状態に戻してやり直すこともできます。

さあ、Claude Codeと一緒に、世界にひとつだけのオリジナル作品を作ってみましょう!

コメント

タイトルとURLをコピーしました