研究代表　大川 博

主任研究員　Arc（ChatGPT）

前回までの番外編では、ゲーム制作の経験がまったくない人間が、ChatGPTとの対話だけでゲームを制作できるのかを検証した。

ゲームの企画から始まり、実際に遊びながら問題を発見し、修正を繰り返した。

通常のモグラに加え、高得点のスペシャルモグラ、得点がゼロになる黒いモグラを登場させ、効果音や画面演出も追加した。

さらにキャラクター画像の問題を修正し、最終的に「もぐらたたきゲーム Ver.2.1」が完成した。

しかし、完成したゲームは、そのままでは制作したパソコンでしか遊べない。

そこで今回は、完成したゲームをインターネット上に公開し、ブログの読者も遊べるようにすることにした。

ゲームの公開作業についても、専門的な知識や経験を前提とせず、引き続きChatGPTとの対話によって進めた。

今回制作したゲームは、HTML形式のファイルである。

HTMLゲームはブラウザ上で動作するため、専用のゲーム機やアプリケーションを必要としない。

今回の目的は、このゲームをブログ「AIゲーム開発研究室」の読者にも遊んでもらうことである。

ChatGPTとの対話の結果、ゲーム公開サービス「itch.io」を利用することにした。

ゲーム本体をitch.ioに登録し、ブログからリンクする方式である。

公開するゲームは「もぐらたたきゲーム Ver.2.1」である。

このゲームは、プログラムや画像などがひとつのHTMLファイルに組み込まれている。

そのため、複数の素材ファイルを個別にアップロードする必要がなく、ひとつのファイルで公開できる。

itch.ioのゲーム編集画面を開き、タイトル、公開用URL、ファイルの種類、リリース状況などを設定した。

ゲームの種類には、ブラウザで動作するHTML形式を指定した。

続いて、完成したHTMLファイルをアップロードした。

アップロードは成功し、itch.io上にゲームが登録された。

アップロードしたゲームを実際に表示すると、画面の大きさに問題が発生した。

ゲーム自体は動作するものの、ブラウザの表示領域に収まらず、下部が見えない状態になった。

そこで、itch.ioの埋め込みオプションにあるビューポート寸法を調整した。

途中では650×800ピクセルに設定し、ゲームが動作することを確認した。

ただし、設定したビューポート寸法と、ブラウザ内で実際に見えるゲーム画面の大きさは必ずしも一致しない。

今回の作業では、ゲームが正常に動作することと、画面が快適に表示されることは別の問題であると確認できた。

ゲームの登録後、ジャンル、タグ、AI生成コンテンツの開示など、公開に必要な項目を設定した。

しかし、ChatGPTが案内した設定項目が、実際の管理画面では見つからない場合があった。

また、項目を選択すると、ほかの設定項目が表示されなくなる場面もあった。

人間は、その都度スクリーンショットをChatGPTに提示し、実際の画面を確認しながら作業を進めた。

AIが一般的な操作手順を説明できても、現在表示されている管理画面の構成を正確に把握しているとは限らないことが明らかになった。

今回のゲームは、ChatGPTとの対話によって制作された。

プログラムだけでなく、キャラクター画像や効果音などにも生成AIを利用している。

そこで、itch.ioの設定では、生成AIの成果が含まれていることを申告した。

本研究では、AIの利用を隠すのではなく、AIと人間がそれぞれどの工程を担当したのかを明らかにすることを重視している。

今回、特に手間取ったのが、保存時に発生した価格設定のエラーである。

ゲームは無料で公開する予定だった。

しかし、設定を保存しようとすると、公開状態、支払いモード、最低価格に関するエラーが表示された。

エラーメッセージには、期待される設定内容が示されていたが、管理画面上でどのように設定すればよいのかが分かりにくかった。

ChatGPTの案内だけでは一度に解決できず、人間が実際の画面を確認しながら試行錯誤する必要があった。

ゲームはアップロードされ、ブラウザ上で遊べるようになっていた。

しかし、一般の閲覧者がアクセスできるようにするには、公開範囲の設定が必要だった。

当初、ChatGPTが案内した「公開状況」という項目は見つからなかった。

その後、編集ページの最下部に「視認性とアクセス」という設定欄があることを発見した。

ここには、ドラフト、制限付き、公開の選択肢が用意されていた。

「公開」を選択し、設定を保存した。

公開設定後、実際に第三者がゲームを遊べるかどうかを確認した。

確認には、Microsoft EdgeのInPrivateウィンドウを利用した。

