ホーム > ブログ > テレビ番組の豪華テロップの作り方|金の立体文字・市松模様の右上テロップ・合体して光る登場アニメ

テレビ番組の豪華テロップの作り方|金の立体文字・市松模様の右上テロップ・合体して光る登場アニメ

公開日: 2026年10月5日 最終更新: 2026年10月9日 執筆: 山田一真(カズマル)|株式会社ブイスト代表

テロップを入れてはいるけど、どこか安っぽい。
そんな動画編集者に向けて、テレビ番組のような豪華なテロップの作り方をまとめました。

先に結論を言うと、ダサい編集から抜け出す近道は、テレビ番組の1つのテロップを、設定の数字まで真似して作ってみることです。

上の動画は、テレビ番組の編集をPremiere ProとPhotoshopに落とし込むスキルアップ講座のシリーズ第4弾です。
取り上げたのは「ザ・突破ファイル」。
芸能人がいろいろな難関に挑んで、達成できたら「突破」、できなかったら「突破ならず」という番組です。

実演は、うちで動画編集者向けのスキルアップ研修をしてくれている講師長にお願いしました。
作るのは次の3つです。

今回作るもの

  • テクニック1:金色に光る、立体感のある豪華なテロップ(Photoshop)
  • テクニック2:赤い市松模様のプレートにのった右上テロップ(Photoshop)
  • テクニック3:両サイドから集まって、光って登場するアニメーション(Premiere Pro)

数字の多い記事になりますが、動画と見比べながら手を動かしてもらえたらと思います。

テクニック1:金色に光る立体テロップをPhotoshopで作る

番組でいうと「冒頭1分がやばい」のような、キラキラした豪華なテロップです。
ポイントは、影の部分の立体感。
本体と影を別々に作って重ねます。

本体を作る

横書き文字ツールで文字を打ち、レイヤーをダブルクリックしてレイヤースタイルを開きます。
順番に入れていくのは、次のとおりです。

本体のレイヤースタイル

  • グラデーションオーバーレイ:黄色系を5色。端から中央に向かって明るくして、左右対称に並べる
  • 光彩(内側):描画モード通常、不透明度100、ノイズ0、色F8D267、チョーク10、サイズ3。あるとないとで文字の浮き方が変わる
  • 境界線1つ目:サイズ8px、外側、濃い赤
  • 境界線2つ目:サイズ15px、外側、塗りつぶしタイプをグラデーションに。色はわりと雑でOK
  • ベベルとエンボス:スタイルは外側ベベル、テクニックは滑らかに、深さ200、方向上、サイズ10、ソフト0、角度94、高度26
  • ハイライトは赤(FE5555)で通常・不透明度64、シャドウは黒で乗算・不透明度83

外側ベベルにすると、文字の本体から外側に向かって立体感が出ます。
上から光が当たっている感じになれば、ベースは完成です。

影を作る

文字レイヤーをCommand(Windowsは Ctrl)+Jで複製します。
下のレイヤーから、ベベルとエンボス・境界線1つ目・光彩・グラデーションを外します。

残った境界線を真っ黒にして、サイズを25に。
カラーオーバーレイも黒で追加すると、コピー元よりひと回り大きい真っ黒なテロップができます。

この黒いテロップを右クリックしてスマートオブジェクトに変換。
Shiftを押しながら下矢印を2回、右矢印を1回押して、斜め下にずらします。
これで影の形ができました。

あとは影の作り込みです。
パターンオーバーレイでテクスチャ系の模様を入れ、その上からグラデーションオーバーレイを描画モード「焼き込み(リニア)」でかけます。
色は茶色(8C5D04)から焦げ茶(392801)です。

パターンが見つからない人は、ウィンドウ→パターンを開き、右上のメニューから従来のパターンを追加すると出てきます。

仕上げ

本体と影の2つを選んで、Command(Ctrl)+Gでグループ化。
グループにドロップシャドウを2つ重ねます。
1つ目は白で、距離0、スプレッド80くらい、サイズ5くらい。
2つ目は黄色です。

