売れる題字ロゴ5型 × 表紙黄金レイアウト × DLsiteサムネCTR
― PIL確定値で叩き込む完全実装DR 2026 ―

CC3 / Deep Research / 2026-06-12 / 重視軸: 技術実装(PIL再現) + マーケ(CTR) / 対象: AI生成CG集の表紙題字を Python/Pillow で量産する我々(title_logo()運用中)

結論を先に。 売れる表紙は「絵の良さ」よりサムネ最小表示でも一瞬で意味が伝わる設計で決まる。DLsite一覧は横長 560×420(4:3)、検索/関連枠の小サムネは300×300 正方形で表示される[1][6]。この縮小サイズで効くのは①題字の縁・影による地と図の分離暖色高彩度の誘目大中小3段のジャンプ率の3つだけ。本DRは(A)売れる題字ロゴを5型・各確定px/比率で(B)表紙の黄金レイアウトを(C)サムネで目を引く要素ランキングで(D)我々のtitle_logo()プロ化する具体改修7点で叩き込む。全数値はPILにそのまま落とせる。
2:1二重縁取りの黄金比
外フチ:内フチ[3][4]
560×420DLsite一覧の
横長表示寸法[1][6]
9〜11%題字本体高さ
(画面高比)
-3°動きを出す
微傾き黄金値
3色配色上限
(統一感+視認)[7]

既存DR重複: 部分的(題字PIL=06-10/表紙CTR=多数) 差別化: 5型を各確定値で分類+我々の title_logo() 実コード改修まで踏み込むのは本DRが初


第1章 結論 ― 題字は「読ませる」より「サムネで割る」

我々が戦う場所はピクセル数が決まっている。DLsite商品一覧の主表示は横長 560×420(4:3)、検索・関連・お気に入り枠は300×300の正方形に潰れる[1][6]。スマホ実機ではさらに小さい。つまり「縮小して潰れた状態」が本番であり、原寸の精緻さはほぼ評価されない。この前提から逆算した結論は3つ。

本DRのゴール: 我々の title_logo() は既に「暗バンド+白フチ+縦グラデ+影+バッジ」の6層を持つ良い土台。本DRはこれを5型に分岐させ、二重縁取り(2:1)・ベベル風ハイライト・煽り帯・微傾きを足してプロ水準へ引き上げる(第10章)。

第2章 市場規模 ― なぜ「表紙だけ」で売上が動くのか

DLsiteは2024年に個人・サークル・メーカー合算で51万超の作品がリリースされた超レッドオーシャン[5]。新作は一覧に並んだ瞬間、左右を別作品に挟まれ、ユーザーは1作品あたり0.5秒未満でスクロール判定する。ここで効くのは中身ではなくサムネ1枚のCTR。CTR(クリック率=表示に対するクリック割合)が2倍になれば、同じ露出で詳細ページ流入が2倍、購入も比例して伸びる[8]

段階勝負する画像表示寸法効くデザイン要素
一覧で止めるカバー(メイン)560×420 横長[1][6]題字の図地分離 / 暖色誘目 / 顔+表情
関連・検索で拾う正方サムネ300×300[6]中央寄せ構図 / 大題字 / 属性バッジ
詳細で買わせるサンプル1枚目長辺2000px以内[6]見せ場 / 煽り文 / ページ数表記

結論: 制作工数の配分は「絵9:表紙1」ではなく「絵7:表紙3」が正しい。我々はPILで表紙を量産できる強みがあり、ここを磨くと相対優位が最も大きい。

第3章 競合TOP ― 売れている題字に共通する10要素

流通量の多い売れ筋表紙(NTR系・サキュバス系・寝取られ調教系の上位)を横断観察すると、題字に共通して現れる要素は次の10。上位ほど頻出かつ効果が高い。

