【Aviutl】文字PV制作マニュアルPart1配置&動き編

動画編集

Noteで公開したものの誰も見ないのでこっちで全て公開します。

Noteでも売っているので、もし購入していただけるとこのブログの応援ができます。

【プレビュー】【初級編】文字PV作成マニュアルPart1配置&動き編|モカ@Mocha|note
ここではよくYoutubeで見るような文字PVの作り方を解説していきます!今(2021/6/15)の私の持っている技術全てをこのシリーズに詰め込みました!文字PVを作るつもりのない人も、MADやMVなどで文字を動かすと一気に華やかになるので、ぜひ学んでみてください!初級編は「文字PVスターターキット」のようなもので、文...

そのままコピペしているので「ここの画像が抜けてるよ!」など不備に気づきましたらコメントで指摘していただけると嬉しいです。

もし好評ならPart2とか出します。

以下本題↓

ここではよくYoutubeで見るような文字PVの作り方を解説していきます!

今(2021/6/15)の私の持っている技術全てをこのシリーズに詰め込みました!

文字PVを作るつもりのない人も、MADやMVなどで文字を動かすと一気に華やかになるので、ぜひ学んでみてください!

初級編は「文字PVスターターキット」のようなもので、文字PVを作るにおいて、必要な基礎知識を詰め込んだものになります!

もちろん、この知識は文字PV以外にも応用できますよ!

この講座はAviutlで文字PVを作る方法を解説しますが、考え方はAEなどにそのまま生かせると思いますので、AE税の方も是非見てみてくださいね!(需要があればAE版も作ります)

注意なのですが、Aviutlの使い方!とかではなく文字PVの作り方に関する知識を詰め込んでいるのでご注意を。

解説の流れ

文字PVの制作手順として、私は

  1. 文字の配置
  2. 動きをつける(カメラ制御含む)
  3. 図形やオブジェクトで飾る
  4. レイヤーを重ねていい感じの質感を出す

といった流れで進めています。

ここでは上の工程を3パートに記事を分けて解説していきます。

Part1では「文字の配置や動きのつながり」を解説します。

ここでは、文字を配置する時の考え方や、配置例、さらに文字の動かすときに使える法則など、応用できる知識を応用方法まで、全て教えます!

基本的に真似すればある程度のものが作れるようになるように、丁寧に解説していきます。

また、「ここがわかりずらい!」と思いましたら、コメントしていただければ加筆しますので、よろしくお願いします!

Part2では「図形の簡単な使い方やカメラ制御を用いたエモおい空間の作り方」を解説します。

文字だけではなく、図形などを使ってさらにエモく見せるための方法を解説します。

小難しい「モーショングラフィックス」ではなく、真似すれば何とかなるやり方や、真似する方法も解説します。

なので、「簡単な」使い方となっています。これだけでもガラッと雰囲気が変わるので、ぜひ効果を体感してみてください!

さらに、3D空間にいい感じの素材を置いて、かっこいい空間を構成する方法も解説します。もちろん具体例や考え方も解説しますよ!

これらは今すぐ真似でき、手っ取り早く動画のクオリティを上げることができるので、「今の動画に図形とか取り入れたいけどうまくいかない人」にとてもおすすめです!

エモい図形の作る方法以外に、素材の配布もしますのですぐに実践できます!

Part3では「それっぽい質感を出す方法」について解説します。

【Aviutl】いい感じの質感の出し方
Aviutlでそれっぽい質感を出す方法を8個ほど紹介してみます。 全部やるとやりすぎになるかもしれないので、自分の好みのものを使ってみてくださいね。

(↑で公開しています。)

ほとんどの動画って、なんというか「いい感じの質感」がありますよね。(語彙力)

色調補正やいろいろな素材を合成していきます。

あんな感じのリアルな質感を出す方法を我流ですが、すべて伝授します!

このPart1~Part3がそろって、「初級編」は終了となります。

しかし、この3つの記事を読み、実践していただければそれなりの文字PVを作れるようになるはずです!

前提

当記事はAviutlを1から設定していくことはなく、あくまで文字PVの作成方法を解説しているものです。

ですので、AviutlやAEがある程度使える方を対象としています。

具体的には

・文字や図形の出し方がわかる

・カメラ制御やグループ制御をすこし知っている

・イージングが使える環境(使ったことがなくてもOK)

という方であれば大丈夫です。

もしそうでない方は、自分の使っているソフトのインストール方法などを解説した動画を見てくださいね。