これで、立体感のあるゴージャスなテロップの完成です。

テクニック2:市松模様のプレートにのせた右上テロップを作る

次は、画面の右上にずっと出ている番組タイトルのようなテロップです。
やることは多いですが、1つずつ進めれば大丈夫です。

市松模様のパターンを自作する

新規ファイルを横200・高さ200、アートボードのチェックは外して、解像度300で作ります。

長方形ツールでShiftを押しながら正方形を描き、サイズを縦横100に。
キャンバスの端にぴったりくっつけて、塗りを濃い赤(C91818)にします。
これを複製して隣に置き、明るめの赤に。
さらに複製して対角線に並べれば、市松模様の1単位ができます。

この状態で、編集→パターンを定義。
名前は自由です。
これで元のファイルはもう使いません。

赤いプレートを作る

本番のファイルで横長の長方形を描き、レイヤースタイルのパターンオーバーレイで、さっき保存した市松模様を選びます。
比率を下げて、四角が3〜4つ見えるくらいに調整してください。

このままだと安っぽいので、グラデーションオーバーレイを足します。
明るい赤から濃い赤(DF1009)へ。
スタイルを反射、角度90、比率84くらいにして、描画モードを「比較(明)」にすると、色がなじんで反射しているような質感になります。

さらに境界線をサイズ2、塗りつぶしタイプをグラデーションに。
下が黒、上が明るいパステルっぽい黄色、真ん中(位置50%くらい)に白を入れます。

黄色いプレートを作る

赤いプレートを複製し、レイヤースタイルのチェックを全部外します。
Shift+下矢印で少し下にずらし、塗りを黄色(FFF000)に。
赤の下から、黄色のふちがのぞく形になります。

その下に2行目用の長方形を描きます。
Shift+Command(Ctrl)を押しながら角をつかんで左に引っ張ると、片側だけ傾けられます。
上のプレートにぴったりくっつけたら、グラデーションオーバーレイで黄色を3色(両端は暗めの黄色 BABC00、真ん中は明るい黄色)。
境界線は2px・外側で、赤いプレートと同じ黒・白・黄色のグラデーションです。

上にのせる文字

上段の文字はフォント「コーポレート・ロゴ ver3」。
境界線は5px・外側・色D02018。
そこにベベルとエンボスを足して立体感を出します。
外側ベベル、テクニックはジゼルハード、深さ168、方向上、サイズ3、ソフト0、角度94、高度26。
ハイライトはスクリーンで白36%、シャドウは乗算で黒35%です。

下段の文字は、グラデーションオーバーレイで真っ黒から少し紫がかった黒(5F4F57)へ。
光彩(外側)を白・スプレッド14・サイズ9で入れ、ベベルとエンボスは外側ベベル、滑らかに、深さ188、サイズ5、ソフト0、角度94、高度28。
ハイライトはスクリーンで白100%、シャドウは乗算でグレー54%。

文字が長方形からはみ出したら、Command(Ctrl)+Tで長方形を伸ばして合わせます。
Shiftを押しながら引っ張ると、横方向だけ伸ばせて便利です。

テクニック3:両サイドから集まって光る登場アニメーションをPremiere Proで作る

最後は、テクニック1で作ったゴージャスなテロップに動きをつけます。
両サイドから集まってきて、ピカッと光って登場する動きです。

使うエフェクトは「波形ワープ」と「プロセスアンプ」の2つだけです。

波形ワープで「集まってくる」動きを作る

エフェクトパネルで「波形」と検索し、ディストーションの波形ワープをテロップに入れます。
そのままだとうねうね動くエフェクトですが、波形の種類を「矩形」、方向を0にします。

波形の高さをぐっと上げると、テロップが分身したようにばらけます。
見えなくなるくらい(2000くらい)まで上げたら、高さにキーフレームを打ちます。