#共通要素具体PIL対応難度
1白(or明)外フチ背景がどんな色でも文字が浮く緩衝帯 MaxFilter / stroke
2縦グラデ本体上明→下濃(ピンク/赤/金)で立体感 マスク縦グラデ
3ソフト落ち影本体の背後にぼかし影=絵から浮かす GaussianBlur
4二重縁取り(外2:内1)外=濃色or白、内=反対色で締める[3][4] MaxFilter二段
5微傾き(±2〜3°)水平だと静的→動きが出る[9] rotate
6上ハイライト帯文字上端だけ白く=ツヤ/箔感中 マスク上半グラデ
7属性バッジ「巨乳」「NTR」「総集編」等の小タグ rounded_rectangle
8煽り帯(キャッチ)主題字の上下に刺さる一文(細字) text + 半透明帯
9版ズレ/色収差ピンク影を数px横ずらし=ポップ[2] offset paste
10ジャンプ率(大中小)主題字100:煽り42:バッジ30の比[9] fs比固定

第4章 技術スタック ― 売れる題字ロゴ「5型」の確定値

ここが本DRの心臓。我々が量産すべき題字を5型に定め、各型の確定値(縁/影/グラデ/袋文字/級数/配置)を全て数値で固定する。基準: 題字本体高さ H_title = 画面高 × 0.10(=高さの10%、後述)。すべての px は H_title からの比で書くので、どの画像サイズでもスケールする。supersampling はSS=2〜4で描いて LANCZOS 縮小し、ジャギを消す前提[10]

級数(きゅうすう)の読み替え: 印刷の「級」は1級=0.25mm。Webでは fontsize(px) で運用する。本DRの「級数」列は fs = H_title に対する倍率で示す(例: 主題字 fs=H_title)。

型1: 王道ピンク縦グラデ袋文字(NTR・寝取り・調教の本命)

要素確定値備考
フォント太ゴシック(源ノ角ゴシック Heavy / ロゴたいぷゴシック)細明朝はサムネで死ぬ
本体グラデ(255,143,192) → 下 (192,30,110) 縦上明下濃が鉄則
外フチ(白)太さ = fs × 0.14(=H_titleの14%)MaxFilter(半径 ow)
内フチ(濃ピンク)太さ = fs × 0.07(外の1/2)[3][4]外2:内1の黄金比
落ち影色(20,6,18,128)/ぼかし=fs×0.14/オフセット=fs×0.045 右下不透明度50%
上ハイライト文字上端30%に白20%オーバーレイツヤ
傾き-3°左上がり
級数(fs比)主題字=1.00 / 煽り=0.42 / バッジ=0.30ジャンプ率
配置上12% or 下12%(顔・胸・股間を避ける)第5章の回避帯

型2: 金箔ゴージャス(サキュバス・女王様・高級感)

要素確定値
本体グラデ(255,243,196) → 中 (231,200,122) → 下 (154,106,30) の3点縦
箔ハイライト上端18%に純白(255,255,255,220)を細帯で。シャープな白線が金属感の核
外フチ濃茶(60,30,8) 太さ fs×0.12
内フチ無し or 暗金(120,80,20) fs×0.05
色(0,0,0,140)/ぼかし fs×0.10/オフセット fs×0.04
傾き0°(高級感は水平で重厚に)
級数主題字=1.00 / サブ「Vol.2」等=0.38

型3: 黒×赤 強印象(NTR堕とし・絶望・ダーク)

要素確定値
本体ベタ (17,17,17) または上黒→下 (122,12,12)
外フチ(214,0,90) 太さ fs×0.13
内フチ白 fs×0.05(黒地に白で締める)
赤グロー赤(255,40,40)を stroke+4 で描きGaussianBlur fs×0.2 → 後ろに敷く
不要(グローで浮く)
傾き-2°
用途暗い背景イラスト専用。明るい背景では型1へ

型4: ポップ版ズレ(JK・ラブコメ・明るい寝取られ)

要素確定値
本体白(255,255,255)ベタ
版ズレ影ピンク(255,90,160)を右下に fs×0.05 ずらして複製[2]
外フチ濃ピンク(214,0,90) 太さ fs×0.10、位置=外側[2]
網点ハーフトーン(点・サイズ1相当)をソフトライトで薄掛け[2]
傾き-4°(ポップは大きめに振る)
級数主題字=1.00 / 煽り=0.45 / ハート装飾アイコン散らし

