🕹️

Amazon Q CLIでゲームを作ろう

に公開

この記事は以下のキャンペーンに参加しています。

日本語版 https://aws.amazon.com/jp/blogs/news/build-games-with-amazon-q-cli-and-score-a-t-shirt/

英語版 https://community.aws/content/2xIoduO0xhkhUApQpVUIqBFGmAc/build-games-with-amazon-q-cli-and-score-a-t-shirt

ゲームを作ろう

Amazon Q CLIを使用してAIコーディングでゲームを作るとTシャツがもらえるキャンペーンに参加しました。
自分はReactを用いてブラウザで動くぷよぷよ風のゲームを作ってもらいました。

Amazon Q CLIのインストール方法については以下を参考にしました。

https://docs.aws.amazon.com/amazonq/latest/qdeveloper-ug/command-line-installing.html

この後の作業については以下の環境で行なっています。

環境

macOS Sequoia 15.5
Amazon Q CLI 1.12.1
Volta 2.0.2(Node.js v24.2.0)

与えたプロンプト

プロンプトは以下のように設定しました。
コツとしては与えたプロンプトをコミットメッセージにしてgit commitすることを要求したので最悪ぶち壊れた時にロールバックできるようにしていました。(これは業務では人力でやった方がいいかもしれない、gitコマンドを使えるようにしちゃうといつか破壊しそう)

React.jsを使用して、ぷよぷよというゲームに似たゲームを作成してください。ぷよぷよではぷよと呼ばれるパズルのピースがありますが、それをAWSシンプルアイコンで作成してください。AWSシンプルアイコンのサービスの種類に応じて色が設定されていますのでその色が同じであればアイコンが消える仕様としてください。

ぷよぷよのルールを説明しますのでそれに従ってください。

* フィールドは基本的に縦12マス×横6マスの格子で構成される。格子の1マスにつき1個のブロック(ぷよぷよ、略してぷよ)を置くことができる。ただし、上方向は、画面外に1マス分だけぷよを置くことができる。
* 上からぷよが2つ1組で落下してくる(「組ぷよ」と呼ばれる)。ぷよは種類ごとに色が異なり、色は3-5色ある。プレイヤーはぷよに対して回転、横移動、高速落下のいずれかの操作を行う。
* 次に落下するぷよはフィールドの枠外に「NEXTぷよ(ネクストぷよ)」として予告される。
* 落下してきたぷよがフィールドの床やほかのぷよに衝突すると、その位置にぷよが固定される。ただし、組ぷよを横にして置いたりなどして、ぷよに1マス分でも下方向に空白がある場合は、強制的にそのぷよだけ落下する。
* 固定されたぷよと同色のぷよが周囲4方向(縦横のみで斜めではない)にいる場合、それらは互いにくっつく。
* ぷよが4個以上くっつくと消滅し得点となる。
* ぷよの消滅により上にあったぷよが落下する。このとき再びぷよが4個以上くっつくと消滅し、連鎖が起きる。なお、普通に4つ色を並べて消す行為のみでも1連鎖と考え、消滅した回数(○回)に応じて○連鎖と呼ばれる。複数色を同時に消した場合や同色を別箇所で消した場合でも、1連鎖扱いとなる。
* ぷよを消したときに入る得点は、消したぷよの数に、設定された「連鎖倍率」を掛けることで計算できる。
* ぷよが一番上の行、3列目にある×印に触れると「窒息」してゲームオーバーとなる。

ぷよの消滅により上にあったぷよが落下する。というルールが適切に守られていません。修正してください。

組ぷよを横にして置いたりなどして、ぷよに1マス分でも下方向に空白がある場合は、強制的にそのぷよだけ落下する。というルールが適切に守られていません。修正してください。

assetsフォルダに使用してほしいアイコンを設置しました。今後は色の変わりにアイコンが格納されているディレクトリが同じであるかどうかで判定してください。必要であればディレクトリとアイコンの対応を保存するためのjsonファイルを作成してください。

アイコンが正常に読み込まれていません。修正してください。

README.mdを更新してください。

README.mdに記載されているAWSサービスカテゴリの数が間違っています。注意深く確認して再度作成してください。

public/assets/Arch_Artificial-Intelligenceを追加で使用するように修正してください。

README.mdに設定ファイルJSONの詳細な説明は不要です。シンプルに説明してください。

public/assets内の使用していないファイルを削除してください。

名称をAWSぷよぷよからAWS icons pazleに変更してください。

完成品

完成したゲームのスクショがこちらです。
UIの指定などはこちらからはしておらずCSSをAmazon Qが作ってくれたものをそのまま使っています。

ゲーム画面

できたこと、できなかったこと

できたこと

コーディングせずにゲームが出来上がった
今後はgit commitすることと命令することでバージョン管理も自動でできた

できなかったこと

ぷよぷよがセガのものだとは分かっていたがルールは理解していなかった
→これはルールをWikipediaからコピペしたらそのルールに則って作ってくれた
アセット類は取りに行ってくれなかったので別途手動で作業ディレクトリに置く必要があった

今後試してみたいこと

これをデプロイするまでに必要なものをCDKで記載してもらったりしてみて、公開するところまでできないかなと思っています。
何でもAIに任せることは今のところまだできない部分もありますが、ちょうどよく付き合っていければかなり開発者体験が良くなると思いますのでまだ試していない方はぜひ一度試してみてはいかがでしょうか。

Discussion