Shiftを押しながら右矢印を2回押すと、10フレーム先に進みます。
そこで高さを0に。
これで、ばらばらだったテロップが合体するような動きになります。

プロセスアンプで「光る」余韻を足す

あとは光らせるだけです。
色調補正のプロセスアンプを入れて、明るさを80にします。
8フレーム進めたところでキーフレームをオン。
そこから26フレーム進めた位置で、明るさを0にします。

すると、合体した瞬間にピカッと光って、その光がじわっと引いていく余韻が出ます。
集まって、ワン、という感じです。

テロップ1つを真似しきると、編集の目が変わる

今回の3つは、どれも特別なプラグインは使っていません。
Photoshopのレイヤースタイルと、Premiere Proの標準エフェクトだけです。

それでも見た目がここまで変わるのは、
テレビ番組の編集が、一つひとつのパーツを細かい数字まで作り込んでいるからだと思います。

テロップを入れられる、四角形が作れる。
そこで止まってしまう動画編集者は、本当に多いです。
一方で、こうやって1つのテロップを数字まで追いかけて作った経験は、次に自分でデザインするときの引き出しになります。

この記事の要点

  • 豪華なテロップは、本体と影を別レイヤーで作って重ねる。立体感はベベルとエンボスの外側ベベルで出す
  • 市松模様は自分でパターン定義して、グラデーションの描画モード「比較(明)」でなじませる
  • 右上テロップは、赤いプレート・黄色いプレート・2種類の文字の4つの重ね合わせ
  • 登場アニメは、波形ワープの高さを2000→0にして合体させ、プロセスアンプで光の余韻をつける

僕も、良い編集を見かけたら「これ、どう作ってるんだろう」と分解するようにしています。
この記事が、自分の編集を一段上げるきっかけになったら嬉しいです。

スキルアップの途中でつまずいたとき、運営としてどう伴走しているかは、ブイプロの評判・口コミ|悪い評判にも運営が全部答えますにまとめています。

カズマル

記事のように手を動かす時間を作るために、ほかの作業をAIで短くするやり方を無料のパックにまとめています。

🎁特別なお知らせ🎁

僕は母の重い病気を救いたいと思い、動画編集を始めました。

編集の基礎スキルしかないまま現場に出て、運良く仕事が取れたものの、納期までに編集ができず、クライアントに迷惑をかけて疲弊しました。

クライアントにも迷惑をかけて、ブラックリスト入りしたこともあります。

僕と同じ経験をする人を減らして、現場で重宝される動画編集者を増やしたいと思い、現場で本当に役立つ発信を日々行なっています。

現場で重宝される動画編集者を増やすプロジェクトの一つとして、累計1600人が受け取った「AI×動画編集 全自動化パック」をプレゼントします。

AI×動画編集 全自動化パック 特典①〜⑤

このパックには5つの特典が付属しています!

特典①「動画編集フルオートメーション講座」
編集速度2倍・クオリティ3倍・単価5倍を実現する方法を体系的に解説した動画講座。AIを正しく使うための編集スキルからAI自動化の実務フローまで全部入り。

特典②「カット・テロップ自動化ツール」
作業時間80%削減。今カットとテロップに使っている時間の大半が消えます。その時間を演出やクオリティアップに回せたら納品物がどう変わるか、想像してみてください。

特典③「アニメーション自動生成AI」
Premiereのプリセットでは絶対に作れなかったレベルのテロップアニメーションが、プロンプトを打つだけで出てくる。

特典④「高品質図解自動生成AI」
プロンプト1行でプロのデザイナーが作ったような図解が出てくる。編集時間を1/5に。

特典⑤「デザイン生成プロンプト」
サムネ・テロップベース・右上テロップ、実際にクライアントワークで使っているプロンプトをそのまま渡します。

受け取り方法は、以下のリンクからLINE登録を行なうと、配布されます。

P.S. 7年前の疲弊する前に欲しかった…

▼LINE登録はこちら(AI×動画編集 全自動化パックを受け取る)