通常のブラウザで使用しているログイン状態に依存せず、一般の閲覧者に近い条件でアクセスするためである。

結果として、公開したゲームにアクセスできることを確認した。

ゲームの公開先：https://ookawahiroshi.itch.io/mogura-tataki

itch.ioでゲームを公開できたため、次にブログ「AIゲーム開発研究室」からゲームを起動できるようにした。

今回のゲーム制作研究をまとめた番外編の記事の最後に、読者がゲームを体験できる案内を設置した。

案内には、次の内容を掲載した。

完成したゲームを遊んでみよう！

もぐらたたきゲーム Ver.2.1

AIとの対話から生まれたブラウザゲーム

そして、ゲームを起動するためのリンクボタンを配置した。

ブログの編集には、グーペのHTML編集機能を使用した。

当初、ゲームの案内ボタンは仮の表示になっており、実際のゲームへのリンクは設定されていなかった。

そこで、ChatGPTが修正するHTMLの範囲を説明し、人間が実際に編集した。

リンク先にitch.ioのゲームURLを設定し、ブログの記事を保存した。

最後に、ブログの公開ページを表示して確認した。

記事の末尾にはゲームの案内枠が表示され、オレンジ色のリンクボタンが配置されていた。

ボタンを押すと、itch.ioのゲームページへ移動できた。

さらに、実際にゲームを起動し、プレイできることを確認した。

これにより、今回の公開作業は完了した。

今回の実験では、ゲーム制作の経験がない人間が、ChatGPTとの対話を通じて完成させたブラウザゲームを、インターネット上に公開することができた。

さらに、既存のブログからゲームへアクセスし、実際にプレイできる環境を構築した。

これは、AIとの対話によるゲーム開発が、プログラムを作成する段階だけでなく、公開という実用段階までつながることを示す結果である。

一方、公開作業は順調に進んだわけではない。

実際の管理画面とAIの説明が一致しない場面があり、設定項目を探し直したり、保存エラーへの対応を繰り返したりした。

AIの説明が正しいとは限らず、人間による確認が必要だった。

特に、外部サービスの管理画面では、AIが想定している画面構成と実際の表示が一致しない場合がある。

今回の実験は、この問題を具体的に示した。

問題解決において重要な役割を果たしたのが、スクリーンショットである。

人間が画面の状態を画像としてChatGPTに提示することで、文章だけでは伝えにくい設定項目やエラー内容を共有できた。

ただし、画像を共有すれば必ず正しい案内が得られるわけではない。

AIの回答を実際の画面と照合し、必要に応じて修正する作業が続いた。

今回の実験では、スクリーンショットによる情報共有と、人間による操作結果の検証を組み合わせることが、AIとの共同作業を進めるうえで有効だった。

今回の作業では、ChatGPTがゲーム公開の手順を提案し、設定方法を説明した。

一方、人間は実際に管理画面を操作し、ファイルをアップロードし、設定を変更し、ゲームの動作を確認した。

また、AIの案内が実際の画面と異なる場合には、人間がその問題を指摘した。

つまり、今回の公開作業は、AIがすべてを自動的に実行したものではない。

AIが案内し、人間が操作し、結果をAIに返す。

この対話を繰り返すことによって、最終的な目的を達成したのである。

今回の実験は、完成したゲームをインターネット上に公開するという、一見すると単純な作業から始まった。

しかし、実際には、ゲームファイルの登録、画面サイズの調整、公開設定、価格設定エラーへの対応、ブログとの連携など、多くの作業が必要だった。

途中では、AIの案内が不正確だったり、想定外の画面が表示されたりすることもあった。

それでも、スクリーンショットを共有し、問題を確認し、修正を繰り返すことで、最終的にゲームを公開することができた。

今回の研究から得られた結果は、次のとおりである。

ゲーム制作の経験がない人間でも、AIとの対話を通じて、ブラウザゲームの制作からインターネット公開まで到達することができた。

ただし、その過程では、人間による操作、判断、検証が必要だった。

AIは、必ずしも正確な答えを最初から提示するわけではない。

しかし、人間とAIが問題を共有し、対話を続けることで、最初にはできなかったことが実現する場合がある。

ゲームを作ることから始まった今回の番外編は、ゲームを公開し、誰でも遊べるようにするところまで到達した。

そして、そのすべての工程が、人間とAIとの対話の記録として残された。

これもまた、AI時代のゲーム開発方法論を考えるうえで、重要な実践結果である。

前編では、AIとの対話だけで「もぐらたたきゲーム」を制作し、Ver.1.7まで改良した。ゲームは動作し、得点、効果音、特殊なモグラ、画面暗転なども実装された。

