ボツにしたAIエージェント可視化ツールのドット絵、全部置いていきます（CC0）

「AIエージェントをRPGで可視化しようとして失敗した話」の供養編です。
プロジェクトは畳みましたが、キャラと背景は普通に良い。作り方ごと供養します。全部 CC0、好きに使ってください。

前編：AIエージェントをRPGで可視化しようとして失敗した話 —— 主役は「勇者」じゃなくて「クエスト」だった

前編は「なぜ RPG メタファーが構造的に破綻したか」の反省文でした。
こっちは アセット制作の実践編です。nano-banana（Gemini の画像生成）で統一感のあるゲーム用キャラを揃える手順が、そこそこ再現性のある形で固まりました。

供養対象

こいつらです。

左から 司令塔（副ギルドマスター）／戦士（開発）／魔法使い（調査）／僧侶（検証）。
AI エージェントの役割を RPG の職業に割り当てたので、戦士がコードを書き、魔法使いが調べ、僧侶がテストします。司令塔だけスーツなのは、こいつがユーザーの唯一の対話窓口だからです。

そしてギルド本部（酒場）。

捨てるのが一番惜しかったやつです。

生成工程：いきなりドット絵を狙わない

一番の知見がこれ。3段階で降ろします。

アニメ風コンセプト画（全身） をゼロから生成
それを編集モードでバストアップに変換
さらに編集モードで 2頭身のドット絵風チビキャラに変換

2と3は「新規生成」ではなく「編集」。ここが全部。

ゼロから「ドット絵の戦士を描いて」と頼むと、毎回まったくの別人が出ます。赤い鎧を指定しても、顔も体型も髪型も揃わない。ゲーム用アセットとしては使えません。

先に情報量の多いコンセプト画を作り、それを元画像として編集モードに渡すと、同一人物性がかなりの精度で保たれます。上の3枚、顔の作り・鎧の金の装飾・マントの赤、ちゃんと同じ人です。

バストアップ4人分。

ドット絵4人分。

全部コンセプト画から編集モードで降ろしたものです。同一人物性が保たれたまま3フォーマット揃う。
バストアップは会話 UI の立ち絵、ドット絵はマップ上のキャラに使いました。用途が違うのに絵柄が揃うので、UI 全体の統一感が一気に出ます。

局所修正も編集モードでいけます。「マントだけ色を変えて」「メガネを足して」程度なら、他を壊さずに直せました。

配色ルール：ドット絵は主色を被らせると死ぬ

やらかして学びました。

戦士＝赤／魔法使い＝緑／僧侶＝青／司令塔＝濃ネイビー＋金。

コンセプト画の段階なら、色が近くても顔や装備で区別できます。でも2頭身・低解像度に落とすと、顔のディテールが消えて色の塊になる。主色が近い2人がいると、マップ上で見分けがつきません。

ドット絵の識別性は、ほぼ色で決まる。

当たり前ですが、コンセプト画がきれいに出ていると気づきにくい罠でした。
職業を追加するなら、先に色を予約してからキャラを設計するのが正解です。

背景：生成AIは頼んでもいないのに黒帯を付けてくる

背景で苦労したのは絵柄ではなく構図でした。git log がそのまま記録です。

1a823d1 ギルド本部を4:3に：背景も4:3で内装が全面を埋める構図に再構成
615d64a ギルド本部背景の黒い四隅を除去し、床・壁で4:3全面を埋める
0d7aeaa ギルド本部を長方形の部屋に（壁が画像4辺）＋立ち位置を新レイアウトに調整
db2d5b3 ギルド本部の上部黒帯を除去＋立ち位置調整

4コミット全部「余白との戦い」です。

「俯瞰視点の酒場を描いて」と頼むと、生成 AI は部屋を画像の中央に小さく置き、周囲を黒や暗色で埋めます。1枚絵としては構図が締まって良い。でもゲーム背景としては使えない。キャラを立たせる床が足りず、UI の枠にはめると黒帯が出ます。

効いた指示はこの3つ。

アスペクト比を明示する（「4:3」）
「内装が画像の全面を埋める」と明示する
「壁が画像の4辺になる長方形の部屋」と、部屋の形そのものを指定する

3番目が決定打でした。

「余白を作るな」ではなく「壁＝画像の縁」。否定形より、肯定形の構造指定。