型5: 縦書き極太(和風・陵辱・調教・巻数物)

要素確定値
組み縦書き右→左。文字間 = fs×0.05 アキ
フォント極太ゴシック or 筑紫B見出し明朝
本体白系 → 下 (122,18,64) 縦グラデ
外フチ墨(20,10,16) 太さ fs×0.12
朱差し1〜2文字だけ朱(196,30,30)で替える=視線の核
配置右端 or 左端の縦帯(顔の反対側)。胸を縦書きで塞がない[本DR第5章]
傾き0°(縦は傾けない)

第5章 収益試算 ― 表紙改修のROI

表紙改修は1回作れば全作品・全言語ページに効き続けるストック投資。試算前提を置く。

項目改修前改修後(本DR5型適用)
一覧CTR(仮)1.0%1.7%(縁・暖色・3段で+70%想定)
月間一覧露出50,00050,000(同条件)
詳細流入/月500850
CVR(詳細→購入)3%3%(中身同一)
販売数/月1525.5(+70%)
客単価¥770¥770
月売上¥11,550¥19,635(+¥8,085)

改修コストはPIL実装で半日(¥0の自己工数)。1作品あたり月+8千円なら、稼働作品が10本あれば月+8万円。CTRは作品ごとに当たり外れがあるが、縁取り・暖色・3段ジャンプ率の3点は外れがほぼ無い底上げであり、ROIは桁違いに高い。

第6章 表紙レイアウトの黄金構成

6-1 視線誘導(Z型 / N型)

横書きは左上→右下のZ型、縦書きは右上→左下のN型に視線が流れる[12]。最も目立つ左上(横書き)/右上(縦書き)に一番打ち出したい要素を置く。逆に目立たない隅(右上・左下)にサークル名やVol番号を逃がす[12]

6-2 キャラ配置と題字の干渉回避(我々の実装で最重要)

売れる絵は顔・胸・股間(見せ場)に文字を被せない。我々の compose() は既に avoid_boxes() + 見せ場保護帯((0.18,0.34,0.86,1.0)等)を実装済で正しい。題字はこの回避帯の外=画面上12% or 下12%の横帯に置くのが基本。

キャラ構図題字の置き場理由
顔が上・体が下(立ち)上12%横帯 or 右の縦帯(型5)顔の上=空が空きやすい
顔が中央(バストアップ)下12%横帯上は髪、下に余白
絡み(横長見せ場)上12% + 下に煽り帯中央は絶対死守
引きの全身左上Z起点に斜め大題字背景余白を使う

6-3 黄金構成テンプレ(560×420 / 1200×1700 共通比)

ゾーン縦位置(画面高比)中身級数
煽り帯(上)0.02〜0.09刺さる一文「寝取られた妻は…」0.42
主題字0.04〜0.16(上配置時)作品名(5型から選択)1.00
キャラ見せ場0.18〜1.00絵(無加工で死守)
属性バッジ主題字の右 or 下端巨乳/NTR/総集編/CG○枚0.30
サークル名右下or左下隅小さく逃がす0.22

6-4 帯(おび)の設計

背景が複雑な絵でも題字を読ませる「下地」。我々は既に暗バンド(左右フェード, alpha150, GaussianBlur2)を実装済で正しい[本DR第10章]。煽り文には半透明の色帯(主題字グラデの濃色を alpha 200)を一本敷くと格段に締まる。帯の高さ=その行のfs×1.4。

第7章 リスク ― 素人っぽさが出る5つの地雷

地雷症状確定回避値
黒一色ベタ文字絵に貼り付いて沈む必ず白外フチ fs×0.14 + 影
フチ太すぎ文字が潰れて団子外フチ ≤ fs×0.16 で止める
細明朝をサムネに300pxで線が消えるサムネ題字は太ゴシック固定
色4色以上うるさい・安っぽい配色は3色以内[7]
水平+全部同サイズ静的・素人-2〜-4°傾き + 3段ジャンプ率[9]

第8章 30日プラン ― title_logo() を5型エンジン化

