Amazon Q CLI でパズルゲーム作ってみた


## 0. はじめに

Amazonのサービスを便利に使ってますか？きっと使っていることかと思います（そういうことにしておきます）。

かくいう自分は、モバイルアプリの開発が中心で、インフラ側を触ることが少なくなっている日常です。昔はAWSの資格を取ったりもしてたんですけどね。

そんな中、同僚にAWSで下記のキャンペーンをやってるよ！と教えてもらったので、久しぶりにAWSのサービスに少し触ってみることにしました。

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


## 1. Amazon Q CLI を使用する準備

### 1.1. AWS Builder ID を取得

まず **AWS Builder ID** というのを取得する必要があります。久しぶりに触った人（自分）から見ると「なにそれ？」という感じですが、AmazonQを使用するのに必要なものらしいので、とりあえず取得しましょう。

下記のリンクから、取得できます。

https://community.aws/builderid

### 1.2. Amazon Q CLI をインストール

> Macを使用しているので、Macの場合の説明になります。

下記リンクに、Amazon Q CLI をインストールするファイル（.dmg）のリンクがあるので、クリックしてダウンロードします。ダウンロードしたら、ファイルを実行してインストールします。

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

### 1.3. Amazon Q CLI を起動

インストールしたアプリケーションを起動し、先ほど作成した **AWS Builder ID** を使ってログインします。ここまで来たら、準備完了と言えるでしょう。

ターミナルを起動して、`q chat`と入力してみてください。AmazonQとのチャットが開始されます。

```shell
% q chat

    ⢠⣶⣶⣦⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⢀⣤⣶⣿⣿⣿⣶⣦⡀⠀
 ⠀⠀⠀⣾⡿⢻⣿⡆⠀⠀⠀⢀⣄⡄⢀⣠⣤⣤⡀⢀⣠⣤⣤⡀⠀⠀⢀⣠⣤⣤⣤⣄⠀⠀⢀⣤⣤⣤⣤⣤⣤⡀⠀⠀⣀⣤⣤⣤⣀⠀⠀⠀⢠⣤⡀⣀⣤⣤⣄⡀⠀⠀⠀⠀⠀⠀⢠⣿⣿⠋⠀⠀⠀⠙⣿⣿⡆
 ⠀⠀⣼⣿⠇⠀⣿⣿⡄⠀⠀⢸⣿⣿⠛⠉⠻⣿⣿⠛⠉⠛⣿⣿⠀⠀⠘⠛⠉⠉⠻⣿⣧⠀⠈⠛⠛⠛⣻⣿⡿⠀⢀⣾⣿⠛⠉⠻⣿⣷⡀⠀⢸⣿⡟⠛⠉⢻⣿⣷⠀⠀⠀⠀⠀⠀⣼⣿⡏⠀⠀⠀⠀⠀⢸⣿⣿
 ⠀⢰⣿⣿⣤⣤⣼⣿⣷⠀⠀⢸⣿⣿⠀⠀⠀⣿⣿⠀⠀⠀⣿⣿⠀⠀⢀⣴⣶⣶⣶⣿⣿⠀⠀⠀⣠⣾⡿⠋⠀⠀⢸⣿⣿⠀⠀⠀⣿⣿⡇⠀⢸⣿⡇⠀⠀⢸⣿⣿⠀⠀⠀⠀⠀⠀⢹⣿⣇⠀⠀⠀⠀⠀⢸⣿⡿
 ⢀⣿⣿⠋⠉⠉⠉⢻⣿⣇⠀⢸⣿⣿⠀⠀⠀⣿⣿⠀⠀⠀⣿⣿⠀⠀⣿⣿⡀⠀⣠⣿⣿⠀⢀⣴⣿⣋⣀⣀⣀⡀⠘⣿⣿⣄⣀⣠⣿⣿⠃⠀⢸⣿⡇⠀⠀⢸⣿⣿⠀⠀⠀⠀⠀⠀⠈⢿⣿⣦⣀⣀⣀⣴⣿⡿⠃
 ⠚⠛⠋⠀⠀⠀⠀⠘⠛⠛⠀⠘⠛⠛⠀⠀⠀⠛⠛⠀⠀⠀⠛⠛⠀⠀⠙⠻⠿⠟⠋⠛⠛⠀⠘⠛⠛⠛⠛⠛⠛⠃⠀⠈⠛⠿⠿⠿⠛⠁⠀⠀⠘⠛⠃⠀⠀⠘⠛⠛⠀⠀⠀⠀⠀⠀⠀⠀⠙⠛⠿⢿⣿⣿⣋⠀⠀
 ⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠀⠈⠛⠿⢿⡧


╭─────────────────────────────── Did you know? ────────────────────────────────╮
│                                                                              │
│      /usage shows you a visual breakdown of your current context window      │
│                                    usage                                     │
│                                                                              │
╰──────────────────────────────────────────────────────────────────────────────╯

/help all commands  **•**  ctrl + j new lines  **•**  ctrl + s fuzzy search

━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
```

ちなみに、チャットを終了するときは `/q` です。

```
> /q
```


## 2. ゲームを作ってみよう（テトリス編）

### 2.1. Amazon Q 編

まずは難しく考えず、簡単な命令だけで動いてくれるかを試してみます。**「テトリスを作ってください」** と命令してみます。

```
% q chat

...(省略)...

> pygameでテトリスを作ってください
```

**Thinking...** と表示されるので、しばらく待ちます。

2〜3分待つと、**tetris.pyを生成できたので実行してみてください。** と表示されました。
早速、実行してみます。

