はじめに
「Amazon Q CLI でゲームを作ろう Tシャツキャンペーン」にエントリーしました。生成AIを使ったゲーム作成です。
作成したゲーム
小鳥のメイメイが、世界中に配達をするゲームです。国境なし、相互関税なしです！
日、英、中の３言語に対応しています。この画像クリックで、ゲームができます。
配達先は3か所から選びます。寄り道をして、配達を受けることもできます。
都市名の知識と運が必要です。
GitHubでホスティングしました。
ソースコード
先に感想
Amazon Q Developerにハマっています。楽しいです。
今回は、応募のためにFreeモードを使用しました。
途中で今月分の無料枠を使い切ったようです。そのため、修正したい点やバグをたくさん残したままです。途中ですがゲームが動作するところまでは作成できましたので、Tシャツプレゼントに応募します。
Tシャツ応募のためのルール
ルールをおさらいします。引用も記載します。
-
使用する生成AIはAmazon Q Developer Freeモードのみ
AWS Builder ID に登録し、このリンクから独自の community.aws ユーザー名を取得してください。 -
ゲームエンジンは使って良い。プラットフォームはなんでも良い。
PyGame または他のゲームライブラリをラップトップにインストールしてください。 -
チャットのプロンプト指示だけ使える。
他の生成AIを使ったり、外部で生成したコードや画像などコンテンツの持ち込みはNGとする。
Amazon Q CLI とのチャットセッションを開始し、チャット内のプロンプトだけでゲームを作成しましょう。 -
MCPは使って良い。
特に記載が無いので、使用します。Amazon Q Developerも対応していますし、今どき使わない開発は無いでしょう。
オリジナリティを持ったゲームを作ります！
作成計画
次の手順で進める計画です。
- ゲームの基本を作成
- タイトルとゲームモードを作成
- キャラクター画像のスプライトを作成
- 効果音、BGMを作成
Webアプリをプラットフォームに選びました。
準備
次のMCPを組み込みました。
- AWS MCPのCore MCP Server
プロンプトを深く理解する - AWS MCPのAmazon Nova Canvas MCP Server
画像生成
- Microsoftのplaywright
Webアプリの画面確認用
- fetch
Webアクセス確認用
1. ゲームの基本を作成
まずおおまかにゲームを作ります。
かわいい小鳥のメイメイが、世界の都市に物を配達するゲームを作ります。
3分間でどれだけ配達できるかを競います。
メイメイは白ベースの可愛い小鳥です。
まず、スタートの都市で3つの配達先を提案されます。1つを選んで配達をします。
3つの都市の報酬が、近い順に$100,$300,$800です。都市に到着すると、新たに配達を依頼されます。
配達先は、世界の主要都市100都市ほどです。
メイメイはカーソルで動作します。左右で回転、上下で5段階のスピードを切り替えます。
妨害する鳥がアタックしてきて、触れると5秒間足止めになります。画面外から現れて、画面に1~2羽いるようにしてください。
妨害する鳥は、基本的に動いていて、3種類いて、正確によって色違いです。赤はプレイヤーに向かってくる、黄色はランダムに飛んでいる、青は先回りしようとするなど、いい感じにしてみてください。
時々パワーアップアイテムが落ちていて、取ると10秒間スピードが2倍になります。
画面の3/4がプレイグラウンド、1/4が、HI-SCORE,SCORE,TIME,目的地が表示されます。
ゲームオーバーでスコア上位10位が表示されます。10位以内に入る場合は、エントリーできて、アルファベットと記号(-. )、3文字を入力できます。選択は左右とスペースで行います。初期状態は、1位1000点10位0点、名前はいい感じに入れてください。
html+js+cssで作ります。
背景はOpenStreetMapを使って、Leaflet.jsを使います。
必要に応じて、2Dのゲームエンジンを入れてください。
少しの手直しで、ゲームの基本機能が出来ました！
細かく指示をして修正していきます。早いうちに、フォルダ構成を整理させて、jsやcssを分割させた方がよいです。 ファイルの行数が大きくなると、うまくいかないことが増えます。
また、 README.mdに、機能やフォルダ構成を書かせます。 継続開発がやり易くなります。
早めにローカルでよいのでGitを活用した方がよいです。 指示がうまく伝わらずデグレしたり、AIが削除してしまったり、いろいろなことが起こります。慣れてくると指示だけでも軽減出来ますが、Gitに途中状態あると確実です。コミットは自分で実施しました。AIにコミットを許すと履歴が多くなりすぎます。ただ、AIはコミット履歴はしっかり書いてくれますので使い方次第です。
機能が思い通りになったら次のステップに行きます。
2. タイトルとゲームモードを作成
画像作成に、MCPのNova Canvasを使いました。いい感じにタイトルの絵ができました。
タイトル画面を作ります。Nova Canvasで作ってください。ポップで可愛いものにしてくだ
さい。多言語対応なので、画像には文字は入れないでください。淡色系で。
3. キャラクター画像のスプライトを作成
スプライト画像は直接出力が難しいので、SVGで作成して、pngに変換しました。Pythonを作成して実行させました。
キャラクターをスプライトにしてください。
画像はsvgで書いて、pngに変換してください。64x64くらいです。メイメイは、かわいくてポップなキャラクターにしてください。タイトル画面の鳥がメイメイです。飛んでいる姿は上から見た姿で、翼が羽ばたくアニメーションにしてください。動作は、メイメイも敵の鳥も、進行方向に向くようにしてください。cssでできると思います。
敵も同様に３色（青、赤、黄色）作成してください。悪い顔にはせず、可愛い鳥でよいです。
必要に応じて、JSの2Dゲームエンジンを使ってください。変換処理にPythonが必要なら、convertフォルダに実装してください。Pythonは.venvで実行してください。
あと、favicon.icoも同じ方法でいい感じに作ってください。
スプライトは作れるんですが、なかなか思ったようにならないです。かなり手直しを続けました。
生成AIの進化待ちか・・
ここでむりょうわくn上限に達したようです。少々手直しして、完了とします。スプライトは反映出来ませんでした。
"Maximum com.amazon.aws.codewhisperer.streaming.GenerateAssistantResponse reached for this month."
4. 効果音、BGMを作成
プロンプトを用意していました。中断したために、使用出来ていません。これもコツがあります。3分と書いていますが、もっと短いmidiになります。midiからmp3への変換は、ffmpegが使われます。インストールを許可する必要があります。
BGMを作ってください。メロディ、サブメロディ、伴奏の合計の長さがずれないようにしてください。
midを作ってmp3に変換してください。変換処理にPythonが必要なら、convertフォルダに実装してください。Pythonは.venvで実行してください。
ゲームBGMを3分くらい、のどかなメロディーです。ゲームオーバー画面のBGMを30秒くらい。ゲームオーバー画面っぽいメロディーです。
効果音は、選択、目的地到着、敵に当たった音など
タイトル画面でBGM、効果音のON/OFFを選択できるようにしてください。
おわりに
Amazon Q Developerはこれからも使っていきます！