今年こそ挫折しない英語学習をしませんか？ 〜英語学習YouTubeのサムネを自動生成した話〜

こんにちは

100日後に海外赴任が決まり、休日返上で英語を勉強しなければいけないギリギリ英弱エンジニア

へんじょーちゃんです。

英語の勉強、やらなきゃ…ってなったタイミングがありまして。とはいえ、普通の教材だとどうしても長続きしないんですよね。そこで「好きな技術に絡めて英語を触っていこう」と方向転換しました。

せっかくなら学習の記録を残したい。なら YouTube に上げて、同じように英語をやらなきゃ勢のみなさんと一緒に進めたいじゃないですか。…というわけで、動画作りを本格的に始めました。

ただ、ひとつだけ大問題。サムネを作るセンスが、ない。ほんとにない。毎回悩んで止まるのが目に見えていたので、サムネはプログラムで自動生成することにしました。今回はその「サムネメーカー」部分の話です。

サムネメーカー、何がうれしいの？

ざっくり言うと、「構図テンプレート × レイヤー素材」でサムネを組み立てる仕組みです。

• 背景
• キャラ
• テキスト
• DAY プレート（Day 05 みたいなやつ）

このあたりを「レイヤー」として持っておいて、設定ファイルからランダムに引っ張って合成します。

フレーム切り出しに頼らないので、動画の中身に左右されず「狙った見た目」を毎回作れるのが強みです。センスがない私でも、テンプレートさえ作れば戦える…！

実際に生成されたサムネイルはこんな感じです。

どうでしょうか？これが私のセンスの限界点です... 🥺

ざっくり仕組み

サムネ生成の流れはこんな感じです。

1. DAY に応じて構図を選ぶ

   • day_compositions で「何日目はどの構図」みたいに定義
   • 指定がなければ fallback を使う

2. 背景・テキスト・キャラ素材をランダム抽選

   • ファイル指定もディレクトリ指定も OK
   • ディレクトリの場合は中からランダムに選ぶ

3. DAY プレートを動的に描画

   • DAY 05 / 05日目 みたいなテンプレートを複数持てる
   • 文字縁取り（2段階）も指定できる

4. レイヤーを順番に合成

   • 背景 → DAY → キャラ → テキスト の順で重ねる

5. PNG として保存

   • data/output/Sxx/Dyy/thumbnail.png に出力

「日数」「構図」「素材」だけ変えておけば、毎回ちょっと違うけど統一感のあるサムネが生成されます。

設定

設定は config/settings.yaml にまとめてあります。ほんの一部だけ抜粋するとこんな感じ。

thumbnail:
  resolution: [1920, 1080]
  fallback_composition: center
  fonts:
    F1: assets/fonts/Noto_Sans_JP/static/NotoSansJP-Bold.ttf
  day_style:
    templates:
      - "DAY {day:02d}"
      - "{day:02d}日目"
    font_key: F1
    font_size: 320
    text_color: "#000000"
    primary_stroke_color: "#FFFFFF"
    primary_stroke_width: 4
  day_compositions:
    1: center
    2: center
    3: right
  compositions:
    center:
      background: assets/thumbnails/backgrounds
      text_templates:
        - assets/thumbnails/texts/center
      character_assets:
        - assets/thumbnails/characters/center
      text_slot:
        x: 0
        y: 0
        anchor: top_left
        scale: 1.0
      character_slot:
        x: 640
        y: 420
        anchor: center
        scale: 1.05
      day_slot:
        x: 220
        y: 110
        anchor: top_left
        scale: 1.2

ポイントは「素材を置く位置」と「どこをランダムにするか」を分離しているところ。

• 素材は assets で管理
  • assets/thumbnails/backgrounds など
• 配置は settings で管理
  • x, y, anchor, scale で細かく調整

素材を増やすだけでバリエーションが増えるので、運用が楽なのも助かります。

CLI からサムネを作る

サムネを作りたい時は、CLI で生成できます。

uv run english-youtuber thumbnails create --phase S01D05

まとめ：センスがなくても、仕組みで解決できる

サムネ作りって、地味に時間も気力も持っていかれるんですよね。

だからこそ、「テンプレと素材で自動生成」に振り切ったのは大正解でした。センスのなさはシステムで補える。そういう話です。

英語学習もサムネ作りも、続けるためには「摩擦を減らす仕組み」が大事だなと改めて感じました。

一緒に英語やりませんか？

YouTube で英語学習の記録を続けています。

「英語やらなきゃ…でも続かない…」って人がいたら、一緒にゆるく進めていきませんか？

というわけで、へんじょーちゃんでした。またね！