0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

【Amazon Q CLI】プログラミングまったくできない私がゲームを作ってみました!

Posted at

はじめに

プログラミングがまったくできない私が今話題になっているキャンペーンに参加してみました!
(なんでも挑戦してみよう精神でえいや!で参加してます(笑))
Amazon Q CLI でゲームを作ろう

Amazon Q CLIを使ってプロンプトだけでゲームを作ります。
そしてキャンペーンに応募(ブログや動画をSNSに投稿)すればTシャツも貰えます!

作成するゲームの概要

とりあえず暇つぶし程度にできるゲームを作って見ようと思いましたが、パッと浮かばなかったので、ゲームの候補もAIに任せてみて、候補の中から選びました。

■ゲームの内容
複数マスの四角いマスがあってランダムマスで1マスだけ黒色に変わるので変わった色のマスをクリックして時間内に何マスクリックできたかを競うゲームです。
・難易度も選択できるようにしたい。

■特徴
・マウスクリックのみ
・難易度ごとにマスが増える
・難易度を選択できる
 →Easy:3x3
 →Normal:6x6
 →Hard:9x9

作業工程

①環境準備
②とりあえず初期バージョンをAmaozn Q CLIに依頼してみる
③動作させてみて気になった箇所をAmaozn Q CLIにフィードバックして修正してもらう
④追加機能を実装してもらう
⑤自分では浮かばなかった追加の機能についてAmazon Q CLIに聞いてみる
※Amazon Q CLIとのやり取りは日本語で行います。

①環境準備

■アカウントの取得
AWS Builder IDを持っていない方はリンクからcommunity.aws ユーザー名を取得する必要があります。

■Amazon Q CLIのインストール
Amazon Q CLIをインストールする前に、作業端末でWSLを有効化し、Linux環境をセットアップしました。
※WSL有効化の詳細な手順は割愛します。

①unzipのインストール
以下のコマンドを実行し、unzipをインストールします。

sudo apt install unzip

②Amazon Q CLIのモジュールのダウンロード
以下のコマンドを実行し、Q CLIのモジュールをダウンロードします。

curl --proto '=https' --tlsv1.2 -sSf https://desktop-release.codewhisperer.us-east-1.amazonaws.com/latest/q-x86_64-linux-musl.zip -o q.zip

lsコマンドで q.zipが存在していればOKです!
image.png

③q.zipを解凍
以下のコマンドを実行し、q.zipを解凍します。

sudo unzip q.zip

以下のように解凍が成功したらOKです!
image.png

④ディレクトリを移動
以下のコマンドを実行し、ディレクトリを移動します。

cd q

⑤権限の変更
以下のコマンドを実行し、権限を変更する。

sudo chmod +x install.sh

⑥Qのインストール
以下のコマンドを実行し、Qのインストールをする。

./install.sh

⑦以下のように表示されるためYesにてEnterキーを押す。
image.png

⑧以下のように表示されるため上の選択しにてEnterキーを押す。
image.png

以下のようにURLが表示されるめ、ブラウザ上にURLを入力する。
白塗り部分は、ユーザごとに異なります。
image.png

Builder IDのログインを求められるので、ログインし、Amazon Q Developerのアクセスを許可し、リクエストが承認されたらOKです!
image.png

承認後、プロンプトが以下のようになっていればOKです!
image.png
ここで一旦OSの再起動を実施してください。

⑨Qの起動
再起動後、再度プロンプトを起動し、WSLqの順番で入力し、画像のようになればOKです。
image.png

⑩PYGAMEのセットアップ
以下のコマンドを実行し、PYGAMEをインストールする。

py -m pip install -U pygame --user

以下のようになっていればOKです!
image.png

環境の準備はこれで完了です!後続でAmazon Q CLIとのチャットを実施しましょう!

②とりあえず初期バージョンをAmaozn Q CLIに依頼してみる

Amazon Q CLIを起動し、最初に下記プロンプトで作ってもらいました。

以下が実際のプロンプトです。

日本語で会話しながら一緒にゲームを作成しましょう。
まずは前提条件です。
 ①PYGAMEで動くゲームをつくる
 ②ファイルは表示ではなく出力 でお願いします。
次はゲームの仕様です。
複数マスの四角いマスがあってランダムマスで1マスだけ黒色に変わるので変わった色のマスをクリックして時間内に何マスクリックできたかを競うゲームです。