なお、Aviutlの方はUndoFish様のイージングスクリプトをインストールしておきましょう。

【AVIUTL】イージングスクリプト トラックバー対応版【スクリプト配布】
【AVIUTL】イージングスクリプト トラックバー対応版【スクリプト配布】 Flashでお馴染み、Tweenな感じのイージングスクリプトトラックバー対応版です。

今回作っていく動画の完成品

前置きが長くなりましたが、ここからが本編となります。

早速文字PVを作っていきましょう!

今回作る映像はこちらです!

いかがでしょう?

音はないですが、wowakaさんのアンノウンマザーグースの歌詞に合わせて作っています。(https://www.youtube.com/watch?v=P_CSdxSGfaA)

初心者でここまで作れたらすごくないですか?

この映像を作るのに必要な技術はこの講座ですべてお伝えするので、ご安心ください!

文字PVを作るための準備

スクリーンショット (1651)

まず、新規プロジェクトを作成します。

画像サイズは特にこだわりはないので、1920*1080にしています。

フレームレートは30や24(12でも可)がいいです。

というのも、FPSを高くするとなんだか微妙な仕上がりになることが多いので、慣れないうちは24か12くらいにしときましょう。

無駄にFPSを高くすると違和感が生じますし、誤魔化しも出来なくなります。

逆にFPSは低いと映像が脳内補完されて完成度が高く見えます。

また、映画やテレビもFPSが低いので、こちらに合わせたほうが無難でしょう。

本当にモーションに自信のある方以外はやめておきましょう。

スクリーンショット (1650)

そしたら背景を配置しましょう。

スクリーンショット (1649)

色は好みでいいのですが、基本白か黒にしてモノクロ+差し色(赤や青)という配色にすると何とかなります。

画面が一色に染まったらOKです。

スクリーンショット (1647)

次にテキストを歌詞に合わせて配置していきます。

細かく区切るほど動きが多くなります。

今回の歌は激しめなので細かく文字を区切っています。

逆に落ち着いた歌なら、1文ごとに区切っても大丈夫かもしれません。

この部分は後々調整できるので、作っていてコレジャナイ感を感じたら調整しましょう。

基本的に「1単語+α」くらいで区切るのが私のお気に入りです。

「私は/知ってるわ/この場所は/いつでも」といった感じで今回は区切ります。

スクリーンショット (1648)

次に、一文字ずつばらします。

さっき配置したテキストをコピペして並べていきます。(かなりめんどくさいです)

こんなことをする理由として、基本的に一文字ずつ動かしたほうが映えるからです。

(AEならDecomposeTextとUtilityBoxで簡単にできます。)

後で話しますが、基本的に「情報量が多くなるとおしゃれに見える」ため、文字をそれぞれ別の動きをさせたほうがおしゃれに見えます。

ここで、詳しい人は「は?DelayMoveとか使わんの?」と思ったかもしれません。

確かに、「DelayMove」というスクリプトは、文字を個別に動かせますが、あれは文字を等間隔にしか動かせないんですね。

なので、歌の歌詞に合わせて文字を登場させたいときには不向きだと私は思います。

もちろん「DelayMove」の簡単な使い方や使いどころも解説するので、安心してくださいね(笑)

これで文字を配置したり動かす準備が整いました。

文字配置のルール

ではまず、文字を配置していきましょう。

といっても、文字の配置にはいくつかルールがあり、これを意識すればぐっと配置しやすくなると思います。

スクリーンショット (1652)

まず、大きさや位置はバラバラにすること。

基本的に漢字を大きく、平仮名は詰め込んでいます。

基本一文字目を大きくすれば映えます。

他にも強調したい部分は文字を大きくするのもアリです。

上の画像では、あえて「こ」を斜めに回転させたりして、不均一さを出しています。

送り仮名や接続詞?(「は」とか)は小さくしてしまいましょう。

スクリーンショット (1655)

3文字くらいの時は、1文字目を大きく、残りを小さくして縦に詰め込んだりできます。

この配置の仕方はよく使う気がするので、覚えておくといいと思います。

スクリーンショット (1654)

次に、文字をできるだけ詰め込むこと。

文字の間に無駄な空間ができないように、かつ文字同士が被らないように配置するのがコツとなります。

文字を図形として見てみると、パズルのように配置できると思います。

スクリーンショット (1654)

例えば、この文字なら、赤い円で囲んだ部分が隙間になってしまうので、文字のでぱった部分を差し込んでいます。

大したことのないように見えますが、これをするとそれっぽくなります。

スクリーンショット (1654) - コピー - コピー

他に「文字を詰め込むときは、上下交互に詰め込む」のもコツに一つだと思います。

赤と青のわっかで囲った部分のように、上下交互に詰め込んでいます。

もし縦書きなら左右交互でもいいと思います。

後に説明しますが、文字を交互に動かすとおしゃれに見えるので、そのための下準備としても機能します。

スクリーンショット (1653)

この二つのルールを使うと、こんな配置もできます。

スクリーンショット (1653)

ほとんど横一列に並べているだけですが、途中で「られ」や「こと」を盾に並べたり、「たって」の位置をずらし、間を狭めることによって、なんだかおしゃれに見えます。

スクリーンショット (1656)

他にも、このように「1フレーズの1文字目」を強調するのはよくある手法です。

「心」と「抱」が同じ配置になってしまうときは、文字の色を変えてやればマンネリ化を回避できます。

スクリーンショット (1656) - コピー

また、「心」の文字をあえて離れた位置に置き、三角形のように小さい文字を配置したりします。

文字は三角と四角形のように配置することを意識すれば、文字の配置が簡単に思えるはずです!

動きのつなげ方

文字を動かす前に、映像で重要な要素として、動きのつなげ方があります。

文字自体の動きではなく、画面(シーン)の動きです。

百聞は一見如かずといいますし、実際にこの映像を見てみましょう。

 

文字全体の動きに注目してみましょう。

ズームからズーム、移動から移動と動きがつながっているように見えます。

スクリーンショット (1663)

もちろん、文字が変わって部分はシーンが変わっているのですが、シーンの切れ目が目立たず、つながっているように見えます。不思議ですね。

このように、シーンごとの画面の動きをつなぐのです。

これは非常に重要な技術ですので、ぜひ身に着けちゃいましょう!

シーンの動きには大きく分けて3に分けられます。

もちろん文字の動きにも使えます。

1.入場

スクリーンショット (1677)

基本的に「イーズアウト」が使われます。

文字を画面に登場させる動きです。

コツとして「あまり動かしすぎないこと」が挙げられます。

基本的に「方向がわかる程度」でいいのです。

大きく動かすとなぜかダサく見えます。

2.退場

スクリーンショット (1679) - コピー

こちらは「イーズイン」を用います。

この入場と退場の方向をある程度合わせておくと自然な動きに見えます。

(左から入場したら右に退場させる等)

こちらも「大きく動かしすぎないこと」が重要です。

これから動く方向がわかればそれでいいです。

3.余韻(直線移動)

今回使いませんが、余韻も重要なのでここで教えてしまいます!(笑)

これもクオリティアップに重要な手法で、入場した動きの延長のようなものです。

滑らかに入場したのはいいものの、ぴたっと思ってしまうと急に冷めます。

何事も余韻が重要です。

これは画面が静止する時間が長いときに使えます。(手振れと組み合わせると良さげ)

スクリーンショット (1663) - コピー

余韻を入れる方法として、「中間点無視」や「カメラ制御」の「位置補正R」、「グループ制御」で直線移動を追加してあげましょう。

これらの3つが基本となります。

文字PVのみならず、MADでもMVでもゲームのクリップ集でもこれらは使えます。

スクリーンショット (2573)

また、入場と退場は重ね掛けするとより滑らかに見えます。(激しい動きならいらないこともあります)

カメラ制御の場合、入場はカメラ制御で、退場は「カメラ効果→位置補正」でかけたりします。

スクリーンショット (2574)

位置補正はカメラの座標全体をいじれてしまうものです。

カメラ制御でカメラを動かしながら別の動きを付け加えてしまいます。

(parallel cameraと同時に使うとたまにおかしくなるのでZ方向をメインに使っています。)

スクリーンショット (2572)

イージングは重ね掛けするとより滑らかに見えることは知っておくといいと思います。(グループ制御は重ねがけができるので便利です)

スクリーンショット (2575)

ここで、重要な小技を紹介しますが、激しい動きの後は「時間制御」の「コマ落ち」をかけてあげましょう。(少しカクカクさせてあげる)

そうすると、動きにメリハリができクオリティが上がります。

コマ落ちは次のカットで外して元に戻すといいでしょう。

文字のつなぎ方

それでは、動きのつなぎ方を解説します。

こんなもの自力で考えるのは無理があるので、ここである程度教えます。

こういった動きのつなぎ方のテンプレを覚えておけば、いつでも使えるので便利ですよ。

以下「退場→入場」で書いています。

1.横→横

退場の時に動いた方向と同じ方向に入場させます。

この退場(移動)させる先に別のものを置いたりします。

これを視線誘導っていうそうです。

移動させた先ではなく逆から登場させる方法もあります。

スクリーンショット (2577)

スクリーンショット (2578)

これも退場の時に動いた方向と同じ方向に動かしています。

シンプルな動きなのに魅せられます。

App〇eなどのCMでありそう。

スクリーンショット (2576)

間に1フレーム開けるといい感じに見えます。

2.前→後(逆も)

強弱をつけたいときに使えます。

画面いっぱいに文字を出してから、小さい文字で歌詞を書いたり、その逆もできます。

スクリーンショット (2584)

徐々に遠くから文字を近づけて

スクリーンショット (2585)

近づいたら勢いを弱めるイメージです。

私はこんな感じで使っています。

3.回転→回転

90度回転させて横書きを縦書きにする技法をよく見ます

スクリーンショット (2580)

横書きを少しずつ回転させて

スクリーンショット (2581)

縦書きにします。

動きをつなげれば結構わからないもんですよ(笑)

180回転させて退避を表現することもあるっぽいです。

何回も言いますが、コツは回転させすぎないことです。

もし大きく回したいのならモーションブラーなどをつけましょう。

つけないと大変なことになります(笑)

4.回転→移動

立体的に回転させて退場させるのですが、この動きは平面的にみると上下(左右)の移動に見ることができるので、平行移動で入場させます。

スクリーンショット (2582)

右に回転させれば、文字などは右に移動したように見えます。

スクリーンショット (2583)

なので、次のシーンでは左から登場させれば違和感なく動きがつながって見えるようになります。

これをマスターできると一気に表現の幅が広がりますよ。

動きのつなぎ方の例

これらを踏まえ、文字を配置したシーンだけで動きをつないでみてみましょう。

どのつなぎ方を選ぶかは自由ですが、あまり同じものを連続で使わない方がよいかと思います。

動きが単純になってしまうので…

こういう動きのうちに、2つくらい同時に動きを取り入れると複雑な動きに見えます。

拡大+回転はよく見かけますね。私も大好きな動きです。

私は今回、(出だしから)2→3→2→3→3→3→2

とつなぎました。

スクリーンショット (1661) - コピー

ここで、「私は」の文字を「知ってるわ」でも映るようにしています。

特に理由はないですが、立体感を出したかったのでしょう。

スクリーンショット (1661)

レイヤーはこのようになっています。

「私は」のレイヤーを「知ってるわ」と被る部分まで引き伸ばしています。

このように、わざと文字を背景に残す方法もあります。

スクリーンショット (1662)

横から見るとこのように配置しています。

「私は」より手前に文字を配置し、カメラをタイミングよく引いています。

動きをこまめにつなぐのが最近のトレンドっぽいです(私の体感ですが)

これらの文字のつなぎ方は曲の雰囲気と合わせてあげればよりクオリティがアップします。

文字の動かし方の種類

こうして画面の動かし方を設定し終えたら、ようやく文字を動かします。

スクリーンショット (1660)

文字を動かすとき、このように一文字ずつ動かすタイミングをずらしてあげるといいと思います。

出来れば歌詞と同じタイミングで一文字ずつ文字を入場させてあげましょう。

テキストを動かす方法

スクリーンショット (1668)a

まず、配置したテキストに中間点を打ちましょう。

こうすることで、「文字が動く部分」と「止まる部分」を分けることができます。

中間点がないと、だらだら文字が動き続けてしまいます。

スクリーンショット (1669)

「この場所は」で実際に文字を動かしてみましょう。

まず「こ」のテキストオブジェクトを選択し、文字の位置を移動させましょう。

スクリーンショット (1666)

そして文字の開始位置(緑枠の部分)を動かして、文字の入場してくる場所を決めるわけです。

終点はすでに「文字の配置」で決まっているので、どこから入場させるかをここで決めるわけですね。

スクリーンショット (1670)

緑の枠をドラッグして、よさげな場所に移動させます。

ここから文字が動きます。

コツとして、「大きく動かさないこと」です。

スクリーンショット (1670)

始点を緑、終点を赤とすると、上の画像くらいで十分です。

注意点として、文字が移動する際は「ほかの文字と被らないこと」。

移動中にほかの文字と被ってしまうと文字が読みにくくなってしまいます。

なので、文字の軌道上に文字がないことを確認してくださいね。

動かし方の種類

文字PVにおいて、文字の動かし方は以下の8種類くらいあります。

この8種類からいい感じのものを選んで文字に適用します。

ちなみに、複数個選んで文字に適用できます。

1.(直線)移動

一番よく使うもので、ただ文字を動かすだけです。

といっても、これがかなり奥深く難しいところです。

使うイージングや方向なので雰囲気がガラッと変わります。

スクリーンショット (1677)

基本、文字の入場は上の画像のようなイーズアウトがおすすめです。

イージングスクリプトなら、メリハリが欲しいなら「23」,余韻が欲しいなら「27」がおすすめです。

スクリーンショット (1671)

ここで、いい感じの文字の動きにするには「同じ方向に連続で動かさないこと」がコツとなります。

同じ方向に文字を連続で動かしてしまうと、単調に見えてしまうんです。

基本、隣の文字と動かす方向は90度ずらせば何とかなります。

一つの単語は180度方向をずらすと統一感が出ますよ。

スクリーンショット (1675)

もう一つ例を出してみます。

もし同じ方向の文字が並んでしまったら、登場させるタイミングをずらしたり、ほかの登場方法と組み合わせればよくなります。

スクリーンショット (1674)

また、偶数の単語(上の画像なら「場所」)は互いに平行かつ真逆の方向から登場させると、強調できるのでいいですよ。

スクリーンショット (1672)

このように、上下で動かす感じです。

これではあまり面白くないので…

スクリーンショット (1673)

こんな風に移動方向を斜めにすると結構よくなります。

こんな風になります。

歌詞が単語一つだったりするときに使えます。

減衰

最近のマイブームですが、イージング「31」のバウンドというか減衰振動のような波形が好みです(ぼよよーんってなるやつ)

でもあまり奇をてらうとおかしくなるのでご注意を…

余談:文字PVとMVの違いと注意点

逆に、文字をあまりまだ足せたくない場面で同じ方向のみに文字を動かして登場させると、こんな風にエモくなります。

文字PVのような文字主体の映像ではなく、「歌ってみた」動画などのキャラクター中心の映像で役立つ手法です。

キャラを引き立たせたいのに文字をがっつり動かしてしまうと、シンプルに邪魔なので、ここは使い分けましょう!

文字PVとMVは考え方が違いますからね!

(キャラを用いたMVの解説も今後していきます)

イージングの話

文字PVで重要な要素として、動きの緩急があります。

スクリーンショット (1677)

このグラフの形をイーズアウトといいます。

文字がスッと入ってくる奴で、イージング番号は23や27がよく使われます。

スクリーンショット (1679)

これの対となるもので、イーズアウトです。

文字が少しずつ加速していく動きで、これらをつなげると滑らかな動きになります。

これを文字の動きに使います。

スクリーンショット (1678)

赤矢印がイーズアウト(入ってくる動き)で、青矢印がイーズイン(だんだん加速していく動き)です。

これを複製してつなげると以下のようになります。

シーンの動きもつなげていますが、結構いい感じではないでしょうか。

スクリーンショット (1685)

位置補正はシーンの動き、グループ制御は飾りです。

フレームバッファで輝度を反転させています。

このように、似たような歌詞や単語が連続して登場するときに使えます。

2.回転

文字を回転させて登場させる方法です。

こちらもよく使います。

スクリーンショット (1759)

まず、z軸回転で使う方法があります。

大体登場のさせ方はバウンドを使うと思います。

ボヨヨーンって回転させて登場させる感じです。

こうすることで、文字にコミカルな雰囲気が出ますよ。

X,Y.Z軸方向に回転させ、立体感を演出する方法もあります。

スクリーンショット (1763)

このシーンでは、文字を前後バラバラで配置しています。

前から見た時にちょうど良い大きさと一になるように調整しています。

スクリーンショット (1762)

このように、横から見ると前後バラバラですね。

スクリーンショット (1763)

これを一気に回転させると立体感が一気に出て面白くなりますよ。

私は赤線を軸として青矢印方向に回転させています。

スクリーンショット (1764)

全体を動かしたい場合はグループ制御がおすすめです。

スクリーンショット (1765)

参考程度に私の設定した値を置いておきます。

歌に合わせて回転させれば基本エモくなるのでお勧めです。

もちろん、文字を同時に動かしたり回転させて登場させるのもいいと思います。

スクリーンショット (1761)

回転させるときに使うイージングはこのようなものがおすすめです。

なお、余韻を残したいためベジェ軌道を使うことをお勧めします。

回転→止まる→回転では急に止まってしまうため不自然に見えてしまいます。

スクリーンショット (1761)

赤丸の部分は平ではなく、傾きを出しておくことがポイントです。

3.拡大縮小

今回使っていませんが、拡大縮小を使って文字を登場させることも多いです。

スクリーンショット (1766)

拡大率にイージングの35番を適用して登場させるとこんな風になります。

ふわっと広がるイメージでかわいらしいですね。

あまり激しくない曲で、文字を強調したいときに使えます。

バウンドを使ったり、27を使ったりすることもあるようですが、単純に拡大率をいじる方法はあまり見ない気がします。

しかし、「リサイズ」を使う方法はよく使います。

これは移動方向に引き伸ばして使います。

スクリーンショット (1680)

この二つの円で比較してみましょう。

スクリーンショット (1681) - コピー - コピー

モノが動くとき残像が付きます。

直線状に動くとき、方向ブラーのように移動方向に引き伸ばされるように見えます。

しかしーすべての場面でブラーを使うのは違和感が出てしまいます。

スクリーンショット (1681) - コピー

そこで、物体を単純にその方向んい引き伸ばし、垂直方向に潰すことでこれを表現することがあります。

これはモーショングラフィックスやアニメでも使われていると思います。

スクリーンショット (1681) - コピー

比べてみるとこんな感じです。

動画はこんな感じです。

リサイズ使ったほうがポップな雰囲気が出ています。

また、ブラーのほうがリアルな雰囲気があります。

スクリーンショット (1681)

設定はこうしています。

物体がイーズアウトするときリサイズのもイーズアウト、イーズインするときはイーズインさせています。

文字の動きに合わせる感覚ですね。

上で話したことは文字に使うとこうなります。

動きがより複雑になっていい感じになりましたね。

スクリーンショット (1682)

今回はこのように文字を動かしています。

スクリーンショット (1683)

横方向で動かしている文字にはこのようなリサイズをかけています。

スクリーンショット (1684)

縦方向はこのようにしています。

ちなみに、この方法はス〇ブラでも使われています。(私調べ)

4.歪み系

文字を歪ませて登場させる方法です。

ラスターや、渦巻き、引き伸ばしなどですね。

(AEならタービュレントもありますね。)

スクリーンショット (1823)

「す」は引き伸ばしというスクリプトを使っています。

スクリーンショット (1832)

デフォルトでは引き伸ばす方向は横ですが、設定の縦方向をチェックすれば縦方向に引き伸ばせます。

幅部分を表示にチェックを入れると作業しやすいです。

スクリーンショット (1832) - コピー

文字が一部薄くなります。

この部分が引き伸ばされます。

スクリーンショット (1833) - コピー

伸度でどれくらい伸ばすかを、幅で伸ばす部分の幅を、基準で伸ばす部分の位置を、中心で引き伸ばした後の文字の中心を調整できます。

スクリーンショット (1834)

漢字でやると映えます。

スクリーンショット (1824) - コピー

「つ」は渦を追加して歪ませています。

スクリーンショット (1824)

渦量を大きくすると、文字を渦状にできます。

これはシーンのつなぎの動きと連動させてもよさそうです。

スクリーンショット (1827) - コピー

「こ」は領域拡張とクリッピングを使ってスキャン風の文字を作っています。

スクリーンショット (1825) - コピー

スクリーンショット (1825)

文字にクリッピングをかけ、引き伸ばしたい部分まで切り取ります。

スクリーンショット (1827)

そしたら領域拡張を追加し、「塗りつぶし」にチェックを入れます。

チェックを入れないと引き伸ばされません。

これで引き伸ばしたい方向の数値を大きくすると

スクリーンショット (1827) - コピー

こんな風に引き延ばされます。

文字の登場にちょくちょく使えます。

スクリーンショット (1828) - コピー

「い」はラスターをかけています。

以下で説明します。

中でも「一瞬歪ませて登場させる方法」と「歪みを揺らしながら登場させる方法」があります。

スクリーンショット (1767) - コピー

例えば文字にラスターをかけて登場させる場合、振幅を小さくして登場させる方法があります。

このように、歪ませた文字を強調できます。

結構便利です。

スクリーンショット (1767)

イーズアウトを使って振幅を小さくしています。

これは文字がゆらゆら揺れながら登場しています。

スクリーンショット (1769) - コピー

しかし、これに対して文字を思いっきり歪ませたものを一瞬映してから普通の文字を登場させる方法もあります。

このように、グリッチのような効果が得られます。

スクリーンショット (1769)

文字は個別オブジェクトにし、ラスターをかけています。

動いてほしくないので、周期は0としています。

これはシンプルな場面に使えると思います。

背景が実写とかだとより引き立つと思います!

この一文字目だけ一瞬映す方法はよく使われています。

スクリーンショット (1770) - コピー

一文字目をを歪ませたり、縁だけの文字にしたりすることが多いと思います。

スクリーンショット (1771) - コピー

一瞬映したら全部見せる。

これで映像にメリハリが出ていい感じになります。

スクリーンショット (1772)

さらに、このように一瞬で画面を区切る時は白い背景などを1~2フレーム程度挟むと映像にのキレがよくなります。

画面が暗いときは白い背景、画面が明るいときは黒い背景を挟むといい感じです。

要は一瞬真逆の色を挟むイメージです。

これはMADのみならず、実写などでも使えます。

使いすぎると目がちかちかするので注意です。

5.点滅

スクリーンショット (1780)

「点滅して登場」を使って点滅させて登場させます。

ハイテクっぽい演出に使えます。

また、ネオンっぽい演出とかにも使えます。

スクリーンショット (1781)

アニメーション効果一つで使えるので、超手軽です。

「時間」で点滅している時間を、「点滅間隔」で点滅する速さを調整できます。

さらに、登場時間を-にすると点滅退場としても使えます。

Part2で紹介するハイテクっぽい図形に適用すれば無条件でエモくなります。

6.砕け散る

スクリーンショット (1773)

今回使っていませんが、砕け散ったエフェクト(シャター)を逆再生させて、登場させる方法もあります。

スクリーンショット (1774)

文字に「砕け散るT」をかけ、粉砕度を巻き戻します。

こうすると、インパクトのある文字を簡単に表現できます。

7.文字分解

スクリーンショット (1778)

文字を図形と見立てて、パーツごとに分解し、これらを動かして登場させるという、上級テクニックです。

スクリーンショット (1779) - コピー

文字の分解は「パーツ分割」というスクリプトでできます。

スクリーンショット (2023) - コピー

今回はライト版を使ってます。

違いは判らないですがこっちのほうが軽いです。

スクリーンショット (2023)

文字が分解された状態で出てきます。

このままでは1つのパーツしか表示されません。

スクリーンショット (2023) - コピー

これは「順番」の部分が1になっているため、1つ目のパーツが表示されています。

スクリーンショット (2024)

2にすれば二つ目パーツが表示されます。

スクリーンショット (2025)

「個別オブジェクト」にチェックを入れれば全部表示されます。

これは後で活用します。

スクリーンショット (2027)

「設定」の順番可視化にチャックを入れれば…

スクリーンショット (2027) - コピー

こんな感じで文字のパーツの番号が表示されます。

うまくできてないときはしきい値を変えるとうまくいくことがあります。

スクリーンショット (2028)

もし文字パーツを個別に動かしたければ、このようにパーツごとに文字をコピペして動かすしかないと思います。

スクリーンショット (2029) - コピー

「個別オブジェクト」を有効化すれば、軽く動かすことができます。

「座標の拡大縮小」で文字パーツの位置をバラバラにできます。

また、このままでは動きが単純なので「震える」をかければ、文字パーツをそれぞれ振動させることができます。

「間隔」を大きくすればゆったりとした振動になり、手振れのような動きになります。

手軽にできるのでお勧めです。

スクリーンショット (2030)

「ランダム配置@ANM1」をかけても同じようなことができます。

スクリーンショット (2030) - コピー

個数を1、半紙を0,「z軸回転」のチェックを外すとちゃんとした文字になります。

範囲を大きくすれば文字パーツがバラバラになります。

スクリーンショット (1779)

パーツ分割を知らなかったときはマスクとクリッピングで必要ない部分を切り取っています。完全にごり押しです。

8.クリッピング

スクリーンショット (1777)

斜めブラインドや扇クリッピングなど、文字をクリッピングして登場させる方法です。

スクリーンショット (1775) - コピー

扇クリッピングでクルッと登場させる方法もあります。

スクリーンショット (1775)

「拡張角」を小さくして登場させます。

拡張角を大きくするとクリッピングされる部分が大きくなります。

こっちはあまり使ってないです。

スクリーンショット (1776) - コピー

斜めブラインドで登場させる方法もあります。

こっちのほうがよく使っている気がします。

スクリーンショット (1776)

割合を大きくするとクリッピングされる部分が小さくなります。

スクリーンショット (1835)

斜めクリッピングで文字を分割する方法もあります。

スクリーンショット (1836)

このように、斜めクリッピングで文字を2つに分けていて、それぞれ別の動きをさせて登場させます。

文字分解よりお手軽なのにけっこうおしゃれになるのでお勧めです。

歌詞の少ない場面で使えると思います。

ちなみに、どのクリッピングを使うかは完全に好みだと私は思います。

どれを使えばいいの?

「結局この8種類の中からどれ選んだらいいのさ!」というわけですが、「ほとんど直線移動」で大丈夫です。

7:2:1の法則というものがあり、基本的にこの通りにすれば何とかなります。

服の色の選び方もそうですが、白7,黒2,赤1くらいの分量にすると、いい感じに決まりやすいです。

そんな感じで、直線移動を7,あと二つは自由に決めていけばいいと思います。

私は直線移動7,回転2,その他1にしています。

あまり同じものを使いすぎてもマンネリ化するため、その他の部分は本当に適当に決めています。

なんならサイコロで出た数字でもいいと思います。

残り1割の部分はアクセントとなる部分ですので、それぞれ試してみるのが一番だと思います。

文字の動かし方の例

今回私が文字につけた動きを解説していきます。

スクリーンショット (1857)

まず「私は」と「知ってるわ」を分割して配置しています。

これは、歌のテンポが速いので歌詞をこまめに分けて動きを増やそうとしています。

この画面では「私は」と二文字しかないため、文字を斜めクリッピングで2つに分割して個別に動かしています。

ちなみに、青矢印はイージング27番の直線移動、赤矢印はバウンドの直線移動、緑矢印はバウンドで回転して(90度→0度)登場させています。

文字を回転させながら登場させることで動きが複雑になって、二文字でも画面が寂しくなりません。

スクリーンショット (1858)

このまま文字を直線移動のみで登場させています。

直線移動だけでもかなり見栄えがいいです。

スクリーンショット (1864)

タイミングは歌詞に合わせてずらしましょう。

スクリーンショット (1859)

ここでは「場所」という一つの単語を強調すべく、画面の中心付近かつ大きく配置しています。

また、動きはバウンドを使って統一感を出しています。

スクリーンショット (1860)

こっちは画面の動きが大きいので文字の動きは控えめにしています。

スクリーンショット (1861)

ここでは一つの単語のみを動かしています。

ここでは画面を回転させているので見た目は寂しくなりません。

スクリーンショット (1862)

ここも直線移動のみです。

スクリーンショット (1863)

最後は怒涛の文字ラッシュです。

基本は直線移動。たまに文字回転でアクセントをつけています。

直線移動でも登場させるタイミングをズラすと華やかになります。

「来」は斜めブラインドで登場させています。

「!」はバウンドで回転させて登場させています。

これでコミカルな雰囲気が出ます。

これはあくまで私の一例にすぎません。

皆さんはもう「知識」があるためほかの方の作品を見てもどんな手法がわかるようになっています。

結果

お疲れさまでした!最後まで読んでいただきありがとうございます!

内容が長くなりすぎたため、今回はここで区切らせてください!

文字の動かし方などを知識として知ることで、ほかの人の動画を見た時にどんな手法を使っているかわかるようになっていると思います。

今回の記事だけでこれくらいのクオリティになりました。

悪くはないものの、何か物足りないですね。

ここに図形や素材を追加し、さらに質感を良くしていくことで、この映像を仕上げちゃいましょう!

終わりに

こんな感じです。

結構頑張って書いたのですが、このブログよりも見られなかったので無料公開しました()

一応noteでも「有料で」公開しているので見てみてもいいと思います(内容は全く同じですが)

もし購入していただけると私が喜んだりこのブログの寿命が延びたりします。

【プレビュー】【初級編】文字PV作成マニュアルPart1配置&動き編|モカ@Mocha|note
ここではよくYoutubeで見るような文字PVの作り方を解説していきます!今(2021/6/15)の私の持っている技術全てをこのシリーズに詰め込みました!文字PVを作るつもりのない人も、MADやMVなどで文字を動かすと一気に華やかになるので、ぜひ学んでみてください!初級編は「文字PVスターターキット」のようなもので、文...
次は簡単におしゃれになる図形の使い方とかを説明すると思います。

コメント

タイトルとURLをコピーしました