見出し画像

1ヶ月間毎日Claude3.5でゲームを作ったら「プロンプト」に関する学びがありました

gimu｜AI×ゲーム開発

7月1日から7月31日にかけて 、毎日Claude3.5 アーティファクトで ゲーム開発を行っていました。

1つのゲーム完成までに平均30回の修正。作成時間は大体2〜3時間です。
これを31日間続けました。

そのおかげでAIが作った成果物を修正しながら、ゲームのクオリティを上げるプロンプト力が上達しました。

この記事では、UFOキャッチャーを制作した時の事例を紹介しながら、プロンプト作成で大事だと思ったことを3つ紹介します。

主に伝えたい内容は3つです。

  1. 最初のプロンプトは凝らないアプローチもある

  2. AIと人間の常識は違う

  3. 「自然言語→コード」を考えてプロンプトを作る


ポイント① 最初のプロンプトは凝らないアプローチもある

自然言語を使ってプログラミングを行う際は、まずAIに要件定義書を書かせて、コードを書くのが一般的です。

しかし今回は、要件定義書をまず作る事は行わず、対話形式で徐々に修正を加えながらゲームを完成させるというプロセスを取りました。

要件定義書を使わなかった理由

  • 簡単なプロンプトでも結構良いアウトプットが出る

  • 要件定義書の内容を理想に近づけるのには時間がかかる

  • 作りたいゲームのことをClaudeが知らないことも多い

それではプロンプトの形式によって、どのようにアウトプットが変わるのかを比較してみます。

アウトプット比較: 一言プロンプト

「CDNを使ってThree.jsをインストール」は3Dゲームを作るのに必須のプロンプトです。

アウトプット比較: 要件定義書

※別途Claudeで要件定義書を作り、それをプロンプトに入れています。
※このプロンプトの後に「デザインをリッチに」と修正を加えたアウトプットです。

アウトプット比較: 作り込んだプロンプト

※自分の完成品イメージをテキストに落とし込んだプロンプトです。
※このプロンプトの後に「デザインをリッチに」と修正を加えたアウトプットです。

シンプルなプロンプトや要件定義書を作ったアウトプットも、最初のアウトプットとしてはかなり良いです。

ただ頭の中に作りたい成果物のイメージがある場合は、「作り込んだプロンプト」が期待に近いアウトプットが出せます。

ポイント② AIと人間の常識は違う

AIは「間違ってるよ」と指摘しても、頑なに直さない修正があります。

例えば「上下左右の認識」です。

緑のボタンの矢印の方向を修正したい。

▪︎誤っている点(緑のボタン)

  • 上に進むボタンなのに、ボタンの矢印が下。

  • 左に進むボタンなのに、ボタンの矢印が右。

どうやら私たちとClaude3.5の上下左右の概念は逆らしいです。

上下左右を修正するプロンプト

ボタンの矢印を上下左右反転して。ほかは何も変えないで。コードは端折らず書いて。
緑のボタンの矢印が修正されている。

「修正して」より「反転させて」と言うと修正されます。

プロンプト補足

「ほかは何も変えないで」: これを入れないと、ボタンの矢印だけでなく、移動する方向も変えてしまったので、この文言を入れています。

「コードは端折らず書いて」: 「ほかは何も変えないでと入れると、既存のコードを省略してしまう時があるので、この文言を入れます。

ちなみに以下のようなプロンプトだと上下左右の誤りを修正できません。

うまく修正できなかったプロンプト

  • 上下左右が間違ってるから修正して

  • 右になっているのを左に変えて

AIの認識の誤りを正すよりも、
AIの常識に則ってプロンプトを作る方が、
早く修正できることが多いです。

ポイント③ 「自然言語→コード」を考えてプロンプトを作る

プロンプトを作る時「こういう指示をしたらこんなコードが生成される」というイメージは作れていますか？

コード修正でエラーが起きる原因は、大きく3パターン考えられます。

  1. アーティファクトの制限(トークン不足・画像読み込みなど)

  2. Claude3.5の出力ミス

  3. プロンプトの内容が分かりにくい

エラーが起きる要素を予測しながらプロンプトを作ることで、
成果物を完成させられるスピードが上がります。

1と2に関しては仕方がない部分はあります。
ただ3に関しては頑張れば解決できます。

「こう動いて欲しい！」という挙動をできるだけ細かく分解し、プロンプトに起こすことで、希望に近い動きをしてくれるようになります。

一例として、クレーンが景品を掴めるようにした時の修正プロンプトを紹介します。

クレーンの動きを修正できなかったプロンプト

アームが開いて、降下して、アームを閉じるという挙動ができなくなっています。修正お願いします。


クレーンの動きを修正できたプロンプト

矢印ボタンではないボタンを押したら、以下のステップで動くようにして下さい。
1.アームを開いて降下して、アームを閉じてます。
2.そしてクレーンがアイテムに触れたら、クレーンがアイテムを掴みます。
3.アイテムを持ち上げて初期位置に戻りアームを開きます。
4.クレーンがアイテムを離し、アイテムが真下に落ちます。

上記のように修正することで、かなり希望に近い動きをしてくれるようになりました！

ちなみにClaude3.5の段階では、1回の修正で全て完璧に修正してくれることはありません。

AIが作った成果物を確認し、違和感があるところを、1個ずつ地道に修正していく作業になります。

最後に

この記事で伝えたかったことは3つです。

  1. 最初のプロンプトは凝らないアプローチもある

  2. AIと人間の常識は違う

  3. 「自然言語→コード」を考えてプロンプトを作る

読んでいただいた人に、何か1つでも参考にしてもらえる部分があれば嬉しいです。

この記事が気に入ったらサポートをしてみませんか？