```shell
% python tetris.py
```


![スクリーンショット 2025-06-03 22.54.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/113289/d82eeacd-8b0b-4f64-82a2-738a6e902da3.png)

Mac上にアプリを起動し、画面が表示されました。
どう見てもテトリスです。本当にありがとうございました。

### 2.2. Gemini 編

いや言うても、これぐらいなら他のAIもやってくれるでしょ。と思ったので、試しにGemini（2.5 flash）へ同じ命令をしてみます。

すると、同じく `tetris.py` を生成してくれました。こちらも実行してみます。

![スクリーンショット 2025-06-04 23.04.15.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/113289/28c64a08-9716-4144-a043-ebef5b77660f.png)

Mac上にアプリを起動し、画面が表示されました。

たしかにテトリス・・・ですね。ただ、本当に最低限の機能と言った感じで、Amazon Q で作成したテトリスと比較すると物足りなさを感じます。

ゲーム作成に関しては、Amazon Q に軍配が上がりそうです。


## 3. ゲームを作ってみよう（パズルゲーム編）

### 3.1. Python編

オリジナルで、ちょっとしたパズルゲームを考えてみました。AIに流すことを考えて、下記にまとめてみました。

```txt: ゲーム仕様
パズルゲームを作成してください。

- pygameを使用してください。
- 使用するライブラリはrequirements.txtで管理してください。

# タイトル
  Attack15

# メイン画面
  - スタートボタンを押して、ゲームを開始します。
  - 終了ボタンを押して、アプリを終了します。

# ゲームについて
  - 1〜9のランダムな数字が書かれた9枚のパネルがあります。
  - 2枚以上のパネルを選択し、合計15になるようにする。
  - 選択したパネルを選択すると、非選択状態になる。
  - 合計15になったら、選択したパネルは削除されて、新たな数字がセットされたパネルがセットされる
  - 制限時間は1分
  - 各パネルは15秒経つとリセットされ、新しく1〜9のランダムな数字が書かれたパネルがセットされる

# ポイントについて
  - 合計15になるパネルを選択して、パネルを消すと、15ポイントプラスされる
  - パネルが15秒経ち、リセットされると10ポイントマイナスされる
```

ざっくり説明すると、
1〜9の数字が書かれたパネルから、合計15になるようにパネルを選択していくゲームです。

早速、Amazon Q CLI に流して、作ってもらいましょう。`q chat`でチャットを起動して、上記をコピペしてみます。

すると、テトリスの時と同様に、2〜3分ほどで作ってくれました。起動して遊んでみます。

![output.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/113289/87895854-a428-4ab6-855f-f0ba870ab89f.gif)

想定通り、もしくはそれ以上のゲームを作ってくれました。各パネルの制限時間のゲージなど、伝えていない部分も察して作ってくれています。

自分で作っておいてなんですが、動画の動きが雑魚すぎるのは無視してください。（泣）

### 3.2. web編

pythonを使ってゲームを作ることはできましたが、他の言語だとどうでしょうか。今度は同様のブラウザゲームを作ることが出来ないか試してみます。

先ほど作成したゲーム仕様で、3〜4行のpythonを使用する文言を削除して、下記を追記してみます。

```txt: ゲーム仕様（追記部分）
- ブラウザで動作させたい。
```

これで、`q chat`でチャットを起動して、同じように作ってみます。

しばらくすると、`index.html`, `style.css`, `script.js` を作成してくれました。
作成されたhtmlファイルをブラウザで起動してみます。

![output1.gif](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/113289/17057f1e-e75b-4056-a167-9533abf0b067.gif)

こちらも、ちゃんと動いています。ブラウザで動かすゲームも簡単に作ってくれそうですね。

ただこちらはゲージを実装してくれませんでした。まあ、仕様に書いてないので、問題はないですが、実装の度にどういったゲームが出来るかは多少ムラがありそうです。

### 3.3. Flutter編

さらにハードルを上げて、モバイルアプリを作ってもらいましょう。
果たしてできるのか・・・、再度ゲーム仕様の頭の部分を変更して、試してみます。

```txt: ゲーム仕様（追記部分）
- Flutterでモバイルアプリを作成してください。
```

ゲーム仕様を変更したら、Amazon Q CLI で命令してみます。

```shell
🛠️  Using tool: execute_bash
 ⋮ 
 ● I will run the following shell command: 
mkdir -p attack15 && cd attack15 && flutter create .
 ⋮ 
 ↳ Purpose: Creating a new Flutter project named attack15
```

おおお！`flutter create`してFlutterプロジェクトを作ろうとしている！！

```shell
bash: flutter: command not found

 ⋮ 
 ● Completed in 0.18s
It seems Flutter is not installed or not in the PATH. Let's check if we can create the project structure manually:
```

**orz**

いや、flutterコマンドがないはずはないし、PATHも通ってると思うが・・・、なんか制限かけられてる？？そもそもどんな環境で実行されてる？？

なんとかしたら出来そうな気がしないでもないですが、一旦ここで諦めます。このメッセージの後に、頑張って`main.dart`だけでも作ろうとしていました。


## 4. まとめ

なんやかんや、いろいろ試してみましたが、**Amazon Q CLI** を用いて簡単にゲームを作れることは間違いなかったです。

こちらからの質問は、日本語を対応してくれているとはいえ、返答はまだ英語がメインっぽく見えました。たまに日本語で返ってくることもありましたが、このあたりは曖昧でした。

作成したパズルゲームは、GitHubに公開してます。ぜひ遊んでみてください。

https://github.com/ponwink/attack15_game