生成 AI に構図を守らせるときの一般則として使い回せそうです。

モンスターとポーズ差分

左4つが戦士のポーズ差分（歩行・攻撃・喜び・被弾）、右端がスライムです。

ポーズ差分は初期世代のドット絵で、上のチビキャラとは絵柄が違います。作り直す前に企画が終わりました。「状態が変わったらポーズが変わる」という表現自体は良かったので、絵柄を揃えれば普通に使えるはずです。

スライムは生成画像と Canvas 手描きの両方を用意し、最終的にモックでは手描き＋役割色で塗り分けを採用しました。理由は単純で、担当が決まるまで色が確定しないから。生成画像だと色ごとに枚数が要りますが、手描きなら色だけ差し替えられます。

「アセットで解くか、コードで解くか」の判断です。

色や状態でバリエーションが増える要素は、コード側で解くほうが安い。

キャラのように情報量が多いものは生成、記号に近いものは手描き。境界はそのへんです。

モックに埋め込む：外部ファイルが読めない問題

モックは単体で動く HTML 1枚（docs/ui-mock.html）にしていました。共有時に「クローンして、サーバー立てて…」が要らないので。

ただしこの形式、外部ファイル参照ができません。<img src="assets/..."> が動かない。

なのでビルドスクリプトで全 PNG を base64 に変換し、HTML に注入しています。

# scripts/build_mock.py（概念）
# assets/**/*.png を base64 化して ui-mock.html の <script id="assets"> に流し込む
# キーはファイル名の stem（warrior.png → "warrior"）

結果、HTML 1ファイルが 3MB。テキストエディタで開くと固まります。それでも「ダブルクリックで動くモック」の価値のほうが高かったので、これで正解でした。アセットを差し替えたらスクリプト再実行、という運用です。

お金の話：画像生成、地味に効いてくる

キャラ4体を3フォーマット揃えるのに、失敗込みでそれなりの枚数を焼いています。1発で決まることはまずない。構図・表情・色で何度もリテイクが入り、背景に至っては上記のとおり4回作り直しました。

なので今は、生成の呼び出しを Antigravity CLI（agy）経由に寄せています。サブスク枠で叩けるので、リテイク前提の作業と相性がいい。レート制限に当たったときだけ API に切り替える形をスキル化し、Claude Code から呼べるようにしました。

安いほうから使って、詰まったら課金側に落ちる。

それだけの話ですが、効果は大きい。手動で切り替えていると、面倒くささが先に立ってリテイク自体をやめてしまうからです。

agy 側で 429 QUOTA_EXHAUSTED を食らったらリセット待ち、という点は変わりません。ただ**「待つ」か「払う」かをその場で選べる**ようになって、作業が止まらなくなりました。

ライセンス：全部 CC0 です

アセット（キャラ・背景・モンスター）: CC0 1.0 —— 著作権放棄。クレジット不要、商用可。
コード: MIT

プロジェクトは畳みましたが、リポジトリは残してあります。assets/ 以下をそのまま持っていってください。
モック（docs/ui-mock.html）も単体で動く HTML なので、ダウンロードしてブラウザで開けば擬似イベントでシナリオが再生されます。

AgentsQuest（供養） —— https://github.com/HiroSnow0413/agents-quest

で、次

失敗の分析は前編に書きました。要約すると 「RPG の主役はキャラクター、可視化ツールの主役はタスク」。

その反省で、宇宙戦艦テーマの MISSION: NEXUS を作り直しています。

副艦長と対話しながら、タスクがゲームのように進んでいく。

Robot（サブエージェント）を主役から降ろし、一等地に Mission Flow（仕事の流れ） を置きました。Robot はカードの中の担当者名です。ゲーム性は残しましたが、乗せる先をキャラからタスクの進行に移しています。

ただしキャラを捨てたわけではありません。格納庫にはメカと搭乗パイロットがいて、機体ごとに口調が違います。

違うのは扱いです。前作ではキャラが情報の代わりでした。今回は情報の上に乗った演出として、レイヤーごと分離してあります。パイロットを乗せ替えても任務の結果は変わりません。変わるのは言葉づかいだけ。

「世界観は好きだけど、可視化ツールとしては信用できる」を両立させる、というのが今回のテーマです。

MISSION: NEXUS —— 近日公開！（別記事で詳しく紹介します）

ドット絵、誰か使ってやってください。特に酒場。