😵 事件発生 — 動画より、サムネのほうが時間がかかる
編集は終わった。あとは投稿ボタンを押すだけ。……のはずが、そこからが長い。
サムネイルは動画の「顔」。視聴者はこの1枚を見て、観るか観ないかを一瞬で決める。だから手を抜けない——のは分かっている。分かっているから、画像編集ソフトを開いて、文字を置いて、色を変えて、フォントを変えて……気づけば1時間、まだ1案目をこねくり回している。
たちが悪いのは、どれだけ直しても「なんか違う」しか出てこないこと。何がどう違うのか、自分でも言えない。正解を知らないまま、1枚の絵を延々と磨き続ける——出口の見えない迷宮だった。
ぼくおかしいんだよ。動画の編集は「完成」が分かるのに、サムネだけはいつまでたっても「これでいい」と思えない。ぼくのセンスの問題……?
クロードセンスの問題じゃないよ。比較対象が無いのが問題なんだ。1案だけを見つめて「これは良いか?」に答えられる人は、プロでも少ない。でも2案並べて「どっちが良い?」なら、誰でも即答できる。——作ろう、最初から3案出てくる工房を。
🎨 調査 — 世のサムネは、だいたい「3つの型」でできている
3案を同時に出すと決めた。では、その3案はどう作る? ——伸びている動画のサムネを、片っ端から観察した。
数百枚を見て分かったのは、強いサムネには繰り返し現れる「型」があること。①画面いっぱいのデカ文字で押し切る型。②上下に帯を敷いてニュース番組のように整える型。③映画ポスターのように写真を主役にして文字を添える型。——奇抜な1枚を発明するより、実績のある3つの型に、自分の素材を流し込むほうが速くて強い。
ぼく型に流し込むって、ちょっと手抜きっぽくない? オリジナリティは……。
クロード逆だよ。型が土台をやってくれるから、人間は「どの写真を使うか」「何て言葉で釣るか」という中身の勝負に集中できる。プロの現場ほどテンプレートを持ってる。型は創造性の敵じゃなくて、創造性の置き場所なんだ。
📐 山場 — 「どんな長さの文字も、必ず枠に収める」
型はできた。だが最初の試作は、長いタイトルを入れると文字が画面からはみ出した。
サムネの文字は大きいほど強い。でも大きすぎれば、はみ出して読めない。つまり欲しいのは「枠に収まる範囲で、いちばん大きい文字」。人間がやると、フォントサイズを変えては確認……の繰り返し。これこそ機械の仕事だ。心臓部 fitLinesFontSize() は、左右に余白を残した“安全領域”に収まる最大サイズを、2px刻みで自動で探し当てる。
// ざっくり日本語にした擬似コード
const 安全領域 = 画面の幅 - 左右の余白(64px × 2);
let サイズ = 上限の大きさ; // まずは欲張った大きさから
while (サイズ >= 下限の大きさ) {
const 幅 = いちばん長い行を測る(サイズ); // canvasで実測する
if (幅 <= 安全領域) return サイズ; // 収まった!これが最大
サイズ -= 2; // 2pxだけ譲って、もう一度
}
// 3行あれば、行ごとにこの計算をやり直す。
// どんな長さのタイトルでも「収まる中で最大」が自動で決まる
ぼく「収まる範囲で最大」を毎回自動で……。でもデカ文字案、白い文字が白い背景に載ったら消えない?
クロードそこは3層の縁取りで守る。白い本体の文字の外側に黒の輪郭、さらにその外側に強調色の太い輪郭。を重ね着させれば、どんな写真の上でも絶対に沈まない。空でも、雪でも、夜景でも。
🖱 もうひとつのこだわり:背景は「ドラッグ&ドロップで即差し替え」
背景の写真は、ファイル選択でもドラッグ&ドロップでも放り込める。差し替えると3案がその場で全部作り直されるから、「この写真とあの写真、どっちが良いか」も写真ごと比較できる。強調色も6色のスウォッチをポチポチ切り替えるだけ。迷いを全部「比較」に変換するのが、この工房の設計思想だ。
🎉 完成 — 入れて、見比べて、選ぶだけ
1時間の迷宮が、3枚並んだ瞬間に終わった。
タイトルを打って、写真を放り込んで、強調色を選ぶ。それだけでA/B/Cの3案が横に並ぶ。見比べれば、「Bの整い方が今回の内容に合う」と一瞬で言える。あの1時間はなんだったのか。気に入った1枚はPNGで保存、迷うなら3案まとめてZIPで持ち帰って、あとでじっくり選んでもいい。
書き出しはYouTube推奨サイズ固定。アップロードではじかれたり、端が切れたりする心配ごとを最初から消してある。
改行で最大3行。行ごとに「収まる最大」を計算するので、短い行は大きく、長い行は読める大きさに、自動でメリハリが付く。
チャンネルのテーマカラーに合わせてワンタップ。色を変えるたび3案が即座に描き直されるから、色選びも「比較」でできる。
「〜してみた」「第3話」のような添え文字も入れられる。デカ文字の隣に小さく置かれ、情報の階層が自然にできる。
ぼくサムネ作りが「デザイン作業」じゃなくて「選ぶ作業」になった。1時間が、3分になった……。
クロードそしてこのサイトで公開したから、同じ迷宮にいる動画制作者さんは誰でも使える。テロップ工房(第7巻)とセットで、動画の仕上げ工程がまるごと軽くなるよ。
「なんか違う」と1時間悩むより、
3枚並べて「これ」と3秒で指させ。
🖱 実際の画面で、使い方(3ステップ)
できあがった工房を、本物の画面で。「入れる・決める・比べて保存」の3手を、実際のスクショで追います。
タイトルとサブを入れる
上の欄にメインタイトル(改行で最大3行)を打ちます。「第3話」「〜してみた」のようなサブテキストは任意。打った瞬間から、下の3案に即座に反映されます。
背景と強調色を決める
背景の写真をドラッグ&ドロップで放り込み、強調色スウォッチ(6色+カスタム)をタップ。切り替えるたびに3案がその場で描き直されるので、色選びも写真選びも「比較」で決められます。
3案を見比べて保存する
下にA「デカ文字」・B「上下帯」・C「シネマ」が並びます。気に入った案はその場でPNG保存、迷ったら「3案まとめてZIP」で全部持ち帰り。あとはYouTubeにアップロードするだけです。
🔬 おまけ — 顔写真も素材も「外に出さない」
サムネの背景は、公開前の動画の素材や、自分の顔写真になりがち。だから設計の芯にした。
3案の描画も保存も、すべてあなたのブラウザ内()で完結。サーバーには一切アップロードしない。
を厳格にして、自分自身以外への通信・インラインの怪しいコードを禁止。仕組みとして“漏れない”ようにしてある。
背景に使った写真は描画のためにその場で読むだけで、どこにも保存しない。ページを閉じれば消える。便利さのために安全を売らない。
🧠 「外に出さない」シリーズ、3代目
スクショを扱う第6巻 ClipShot、台本を扱う第7巻 テロップ工房、そして素材写真を扱う今回。扱うものは毎回違うけれど、「見られたくない可能性のあるものは、そもそも外に送らない構造にする」という芯は全部同じです。信頼は、お願いではなく設計で担保する。
❓ よくある質問
Q1. サムネ工房は何ができる? お金はかかる?
タイトル・背景画像・強調色を入れると、YouTube推奨サイズ(1280×720)のサムネを「デカ文字」「上下帯」「シネマ」の3案で同時生成し、並べて比較しながら選べる無料のブラウザツールです。登録不要。このサイトの中(/thumbnail-koubou/)から今すぐ使えます。
Q2. 文字が長くてもはみ出さない?
はみ出しません。左右に余白を取った安全領域に収まる最大の文字サイズを自動で探して割り当てます。タイトルは改行で最大3行まで、行ごとに最適サイズが決まるので、長いタイトルでも読めるサムネになります。
Q3. 背景に使った画像は外部に送られない?
送られません。合成も保存もブラウザの中だけで完結し、サーバーには一切上げません。公開前の動画素材や顔写真も、外に出ることなく安心して使えます。
🌙 教訓 — 選ぶ力は、並べる力
大きな発明はしていない。「1案を磨く」を「3案を比べる」に変えただけ。
📌 この一件で学んだこと
- 迷いの正体は「比較対象の不在」。「これは良いか?」には答えられなくても、「どっちが良いか?」には誰でも答えられる。
- 型は創造性の敵ではなく、置き場所。実績のある型に任せた分だけ、言葉と写真という中身の勝負に集中できる。
- 自動化するのは妥協ではなく理想。「収まる中で最大の文字」を、機械は毎回サボらず攻めてくれる。
- 作る道具と評価する仕組みは分ける。工房は「手」に徹して、良し悪しの判定は別の相棒に任せる。
これで、動画づくりの道具箱に「声(ナレメーカー・第3巻)」「文字(テロップ工房・第7巻)」「顔(サムネ工房・第8巻)」の三点セットが揃いました。 この「AI探検隊」は、AIで「Webサイト・音楽・画像」を実際につくって見せる場所です。 あなたの「なんか違う」も、並べた瞬間に「これだ」に変わるかもしれません。