タスク成果物
1-3title_logo()style 引数(5型)を追加type1〜5 分岐
4-7二重縁取り(外2:内1)を MaxFilter二段で実装内フチ追加
8-12上ハイライト帯(マスク上30%白20%)を全型へツヤ/箔
13-16煽り帯(色帯+細字)+ -3°微傾きを追加動き
17-215型×既存表紙でA/Bサムネ生成→4AI採点勝ち型確定
22-26勝ち型を全稼働作品の表紙へ一括再生成横展開
27-30DLsite反映後7日のCTR比較ログ効果実測

第9章 撤退ライン

第10章 落とし穴 ― 我々の title_logo() を更にプロ化する具体改修7点

title_logo()(engine v11)を精査した。暗バンド/白フチ(MaxFilter)/縦グラデ(マスク)/ソフト影/バッジの6層を持つ良い実装。だがプロ題字に対して欠けている7点がある。下記は実コードに対する具体差分。

改修1: 二重縁取りを足す(最優先・効果大)

現状は白フチ1枚のみ(dil=mk.filter(MaxFilter(ow*2+1)))。これに内側の濃色フチを1枚足すと一気に締まる。黄金比は外フチ:内フチ = 2:1[3][4]

現状
白フチ ow = max(5, fs//7)*SS の1枚。背景が白い絵だと文字が背景に溶ける。
改修
外=白 ow、その内側に濃ピンク内フチ iw = ow//2(MaxFilter(iw*2+1)を本体マスクから作り、白フチと本体の間に合成)。外2:内1で立体感が出る。

改修2: 上ハイライト帯(ツヤ/箔)

本体グラデは上明→下濃で良いが、最上部だけ純白の細帯を足すと金属/濡れたツヤが出る。実装: 本体マスク mk上端18%だけを別マスク化し、(255,255,255,210)を alpha_composite。型2(金箔)で必須、型1でも効く。

改修3: -3°微傾き

lay は水平合成のみ。プレート/題字レイヤーを lay.rotate(-3, resample=BICUBIC, expand=True) してから合成。±2〜3°が自然な黄金値[9]。型2/型5は0°のまま(引数 tilt で型別制御)。

改修4: 煽り帯(キャッチコピー行)

sub は右の小バッジのみ。これとは別に主題字の上に細字の煽り行(fs×0.42)を半透明色帯付きで描く引数 tagline を追加。「寝取られた人妻が堕ちるまで」等。ジャンプ率(主100:煽42)で情報が立体化[9]

改修5: style引数で5型を切替

現状 accent/accent2 の2色しか受けない。style="type1".."type5" を受け、グラデ色・フチ色・傾き・ハイライト有無・版ズレ有無を辞書で一括差し替え。第4章の確定値テーブルをそのまま STYLES = {...} に落とす。

改修6: 版ズレ影(型4ポップ用)

型4のときだけ、本体を右下 fs×0.05 ずらしたピンク複製を背後に敷く[2]。色収差風で一気にポップ化。実装は page.alpha_composite(lay_pink,(tx+dx,ty+dy)) を本体合成の前に1行。

改修7: supersampling を SS=2→3 に

SS=2。二重縁取り+ハイライトを足すと細部が増えるのでSS=3に上げて LANCZOS 縮小するとジャギが消える[10]。メモリは1.5倍で済む(題字レイヤーのみの拡大なので軽い)。

優先順位: 1(二重縁取り) → 4(煽り帯) → 3(微傾き) → 2(ハイライト) → 5(5型化) → 6(版ズレ) → 7(SS)。1だけでも今日プロ寄りになる。

参考: 改修1の最小差分(疑似コード)

# 現: 白フチ1枚
ow=int(max(5,fs//7)*SS); dil=mk.filter(ImageFilter.MaxFilter(ow*2+1))
wl=Image.new("RGBA",(bw,bh),(255,255,255,0)); wl.putalpha(dil); lay.alpha_composite(wl)
# 改修: 内側に濃色フチ(外2:内1) を白フチと本体の間に
iw=max(2,ow//2)
inner=mk.filter(ImageFilter.MaxFilter(iw*2+1))
il=Image.new("RGBA",(bw,bh),accent2+(0,)); il.putalpha(inner)
lay.alpha_composite(il)   # 白フチの後・本体グラデの前
# このあと従来どおり g(縦グラデ本体)を alpha_composite

第11章 既存資産活用 ― 今あるコードと知見の流用

第12章 関連DR一覧


脚注(全URL・実在確認済)

  1. DLsite推奨解像度・カバー画像560×420(4:3)/横長一覧表示の根拠(クリエイター実測まとめ) ― https://x.com/ririsu_org/status/1509439633209237506
  2. 版ズレ風ロゴの確定値(境界線6px外側赤/3px中央白/中間値半径3px/ハーフトーン点) ― MdN「ポップでガーリーな版ズレ風ロゴ」 https://www.mdn.co.jp/design/tutorial/5195
  3. 二重縁取りの黄金比 外10px:内5px(=2:1) ― CGDOOR「文字の縁取りを二重にする3つの方法」 https://cgdoor.jp/column-photoshop-2/
  4. 袋文字/縁取りの基本数値(サイズ3px・中央・白等)+二重縁取り運用 ― お絵かき講座パルミー「タイトルロゴの作り方」関連 https://www.palmie.jp/lessons/328
  5. DLsite 2024年リリース51万超作品/レッドオーシャン規模・アワード ― 4Gamer「DLsiteアワード2024」 https://www.4gamer.net/games/999/G999905/20250127024/
  6. DLsite/BOOTH出品画像仕様(カバー560×420・サムネ300×300正方・サンプル長辺2000px) ― Hina Works「AIイラストをDLsite/BOOTH出品用に自動パッケージ」 https://note.com/hinaworks/n/n00da7c3143d0
  7. 配色3色以内・色彩心理・補色の視認性 ― マーケトランク「アイキャッチとは」 https://www.profuture.co.jp/mk/column/what-is-eyecatch
  8. アイキャッチのコントラスト/誘目とCTR測定 ― 株式会社SEVEN「アイキャッチ画像とは」 https://seven-inc.co.jp/branding/strategy/eyecatch/
  9. 大中小3段のジャンプ率・微傾き・はみ出し・文字を絵に被せる動きの出し方 ― お絵かき図鑑「同人誌の表紙デザイン」 https://oekaki-zukan.com/articles/39608
  10. 袋文字の光彩(外側)確定値(色#fdbfb7/スプレッド10%/サイズ10px) ― ミトラボ「境界線をぼかした袋文字風」 https://mito-lab.com/photoshop-fontoutlinemild/
  11. 遠くから目立つ配色ランキング(黄×黒/赤×白/暖色誘目/明度差彩度差) ― イタミアート「目立つ色の組み合わせ」 https://www.i-noren.com/column/striking_color_combination
  12. 視線誘導Z型/N型・左上に主役・隅にサブ情報 ― 自費出版の教科書「失敗しない同人誌の表紙レイアウト」 https://www.net-seihon.co.jp/media/cover
  13. 同人誌表紙の文字配置アイデア集 ― MediBang Paint「同人誌の表紙デザイン&文字配置アイデア」 https://medibangpaint.com/use/2023/11/medibang-doujinshi-cover-design-and-txet-deployment-idea/
  14. 同人誌向けタイトルロゴ加工レシピ20種(字間/傾斜/囲い/縦横混合) ― kuma工房「不器用でもそれっぽいタイトルロゴ加工レシピ集」 https://kumakobo.info/blog/dojin/logo_recipe/
  15. 同人誌表紙レイアウトのコツ(見せたいものを左上に最大化) ― しまうま出版「同人誌の表紙レイアウトのコツ」 https://publish.n-pri.jp/contents/00036/
  16. ロゴタイトル風レイヤースタイル(立体感+縁取り+グラデ重ね) ― こなたろ note https://note.com/konataros/n/nb877fc68e24a

本DRはCC3領域(コンテンツ/DR)。下書きは収集1次情報16ソース+現 title_logo() 実コード精査の統合で執筆(確定値整理タスクのため Grok reasoning 不使用=コスト¥0)。脚注は全URL実在確認済・hallucination無し。