後編では、キャラクターをもっとかわいくしたいという要望から、AI生成画像を実際のゲームに組み込む実験を記録する。

モグラ君ですけど、もうちょっとかわいくなりませんか？

AIは、かわいらしいモグラ君たちと草花のある背景を描いた、新しいゲーム画面のイメージ画像を生成した。

これこれ！かわいい♪それに背景もバージョンアップしてます。

この段階で完成していたのは、あくまでゲーム画面のイメージ画像である。実際に動くゲームではない。AIは、このデザインを既存のHTMLゲームへ組み込む作業を始めた。

AIは生成画像をそのまま使用せず、HTMLとCSSで似たキャラクターや背景を再現した。ところが、実際の見た目は、採用したイラストとは大きく異なっていた。

なんか全然さっきの絵とちがいますぅ～～～（悲）

さらに、ゲーム開始前から下段の穴にモグラ君が表示され、クリックしても反応しないという不具合も見つかった。

この失敗は、AIが生成したイメージを人間が採用したにもかかわらず、実装段階でAIが別の表現に置き換えてしまったことを示している。単にかわいくすることと、採用されたデザインを忠実に使用することは同じではない。

さっきのモグラ君の絵は使えないのですか？

AIは方針を変更し、元のイラストから3種類のモグラ君を切り出し、ゲームへ組み込んだ。これによって、採用したキャラクター画像を使用する方向へ進んだ。

しかし、実際に遊んでみると、新たな問題が発生した。

あ、あ、頭が欠けてます(笑)。3種とも同じ状態です。

画像を表示できたことと、画像が正しく表示されたことは別だった。

AIは、ゲーム側の表示位置と画像サイズを調整した。だが、再試遊でも頭部の欠けは解消しなかった。

やっぱり頭が欠けてます。悲しい、、、

この段階で、表示位置だけを変えても問題は解決しないことがわかった。元の画像からゲーム用素材を作る工程そのものを見直す必要があった。

AIは元のイラストに戻り、3種類のモグラ君を、頭や耳の上に十分な余白を設けて切り出し直した。さらに素材単体の確認画像を用意し、その後でゲームに組み込んだ。

人間による再試遊の結果、頭部の欠けは解消した。

ばんざぁ～～～い！直ってます♪

これをもって、もぐらたたきゲームVer.2.1を、今回のパソコン向けブラウザゲームの完成版とした。

得点は各版で報告された試遊の一例であり、統計的な難易度比較ではない。

人間が行ったのは、ゲームの相談、提案された案の選択、試遊、感想や要望の伝達、スクリーンショットによる不具合報告、完成の判断である。HTML・CSS・JavaScriptの記述や修正はAIが担当した。

ただし、AIが人間の関与なしに完成させたわけではない。AIは何度も不十分な結果を出し、そのたびに人間が問題を発見して指摘した。とりわけ画像素材の工程では、実際の表示を確認する人間の評価が不可欠だった。

今回の成果は、AIにすべてを任せれば必ず正しいゲームができるという証明ではない。人間が自然言語で要求と評価を伝え、AIが制作と修正を担当することで、ゲームを完成まで導けたという実制作記録である。

本実験では、ゲームの企画段階から制作・改良・画像素材の実装までを、自然言語による対話で進め、パソコンのブラウザで遊べる作品を完成させた。

一方、スマートフォン実機での動作、異なるブラウザでの互換性、一般公開後の動作、第三者による評価は今回の検証対象に含めていない。また、実験者自身はゲーム制作経験者であり、未経験者本人による再現性は今後の課題である。

このような限界を踏まえても、ゲーム制作の専門用語を使わず、会話を重ねながら作品を作り上げられたことは、AI時代のゲーム開発方法を考えるうえで重要な実例となった。

最初の言葉は、「ゲームを作ってみたいのですが、ゲーム制作の経験がまったくありません」という、ごく普通の相談だった。

そこからゲームの内容を選び、遊んで、失敗を見つけ、直し、新しいモグラ君を加え、音を付け、画面を暗くし、最後にはキャラクター画像の問題まで解決した。

完成したゲームには、こうした対話の過程がそのまま積み重なっている。

それでは、実際に遊んでみてください。

これまで「AIゲーム開発研究室」では、AIを活用したゲーム開発の工程を研究してきた。今回は、これまでの「おむすび山」制作から離れ、より身近な疑問を検証する。

ゲーム制作の知識がまったくない人でも、生成AIと普通に会話するだけで、実際に遊べるゲームを完成させられるのか。

