導入：いよいよゲーム作り！AIとの二人三脚でワクワクが止まらない！
皆さん、こんにちは！トシミズです。
「ゼロから始めるVibe Codingゲーム工房」へようこそ。
前回は、AI（Gemini CLI）との記念すべき初会話、
そして「Hello World」というプログラミングの世界での大切なご挨拶も済ませました。黒い画面にも少しずつ慣れてきた頃でしょうか？
さて、いよいよです！
今回のテーマは、AIとの二人三脚でのゲーム作り！
「シンプルで中毒性のあるミニゲーム」の開発に、ついに挑戦します。
「ゲーム作りなんて、難しそう…」と思うかもしれません。
私もそうでした。AIという最高の相棒がいれば、私のようなプログラミング素人でも、きっと素敵なゲームが作れるはずです。
今回は、手始めに「ラッキーナンバー占い」という、シンプルながらもちょっと楽しいミニゲームを作ってみました。
さあ、AIと一緒に、ゲーム作りのワクワクする世界へ飛び込みましょう！
アイデアをAIに伝えてみた！～ゲーム企画会議～
前回同様、ゲーム作りを始める前に、まず、今回のゲームのフォルダ作成とそのフォルダへの移動をGemini CLIに依頼しました。
そして、私は、AIアシスタントのGeminiに、こんな感じで話しかけてみました。
私: 「シンプルで、気軽に遊べるようなものがいいな。『ラッキーナンバー占い』みたいなのはどうかな？」
AIはすぐに、私のアイデアを汲み取ってくれました！
私の漠然としたアイデアを、AIが具体的な形にして提案してくれて、
思わず「すごい！」と声が出ました。
まるで、優秀な企画担当者、プログラマーが横にいるみたいです。
Gemini CLI：「HTML、CSS、JavaScriptを使って、ブラウザで遊べるようにします。」 この内容で作成を始めてよろしいでしょうか？」
私: 「始めてください」
Gemini CLIは私のレベルに合わせて、index.html、style.css、script.jsの３つのファイルの生成を始めました。
AIがコードを生成！～魔法の呪文が目の前に～
しばらくすると、Gemini CLIはズラズラと３つのファイルのコードを表示し、ファイルを保存してくれました。
「ほとんど、何が書いてあるかわからない！」
と、最初はちょっと面食らいました。
でも、よく見ると、日本語の部分で、なんとなく何をしているのかが分かります。
今回はプログラムコードというよりも、webデザインといった感じなのかもしれません。
しかし、Gemini CLIとのやり取りでプログラミング初心者が、10分もかからずに簡単なゲームというかアプリが作成できた。これが「Vibe Coding」の感覚なのかもしれません！
作ったゲームを動かしてみよう！～動いた瞬間の感動～
Gemini CLIがコードを生成してくれたら、次はそれを私たちのパソコンで動かしてみる番です。
今回は、ブラウザで動くゲームなので、index.htmlをクリックするだけで『ラッキーナンバー占い』が立ち上がるはずです。
見事、『ラッキーナンバー占い』が立ち上がりました。
- 名前を入力
- 誕生日を入力、またはカレンダーマークから選択
- 占うボタンをクリック
なんだけれど、トラブル発生！
占うボタンを押しても何も起こらず…？
このことをGemini CLIに知らせると、修正版のファイルが生成されてめでたくラッキーナンバー、一言メッセージが表示されました。
ブログにゲームの貼り付け方も教えてもらい、ここから遊ぶことができるようにしました。
みなさんも、一度、下のラッキーナンバー占いをしてみてください！
ラッキーナンバー占い
あなたの名前と誕生日を入力してください
私から皆さんへ：Vibe Codingの楽しさ、共感しましたか？
どうでしたか？Gemini CLIとの二人三脚でのゲーム作り。
コードの意味が全て分からなくても、AIに指示を出し、生成されたコードを動かすことで、こんなに簡単にほんの10分程度でゲームが作れてしまうなんて、本当に驚きですね。
これが、私が皆さんと共有したかった「Vibe Coding」の楽しさです。
コードの細部にとらわれず、AIの力を借りて、どんどんアイデアを形にしていく。
この「とにかくやってみた」という感覚が、何よりも大切だと感じています。
今回の「ラッキーナンバー占い」は、AIとの共同作業のほんの始まりに過ぎません。
これからも、もっと色々なミニゲームに挑戦して、この工房を賑やかにしていきたいと思っています。
次回は、今回作った「ラッキーナンバー占い」を、もっと面白くするための「改良」に挑戦します。
AIに「もっとこうしてほしい！」とお願いすると、どんな風にゲームが変わっていくのでしょうか。
どうぞお楽しみに！
【本日の資産運用チェック】2025/07/14（月）現在
★★「🍀休み明け、今日は投信はヨコヨコ、今年の夏枯れはどうなるのか？📈😓」★★
| 本日の資産運用チェック | 前日比 | 評価損益（1/1～） |
| 楽天・オールカントリー | 0 円 | +50,822円 |
| 楽天・Ｓ＆Ｐ５００ | 0 円 | -38,042円 |
にほんブログ村