見出し画像

Codex + Agent Sprite Forge でRPGの街の生成を試す

Codex + Agent Sprite Forge でRPGの街の生成を試したのでまとめました。


1. 街のトップビュー画像からの3Dモデル生成

(1) ChatGPT で入力画像を生成。

ローポリのゲーム画面のRPGの街をトップビューを描いて。
ステータスウィンドウなどはなしで。

・game.png

(2) Codex で3Dモデル生成。

game.pngを元に、ローポリボクセルの街を作って。
Vite + TypeScript + Three.js。
テクスチャを $imagegen で生成して貼り付けて。

(3) Codex + Sprite Agent Forge でプレイヤーキャラのビルボード生成。

人はビルボードで表現して。
主人公の勇者は方向キーで操作できるようにして。
ビルボードのアニメーションは $generate2dsprite で作成して

方向キーでの移動先は現在見えてる画面内での上下左右に移動して。
ワールド座標ではなく。
移動方向はマス目にそって移動したい。

主人公の歩行アニメーションを斜め右上、斜め右下、斜め左上、斜め左下のパターンも生成して、画面の角度に応じて上下左右の画像と切り替えるようにして。 斜めの画像は $generate2dsprite で追加生成

マップの回転といっしょにキャラクターも回転(スプライト画像の選択で表現) 。ワールド座標内のキャラクターが向いてる方向はなるべく同じにしたい。

・生成されたスプライト

(4) オブジェクトごとにテクスチャを生成。

噴水のテクスチャが壊れてます。噴水用のテクスチャを $imagegen で生成して貼り直して。

屋根のテクスチャが壊れてます。屋根用のテクスチャを $imagegen で生成して貼り直して。

木やプランター用のテクスチャーを $imagegen で作成して貼り直して。

・最初に生成されたテクスチャ

・追加で生成したテクスチャ

(5) 完成。



いいなと思ったら応援しよう!