ブログ図解の生成で最初に失敗したのは、文字化けではなく見た目です。背景が白とベージュで揺れ、図が中央に小さく浮き、余白が面積の大半を占めました。ここでは実在するbefore/afterと、どの検収項目を追加したかを並べます。
目次
入力仕様に失敗が埋め込まれていた
旧仕様は背景をlight backgroundとだけ書き、さらにgenerous marginsを要求していました。生成器は指示どおり、薄いベージュや大きな余白を返します。検収側もラベル、見切れ、矢印だけを見ており、背景色・余白・配色を判定していませんでした。
before:ベージュ背景と余白過多


変更:生成指示と検収項目を対で直す
| 観点 | 旧仕様 | 修正後 |
|---|---|---|
| 背景 | 明るい背景 | 白として読め、ベージュ・クリームの色被りを避ける |
| 余白 | たっぷり取る | 各辺およそ5%を目安に全幅を使う |
| 配色 | 生成ごとに自由 | 淡青、強調1箇所の琥珀、濃紺文字の同一パレット族 |
| 検収 | ラベル・見切れ・矢印 | 背景、余白支配、パレット一致も目視する |
after:同じ連載として読める図へ寄せた

厳密値の指定は一度失敗した
最初の修正では「完全な#FFFFFF、階調やグレインを一切禁止」と書きました。しかし生成結果には僅かな階調が残り、検収が候補をすべて拒否しました。そこで、機械的な完全一致ではなく「白として読める」「ベージュの色被りを拒否する」という知覚基準へ戻しています。
配信の200と、読者が見た品質を分ける
画像URLがHTTP 200を返すことは、ファイルが届いた証拠です。背景の揺れ、余白、文字の大きさ、矢印の向きは証明しません。生成後は実画像を開き、モバイル幅で見てから本文へ入れます。
1枚の検収表
- ラベルが原稿どおりか
- 矢印の向きと関係が正しいか
- 文字や箱が切れていないか
- 背景が同じ連載の白基調に見えるか
- 余白が図より支配的でないか
- 強調色が増えすぎていないか
- 390px幅でも主要文字を読めるか
図解の品質は、生成プロンプトだけでも、公開URLのreadbackだけでも閉じません。生成側の仕様と、人が見る検収項目を同時に変更する必要があります。
この検証を回している環境
この検証は、自宅の常設ラボ(使い捨てVM/LXCを回す母艦+GPU+VLAN分離ネットワーク)で動かしています。使っている機材と選定理由、全体構成は1本にまとめています。
ラボ構成のまとめを見る →