■このブログを読むと

・AIがたまに出す、コードコピー文字数オーバー
 の対策がわかります。
・聞きかじり情報で、それっぽいゲームが作れます
 (こんな感じ↓で出来ます)


■はじめに

JavaScriptのゲームを作っているので、Youtubeで「AI使って人気ゲームをつくる」みたいな奴を勉強代わりによく見ます。

中でも「モンハン」は人気なのか多く目にします。

ただ「モンハン」は人がやっている所を横目で眺めていただけなので、細かいとこは知りません。

そんな私が「モンハン」を作ってみた話です。

尚、シミュレーションと同時にやっているので、
ChatGPTが基本要素の開発担当、
Gemini(Pro)がコード開発、
claudeで最終コードをつくる でやっています。

claudeが修正したときの改悪が一番少なかったので、この順番にしました。

■CM知識を活用して「ドラゴン退治」再現

CMで剣士がドラゴンと戦っていた記憶があるので、これを再現したいと思います。

倒したら確か「ドラゴン肉」が取れて食べてたような…

効果は知らないから、回復ぐらいでいいか。

というか、これ以降ば完全に想像ですので、違っても怒らないように…

とりあえず、3Dモデルを使うようにお願いします。

この3Dモデルについては、ChatGPTさんの意見をもらってます。

  勇者

遠距離攻撃:魔法、近距離攻撃:剣
必殺技:回転斬り(スタミナ使用)

  ドラゴン

遠距離攻撃:ブレス、近距離攻撃:体当たり
必殺技:尻尾攻撃(1回転して尻尾をぶつける)

これだけだと味気ないので、勇者進入禁止の森を配置しました。

ドラゴンは森をものともせずに迫ってくるので、迫力があります。

逆に、ドラゴン有利になり過ぎなので、ブレスは森で消える仕様にしました。

これをGemini(Proモード)にコーディングしてもらい、エディタ(何でもOK)で、ファイルにします。

この時、文字数がコピーできる量を超えてると、コピーマークを押しても途中までしかコピーできません。

こういった症状が出たら、ファイルを分割する事をオススメします。

自分でやってもいいですが、AIに「ファイルを分割して」とお願いした方が手っ取り早くいきます。

■狩り要素の追加

1対1はコレでよしとして、ハンターですから狩り要素を追加します。

・マップを広げて、ドラゴンを3体配置します

・勇者がドラゴンに近づいたら戦闘モードに入る
 (これを忘れて、3匹にタコ殴りになリました)
 
・戦闘モードにはいったら、カメラアングルを
 変えて見やすくする

・ドラゴンを倒すと回復効果のある「ドラゴン肉」
 が手に入る

・ドラゴンの威嚇や飛行など生き物らしくする

・ドラゴンの場所を示すドラゴンレーダーを出す

ここまでやると、処理のメインである「main.js」も4つぐらいに分けないとコピー出来なくなります。

後、この辺からGeminiのいらんことしいな所が出て、バグを作りやすいので、最終コードはclaudeで調整しています。

(ドラゴンレーダーは、claude版しか入ってません)

■結果:

・Gemini(Pro)が開発したモンハンもどき

ゲーム画面


GitHubリンク
https://github.com/logicmaker256-prog/Gemini-monster

・そこからプロンプト作ってclaudeに投げたアプリ

ゲーム画面


GitHubリンク
https://github.com/logicmaker256-prog/claude-monster

遊んで試したい人は、コチラのリンクから

■今回の学び

「スマホコピー文字制限はファイル分割で回避」
(claudeはファイルを作るのでコピー文字制限なし)

複雑なゲームをつくるとコードが長くなりがちなので覚えておきましょう。

3Dものはカメラアングルが大事ってことも頭の片隅にでも置いておいてほしいですね。

■次回予告

前回の予告で「シミュレーションをやる予定」といっておきながら、まさかのモンハン!!

大変申し訳ありません。

でも、楽しかったからいいか。

次回こそ予告どうりシミュレーションをやる予定ですので、よろしくお願いします🙇