はじめに
某SI会社2Gの、かとうと申します。
AWSのAIエージェントを使い、レビューを投稿しようと思います。
Qiitaへの投稿は初めてなので、まずは軽く自己紹介から。
自己紹介
今年4月に、某SI会社に入社しました。
いわゆる文系未経験入社で、ITの世界に飛び込んで、半年ちょっと。
プログラミングを勉強中の、ひよっこエンジニアです🐣
そのため、専門的知識を使いこなしてすごいものを作る……というよりは、
「IT 初心者が、AIエージェントを使ってどこまでのものを作れるのか？」という視点で、検証していけたらと思います。
気軽に読んでください☺️
よろしくお願いします。
今回の検証
今回は、AWSの「Kiro」というIDEを使って、AIエージェントに簡単なリズムゲームを作ってみました。
（※ Kiroとは……？な方は、こちらをご参照ください↓
「Kiro のご紹介 – プロトタイプからプロダクションまで、あなたと共に働く新しい Agentic IDE」：https://aws.amazon.com/jp/blogs/news/introducing-kiro/）
今回、こちらのKiroを使って、
「自然言語のプロンプトのみ」でゲームを作成しました。
検証スタート！
Kiroには、「Vibeモード」と「Specモード」という、2種類のモードがあり、好きな方を選択できるようになっています。
Kiroの最大の特徴は、要件定義や設計からしてくれる「Specモード」らしいのですが、
一旦、今回は「Vibeモード」（プロンプトからすぐにコード生成する）を使用してみました。
さっそく、最初のプロンプトを投げてみます。
こんなざっくりしたプロンプトだけで、ブラウザで遊べるゲームを出力してくれます。
さらに、音楽を入れる方法まで教えてくれました！
（今回は入れませんでしたが、音楽がついたらアツいですね……！）
さっそく、ブラウザで開いてみましょう。
ゲーム画面はこんな感じ。
お願いした通り、落ちてくるノーツに合わせてキーを叩けば、スコアが加算されていくというゲームでした。
叩くタイミングによって、「OK」「MISS」など出してくれるのも、それっぽくていい感じです！
実は以前、他のAIアシスタントで似たようなゲームを作成したことがあるのですが、
最初の出力では、スコアや制限時間がなく、ただ落ちてくるノーツを無限に叩くだけのゲームでした。
今回は、最初からスコアと制限時間を設けてくれてます👏
かなり良いゲーム性です！
でも、プレイしていて、とてもストレスの溜まる点がありました……。
レーンの位置とボタンの位置がズレていて、どのキーを叩けばいいのか、パッと見では分からない状態。
見た目のイメージと、実際に叩くキーがズレているので、だいぶ頭が痛くなります。
ここはちゃんと直したいです。
修正スタート
率直に、プレイした感想を伝えてみましょう。
かなり意地悪な感想を伝えましたが、修正して、新しいバージョンを出力してくれました。
さらに、ボタン周辺のUIの改善までやってくれたようです！
ボタンのまわりに、落ちてくるノーツに対応した色がついてます。
↑こちらが修正版。
確かに、ボタンの色がノーツと同じ色に色分けされて、UIが良くなっています。
が……肝心のレーンのズレは、ほとんど改善されていませんでした。
修正する方向を伝えてみます。
「右」という方向を伝えてみましたが、ほとんど変わりませんでした。
もう少し、具体的に指示します。
「レーンの中心線を、ボタンの横幅の中心に合わせればいいんじゃない？」
このプロンプトで、Dボタンだけ、レーンの中心と揃いました！！
一歩前進です。
この後は、なかなかUIが変わらず、しばらく苦闘したのですが……
最終的には、こちらのプロンプトで解決しました。
「ボタンの中心と、レーンの中心線を合わせてみましょう。
Dボタンはあってるので、他のボタンも同じようにしてみて」
これで全てのボタンの中心と、レーンの中心が揃いました！👏
「成功したDボタンに、他のボタンを合わせる」という方向性が良かったようです。
最後に、判定ゾーンをKボタンの端まで広げてもらえば、
いい感じの見た目になりました！
ストレスなく楽しめるゲームになったのではないでしょうか。
完成です🙌
おわりに
今回の感想
今回は Kiroの「Vibeモード」を使い、ふわっとした自然言語のプロンプトだけでリズムゲームを作成しました。
先回りで、音楽の入れ方を提案してくれたり、ボタンのUIを自分から改善してくれたり……
Kiro君が、「こうしたいんでしょ？できるよ！」といろいろ教えてくれるのが良かったです。
ボタンの色だけでなく、途中でレーンの両端に境界線もつけてくれたりと、
こちらから言わなくても、どんどん修正してくれました👏
一方、自然言語のプロンプトだけで細かく調整をするのは厳しそうでした。
Kiroに限らずかもしれませんが……
最終的に、レーンとボタンの位置を整えることはできましたが、さらに細かく調整しようと思うと、プロンプトだけでは厳しいのではないでしょうか？
プログラムに手を加えた方がよさそう。
それとも、プロンプトの工夫次第で、上手くできたりするのでしょうか。
それか、UI生成に特化したAIや、ゲーム生成専用のAIを併用すると、UIの微調整もできるんでしょうか。使ったことがないので、何とも言えませんが……。
一度試してみたいです。
次回の検証
せっかくKiroを入れたので、次回は「Specモード」を使ってみたいなと思っています！
（具体的な検証内容は、まだ決まってません😌）
今回の記事はここまでです。
お読みいただきありがとうございます。