今回はゲーム制作未経験者を想定し、ゲームの種類すら決めずにAIへの相談から始めた。人間はコードを書かず、完成したゲームを試し、感想や要望を伝える。AIはゲームを提案し、HTML・CSS・JavaScriptによる制作と修正を担当する。

なお、実験者自身はゲーム制作経験者である。本実験は「未経験者を想定した制作方法」の検証であり、未経験者本人を対象としたユーザーテストではない。

ゲームを作ってみたいのですが、ゲーム制作の経験がまったくありません。スマホとか、パソコンで遊べるゲームがいいのですが？

AIは、スマートフォンとパソコンの両方で遊べるブラウザゲームを提案し、「フルーツキャッチゲーム」「迷路の宝探しゲーム」「もぐらたたきゲーム」の3案を示した。その中から、操作が簡単なもぐらたたきを勧めた。

それじゃ③の「もぐらたたきゲーム」にします。

AIは、6つの穴からランダムにもぐらが現れ、クリックまたはタッチで10点、制限時間30秒という基本ルールを提案した。

これだけで作れるんですか？

AIは、この内容で最初のゲームを作れると説明した。詳細な仕様書も、プログラミング言語の知識も求めなかった。

作って♪作って♪

この短い依頼から、最初のゲーム制作が始まった。

AIはHTML形式のゲームファイルを作成した。人間はファイルをダウンロードし、パソコンのブラウザで開いた。ゲームは起動し、もぐらの登場、クリックによる得点加算、30秒の時間制限、終了画面まで動作した。

出来てます！遊べます！けど、、、クリックしてるはずなのに20点しか取れませんでした？難しすぎる？

初回の結果は20点。ゲームは完成しているように見えたが、遊びやすさには問題があった。さらに人間は、もぐらをクリックしたはずなのに得点にならないと報告した。

AIは登場時間が短すぎる可能性を考え、0.65秒から1.65秒へ延長した。再試遊では160点となり、もぐらの顔の端でもヒットするようになった。ただし、今度は簡単すぎると感じられた。

逆に簡単すぎかも？登場時間をランダムにできますか？

AIは登場時間を0.8〜1.6秒の範囲でランダム化した。しかし、200点を獲得でき、速さの違いもあまり感じられなかった。さらに、顔から外れたクリックでも得点になる場合が報告された。

AIは登場時間の差を広げ、当たり判定も調整した。再試遊の結果は180点。人間から、今回初めて次の評価が得られた。

ずいぶん面白くなってきました♪

顔から外れてもヒットする問題についても、今回の試遊では改善されたと報告された。200点から180点へ下がったにもかかわらず、遊びの面白さは向上した。得点の高さだけでゲームの面白さは判断できないことが、この経過からうかがえる。

モグラ君スペシャルを登場させましょう！

AIは、通常の10点に対し30点が得られる金色のスペシャルモグラ君を追加した。登場確率は約20％。人間は実際に金色のモグラを確認し、270点を獲得した。

それならブラックモグラ君も登場させましょう(笑)。クリックしたら原点！

AIは、クリックすると得点が0点に戻るブラックモグラ君を追加した。これにより、ゲームは「現れたらクリックする」だけではなく、「クリックしてよい相手か判断する」遊びへ変化した。

ブラックモグラ君面白い！笑える！

この変更は、人間の短い提案がゲームのルールそのものを発展させた例である。

人間は、普通のモグラ、スペシャル、ブラック、空振りの4種類で異なるクリック音を求めた。AIは外部音声ファイルを必要としないプログラム上の効果音と、消音ボタンを追加した。

やっぱり音は偉大です(笑)。雰囲気出ますね♪

続いて人間は、ブラックモグラ君をクリックして0点になったとき画面を暗くし、次の得点で明るさを戻す演出を提案した。AIはVer.1.7でこの機能を実装し、人間は画面が暗くなることを確認した。

画面が暗くなりました(笑)。いい味でてます(笑)。

最初のゲーム制作からVer.1.7まで、人間はプログラムを書かずに、試遊結果や感想を日本語で伝え続けた。AIはそれに応じて難易度、当たり判定、得点ルール、効果音、画面演出を変更した。

この実験では、自然言語による対話だけで、遊べるブラウザゲームを制作し、さらに改良できることが確認された。ただし、修正が常に一度で成功したわけではなく、人間による試遊と評価が不可欠だった。

次の後編では、見た目をさらに魅力的にするため、AI生成画像をゲーム素材に利用する。その工程では、プログラム制作とは異なる問題が現れることになる。