---

name: thumbnail-generator description: "AI Solo Craft記事のサムネイル画像生成スキル。Pollinations.ai背景 + ffmpegテキストオーバーレイのハイブリッド方式。「サムネイル作成」「サムネイル生成」「OGP画像」「画像生成」などの作業に使う。"

thumbnail-generator

Pollinations.ai 背景生成 + ffmpeg drawtext オーバーレイのハイブリッド方式。

仕様

• 出力: 1200x630 の .jpg
• 保存先: public/thumbnails/{slug}.jpg
• DB: contents.hero_image_url を /thumbnails/{slug}.jpg に更新

Do Not Use

• SVGキャラクター + Sharp の Illustrated Card 方式
• scripts/generate-thumbnail.mjs --no-ai
• scripts/thumbnail-variants-v2.mjs
• Unsplash 直叩き（特別な理由がない限り）

手順

Step 1: 記事内容の分析

slug、タイトル、公開日、記事テーマのキーワード1-3個を確認。

Step 2: 背景を生成

bash ~/.openclaw/skills/thumbnail-generator/scripts/generate-background.sh \
  public/thumbnails/[SLUG]-bg.jpg \
  "abstract editorial background for AI news about [TOPIC]"

プロンプトのコツ:

• 記事テーマを英語で表現
• 関連企業のブランドカラーをヒントに含める（例: purple coral tones for Anthropic）
• スクリプトが cinematic lighting, layered composition, premium magazine art, no text を自動追加する

Step 3: テキストオーバーレイ

bash ~/.openclaw/skills/thumbnail-generator/scripts/overlay-text.sh \
  public/thumbnails/[SLUG]-bg.jpg \
  public/thumbnails/[SLUG].jpg \
  "[CATEGORY]" \
  "[TITLE]" \
  "[SUBTITLE]"

Step 4: 一時ファイル削除

rm -f public/thumbnails/[SLUG]-bg.jpg

Step 5: DB更新

bash ~/.openclaw/skills/thumbnail-generator/scripts/update-db.sh [SLUG]

Quality Bar

• 抽象背景だけで終わらせない（テキストオーバーレイ必須）
• テキストだけの単調なカードにしない（リッチ背景必須）
• 暗すぎる背景や単純グラデーションのみで済ませない
• 記事テーマと背景の意味が合わない場合はプロンプトを作り直す
• 複数記事で同じ背景画像を使い回さない

⚠️ よくある落とし穴

• Pollinations.ai がHTMLエラーを返す: generate-background.sh が自動検証するが、エラー時はプロンプトを変えて再試行する
• ffmpeg が無言でテキストなし画像を出力: フォントパスが存在しない場合に起きる。出力画像を目視確認すること
• DB の hero_image_url 更新忘れ: 画像を配置しても DB を更新しないと表示されない。Step 5 を必ず実行
• 背景一時ファイル -bg.jpg の削除忘れ: git commit に含まれてしまう
• テキストなし画像をそのまま使う: 品質基準を満たさない。必ずオーバーレイを合成する