■はじめに
こんにちは😊
前回は、3Dモデリングツールが吐き出したglbファイルを使って、勇者が疾走するアクションを作ってみました。
今回は再びツール側の改良です。
今回やったことは、
- スカートのバグ修正
- ごちゃついてきたメニュー整理
- ポージングの座標系見直し
- オマケでアニメーション作成
になります。
見た目は地味ですが、中身はかなり大きく進歩しました。
■スカートのバグとは？
前回作ったスカートは、見た目だけはそれっぽかったのですが、大きな問題がありました。
それは……
キックすると足がスカートを貫通する(笑)
という問題です。
考えてみれば当然で、スカートは足の動きを全く見ていませんでした。
そこで試行錯誤した結果、
「膝を表す球体」に注目しました。
膝球を約2倍まで拡大し、
左右の膝球をカプセル型(この言葉もChatGPTさんに教えてもらった)でつなぎます。
そして、このカプセル形状を基準にスカートを作るよう変更しました。
すると、足を上げてもスカートが自然についてきます。
かなりそれらしくなりました😊
ただし……
ロングスカートになると、今度は大きく足を上げられません。
こちらは今後の宿題です。
ゲームによっては問題にならないかもしれませんが、アクションRPGを目指す以上、いずれ解決したいですね。
■操作系がごちゃついてきたので整理します
開発を続けていると、どうしてもボタンやメニューが増えてきます。
そこで、
コマンドの並びを一般的な日本語アプリに合わせて整理しました。
さらに、
選択項目は
ドロップダウンリストへ統一。
普段あまり使わないコマンドは折り畳み表示にしました。
これだけでも画面がかなりスッキリしました。
少しずつですが、
「試作品」
から
「普通に使えるツール」
へ近付いてきた気がします。
座標系も思い切って変更
ここでChatGPTさんから、
«「今の回転方向の与え方は、順番依存がありバグの原因になるので、Quaternionを用いた座標系への変更をオススメします。」»
というアドバイスをいただきました。
最初は「Quaternionって何？」状態でした(笑)
Three.jsには標準でQuaternion関数が用意されています。
そこで、
今までの回転方式をやめ、
Three.js標準のQuaternionを利用するよう変更しました。
これによりポージングが、
- 前後
- 左右
- ねじれ
という感覚的に分かりやすい操作へ変更してます。
回転順序による問題も起きにくくなりました。
結果として、コードも分かりやすくなり、今後のアニメーション作成も楽になりそうです😊
作ったアプリはこちらです。
下のURLをGoogle検索窓に入れてアクセスしてね😊
自分の環境だと検索窓しかだめなの。
なんでかね?
https://logicmaker256-prog.github.io/model-04/
■オマケでアニメーションも作ってみました
ツールの動作確認も兼ねて、簡単なアニメーションも作りました。
まずAIへ迷路生成を依頼します。
ただし、
ここはかなり細かく条件を書きました。
① 10×10の迷路を作り、中央に3×3のドラゴン部屋を配置する
② 勇者の初期位置を(1,1)として、A*アルゴリズムでドラゴンまで到達可能か確認する。到達できなければ迷路を作り直す。
③ 勇者が迷路内を走る座標は、このA*探索結果を利用する。
この辺りまで指定しないと、
・壁をすり抜けた
・ドラゴン部屋へ入れなかった
など、AIらしい面白いバグが発生します(笑)
あとは、
④ ドラゴンと遭遇
⑤ 大剣で一刀両断
⑥ バンザイして終了
という流れです。
たったこれだけですが、
自作ツールで作ったキャラクターが、自分で迷路を走ってドラゴンを倒す姿を見ると、かなりテンションが上がります😊
作ったアニメーションはこちらです。
下のURLをGoogle検索窓に入れてアクセスしてね😊
https://logicmaker256-prog.github.io/fighting-anime/
■今回の学び
今回一番の収穫は、
「Three.jsにはQuaternionという便利な機能が最初から用意されている」
ということでした。
数学的には少し難しい仕組みですが、
使う側は
「前後・左右・ねじれ」
を指定するだけ。
内部では綺麗に回転を処理してくれます。
これのおかげでポージングもかなり扱いやすくなりました。
ChatGPTさん、本当にありがとうございます😊
■次回予告
3Dモデリングツールも少しずつ実用レベルになってきました。
次回からは、このツールを使って
スマホ版「ドラゴンバスター」
の制作を始めます。
また、今回はAIにかなり仕事をお願いしました。
次回以降も、なるべくAIへ作業を振りながら、
最近話題の**MCP（AIとの協調開発）**が実際どこまで使えるのかも検証していきたいと思います。
完成まで、まだまだ道のりは長いですが、一歩ずつ頑張っていきます😊