プロンプトを実行後、ゲームは作成してくれましたが、実行環境が整っていないからゲームを起動できない旨をAmazon Qから返してきてプロンプトが停止しました。
ここで驚いたのは、ゲームが起動できるように足りないものをインストールしてくれと雑にお願いしたところ、ゲームを起動するために必要なものをAmazon Qがエラーチェック・インストール・修正・テストまでやってくれました… すごいですよね…

以下にゲームが起動できるまでのトラブルシュートのスクショを載せておきます。
画像①:ゲーム作成
image.png

画像②:トラブル(Pythonコマンドが見つからない)
image.png

画像③:トラブル(PYGAMEがインストールされていない)
※Pythonに詳しくないため、なぜ準備したはずのPYGAMEがなかったのか不明でした。
※PythonとPython3では違う???
image.png

画像③:トラブル(pipがインストールされていない)
image.png
image.png
image.png
image.png

トラブルを乗り越えて出来上がったゲームは以下です!
image.png

初期バージョンとしては文句なしの出来上がりできたが、文字化けしていました。

③動作させてみて気になった箇所をAmaozn Q CLIにフィードバックして修正してもらう

とりあえず以下をフィードバックしてみました。
①文字化けの修正(日本語にしてほしい)
②Easyレベルとして、3x3で制限時間を10秒にしてほしい。

以下が実際のプロンプトです。

作成ありがとうございます!初期バージョンとしては良いと思います!
ですが、より良いものを作成するために改善点をお伝えしますので、修正してください。
①文字化けの修正(日本語にしてほしい)
②Easyレベルとして、3x3で制限時間を10秒にしてほしい。

基本的に、改善点を伝える→動作確認を繰り返しました。

色々改善を繰り返してみて、最終的に以下のようになりました。
image.png
文字化けは直らなかったので、英語版にしてもらいました。
Easyレベルとして、3x3で制限時間を10秒にしてほしい。という要望には答えてくれました!
これでも十分すごいですよね!

④追加機能を実装してもらう

最終形として以下の機能を実装してみたいのでAmazon Q CLIに依頼しました。
①タイトル画面の追加
②難易度の追加
 →Easy:3x3
 →Normal:6x6
 →Hard:9x9
③見た目向上
④ハイスコア機能

以下が実際のプロンプトです。

ゲームの追加機能の要望です。
1.タイトル画面を追加し、以下の難易度を選択できるようにしてください。
 →Easy:3x3
 →Normal:6x6
 →Hard:9x9
2.各難易度で時間も選択できるようにしたい
 →10秒
 →20秒
 →30秒
3.見た目向上
4.ハイスコア機能

出来上がったゲームは以下です!
UIもガラッと変わって良くなりましたよね!
動作確認してみて、Ver.1.0.0としてのゲームが完成しました!

■タイトル画面
image.png

■「START GAME」→「難易度選択」→「制限時間選択」
image.png

image.png

image.png

■GAME OVER画面
image.png

■HIGH SCORES画面
image.png
補足:具体的な実装について伝えていませんでしたが、ハイスコアはJSONファイルで永続保存してくれているみたいです。

⑤自分では浮かばなかった追加の機能についてAmazon Q CLIに聞いてみる

現時点で十分遊べるレベルですが、もっと面白くなるアイデアについて聞いてみました。

以下が実際のプロンプトです。

ここからもっと面白くなるアイデアがあれば教えて!

ここから8個ほど出してくれました。
image.png

なんと実装優先度まで出してくれています…
image.png

今回のAmazon Q CLIが提案してくれたアイデアは実装しませんが、マルチプレイの機能の実装について気になったので聞いてみました。

image.png
いつかマルチプレイ機能も実装できたらいいですね!

まとめ

  • プログラミングができない私でも、対話形式でゲームを作れる。
  • 割とざっくりとした要望でも理解してくれる。
  • ゲームがどうゆうプログラムで実装されているのか/修正箇所を明示してくれるのでどんなことをしているのかはある程度理解できる。分からなかったらAmazon Q に聞いてみれば回答してくれるので安心できる。

完成したゲーム

今回作成したゲームはGitHubに公開いたしましたので、遊ぶことができます!
https://github.com/htani0817/click-game/tree/main
※GitHubに投稿するにあたって必要なRead.meの作成とリポジトリの作成、ローカルからのプッシュもすべてAmazon Q がやってくれました。楽ですね…

0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?