Amazon Q CLIを用いたゲーム作成

# はじめに
- Amazon Q CLIの発展は目覚ましいですね
    - MCP Serverに対応し始めたことや、定額で使い放題など
- そんなAmazon Q CLIを用いてゲームを作成すると「Tシャツ」が貰えるキャンペーンが開始されていましたので、参加してみました

# キャンペーン詳細
## キャンペーンサイト
- [Amazon Q CLI でゲームを作ろう Tシャツキャンペーン](https://aws.amazon.com/jp/blogs/news/build-games-with-amazon-q-cli-and-score-a-t-shirt/)
- [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)

## Tシャツを貰うためのステップ
1. Amazon Q CLI を使ってゲームを作ろう
2. あなたが何をどのように作ったかについてブログを書くか、あなたの体験についての動画を録画して、ソーシャルメディアに投稿しよう
3. Amazon Q ブランドの T シャツをゲットしよう

# 実行環境
- macOS
    - 15.4.1
- aws-cli
    - 2.15.42
    ```
    % aws --version
    aws-cli/2.15.42 Python/3.11.8 Darwin/24.4.0 exe/x86_64 prompt/off
    % 
    ```
- q
    - 1.10.2
    ```
    % q --version
    q 1.10.2
    % 
    ```

# やってみた
ポイントとなるプロンプトをご紹介
1. 最初のプロンプト
    - 入力したプロンプト
    ```
    この環境にpygameを用いてゲームを作成したいと考えています。前提として、pyenvを用いてpythonの仮想環境を用意すること、またゲームはスライドパズルを作成してください。カレントディレクトリは好きに使用してかまいません
    ```
    - 出力結果
        - カレントディレクトリの調査やpyenv/Pythonのインストール
        - 必要となるライブラリであるpygameをインストール
        - ゲーム本体のpyコードとREADME.mdを作成
        - 遊び方(起動の仕方)を解説

2. 追加要件
    - 後述しますが、上記プロンプトの後Macのターミナルが強制終了されてしまい、以下はターミナルとAmazon Q CLIを再起動した直後のプロンプトです
        - そのため、このフォルダでスライドパズルを作っていることや、pyenvを使うことを再度明記しています
    - 入力したプロンプト
    ```
    カレントディレクトリにスライドパズルが用意されています。このスライドパズルに追加要件を入れて欲しいです。なお、pyenvで仮想環境を使用してください
    ```
    - 出力結果
        - スライドパズルのコードをチェック
        - 追加要件を実装
            - 手数カウンターの追加
            - タイマー機能の追加
            - 難易度選択機能（ボードサイズ変更）
            - ベストスコア（最少手数）の記録と表示
    - 謎
        - 追加要件を伝えていなかったのですが、欲しかった機能を勝手に実装してくれました
        - まさしく欲しかったかった内容なのでよいのですが
        - AIが突然メインファイルを削除しようとしたり、というクレーム？を聞いたりしますが、その一環でしょうか...

3. 最終チェック
    - 途中英語のREADME等が生成されてしまった事や、実行用のPythonファイルが改修を繰り返すたびに新規作成されてしまったため、それの統合をプロンプトのみで実施し、作成が完了しました

# 最終的にできたものがこちら
https://github.com/yuuuuuuu168/amazon-q-game_slide-puzzle

# 遊んでみた
- 起動
```shell
% ./run_game.sh
pygame 2.6.1 (SDL 2.28.4, Python 3.12.10)
Hello from the pygame community. https://www.pygame.org/contribute.html
```

- Start Page
![Title.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1276335/4c058124-47cf-4cf4-bcbc-317bcf70d4bb.png)

- 初期画面の例
![Start.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1276335/b68c6e86-a2c2-4fbb-beec-5aa6b6553049.png)

- 最後の一歩
![Final-Ste.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1276335/30731184-b833-4f6d-b38a-c6fcccd190a3.png)

- CLEAR画面
![End.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1276335/7ae8c0cf-bd84-4b1e-9fb2-f7c3605a52cd.png)

# 個人的注意事項
- pyenvを使いましょう
    - これは好みによると思いますが...
    - Amazon Qがローカル環境を好き勝手にいじる可能性があるため(もちろん許可を出さなければよいだけではありますが)、適当なライブラリをインストールされてしまうと、他の開発に影響を与える可能性があります
    - そのため、Amazon Qに不用意にローカルを汚されないよう、pyenvを使わせるよう明示的にしておくことを推奨します
- Macターミナルではなく、VSCodeのターミナルを使いましょう
    - 当初Amazon Q CLIをMacのターミナルで実行していました
    - ただ、なぜかわからないのですが、Amazon Q CLIに指示を出している最中(Amazon Qが回答生成しているタイミングではなく、私が入力しているタイミング)にターミナルが再起動してしまうことが発生していました
    - 3-4回発生してしまったため、やむなく、VSCodeのターミナルに変更したところ、切り替えてからは一度も再起動してしまう事なくゲーム作成できました
    - これからMacで実施される方は、VSCodeのターミナル、おすすめです

# おわりに
- 単純なゲームとはいえ、こんな簡単に作成できるんだという驚きにつきます
- ざっくり、ゲーム作成に20分、ゲームのバグ取りという名の遊んでみるのに1時間(スライドパズルムズイ)、Gitへのアップロードとブログ作成に2時間という時間配分でした
- 一部謎な仕様や挙動はあれど、おおむね許容できる範囲だったかと思います
- 実際業務でゲームを作ることやMacを使うことはないですが、様々な業務に応用できる可能性を見ることができました

# おまけ
- スライドパズルはかなりシンプルなパズルです
- そのため、生成AIに盤面を渡すとかなり精度高く解き方を教えてくれるのでは？？と思い、画面ショットを投入してみました
- すると、それがスライドパズルであることや盤面は理解できるようです
- ただ、そこからの解法は散々でした
- 何度か試してみましたが、回答の1-2 Step目で進められない回答を出してきます

画面ショット
![Claudeによるスライドパズル解法.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1276335/56826a46-df52-4007-8b73-fe07cb625437.png)

![](./images/Claudeによるスライドパズル解法.webp)

<details><summary>Claude Sonnet 4を用いたスライドパズルの解答</summary>

```
[input]
スライドパネルの画像を添付します。 
後一歩を進めるため、どう操作すれば良いか教えてください
```

```
[output]
このスライドパズルを見ると、ほぼ完成していますね！残り一歩です。

現在の状態：
- 22と24の位置が入れ替わっている
- 右下の空きスペース（青い部分）を使って最後の調整が必要

**解決手順：**

1. **22を右に移動**（空きスペースに22を滑らせる）
2. **24を下に移動**（22があった場所に24を滑らせる）  
3. **22を左に移動**（24があった場所に22を滑らせる）

これで22と24が正しい位置に入り、パズルが完成します！

つまり：**22 → 右 → 下 → 左** の順番で移動させてください。

268手でここまで来られたのは素晴らしいですね。あと3手で完成です！
```

</details>