After Effectsについての質問等はAfter Effectsの救世主へ!!

<< After Effectsの魔法使いTOPへ
 


⑫書き順通り文字を書くアニメーション

 

今回は『AfterEffectsの救世主』というページで
頂いた質問をネタにご紹介して行こうと思います。


今回は「文字を書き順通りに書いていく」という動画を作ります。
エフェクトの線を使ってマスクとなるレイヤーを作り、
それを使って文字が書き順通りに書かれていくようにします。

例として自分の名前「郷古」を使った
動画を作成する工程で説明していきます。

1.最初に完成形の文字が書かれた文字レイヤーを用意します。
  (例では「郷古」となっています。)
スクリーンショット

2.次に新規平面レイヤーを作成し、文字レイヤーが
  透けて見えるよう透明度を50くらいに設定します。
  (例では「ブラック平面1」となっています。)
スクリーンショット

3.文字レイヤーの文字をなぞるように
  ペンツールを使ってレイヤー「ブラック平面1」に
  ベジェ曲線の文字を『書き順通り』に書いていきます。
スクリーンショット
  ここで書き順を間違うと、アニメーションにも
  影響が出るので気をつけて下さい。
  ベジェ曲線は『マスク』として表示され、
  およそ文字の画数分くらいのマスクが作られることになります。
スクリーンショット
※ベジェ曲線の文字が完成したら透明度を100%に必ず戻してください。
  これを忘れると完成する動画の透明度にも影響します。

4.このレイヤー「ブラック平面1」に、
  エフェクト→描画→「線」を使います。
  「終了」という項目にキーフレームを作り
  アニメーションを作っていきます。
  スタート「0」→終了「100」という感じです。
  するとこのような動画ができあがります。


※この動画ではブラシの太さを2文字目で調整していますので
  途中で変化しています。
  その辺は臨機応変に対応してみて下さい。

5.次にレイヤー「郷古」のトラックマット設定を
  「ルミナンスマットブラック平面1」とします。
  設定をするとレイヤー「ブラック平面1」の目が
  自動で閉じて、レイヤー「郷古」の文字が見えなくなります。
スクリーンショット
※バージョンが古いAEではトラックマットがありません。
  この場合は
  1.レイヤー「ブラック平面1」をメニューの
   レイヤー → プリコンポーズ とする。
   (「すべての属性を新規コンポジションに移動する」を選択すること)

  2.レイヤー「ブラック平面1 コンポジション1」を非表示にする。

  3.レイヤー「郷古」にエフェクトの
   エフェクト → チャンネル → マット設定 を使います。
スクリーンショット
   ・レイヤーからマットを取り込む→「ブラック平面1 コンポジション1」
   ・マットに使用→「輝度」
   ・他の設定はそのまま
   このように設定していくとトラックマットと同じようになります。


6.動画をプレビューすると、前工程の?ので作られた動画が
  レイヤー「郷古」のマスクとなり、「郷古」という文字が
  書き順通りに書かれるアニメが完成します。



最後に、
再生する途中経過などを見ながら
工程3で作ったベジェ曲線の文字を
ベジェ曲線のポイントを追加したり、
移動したりしながら調整して行けばOKです。

スクリーンショットをよく見て頂くとわかりますが、
必ずしも文字の線の中央をベジェ曲線が通っているわけではありません。
マスクとして機能するよう、隣の部分に影響などが出ないよう
上手に調整してみて下さい。

※補足
  どうしても途中の細かいところは見た目がおかしな部分もあります。
  今回で言えば「郷」の途中、「日」の部分の横線が書かれる時や
  「古」の「十」のクロスする部分などがそうです。

  このような場合はすばやく書かれるようにしてごまかすか、
  使用するフォントを変更してみるとか、はたまたあきらめるか…(笑) 

  ウソウソ!
  別レイヤーをマスクで切って乗せて、覆い隠す等すれば
  なんとかなると思います。

  この方法を使用する時は、ゴシック体のように
  できるだけ文字の太さが同じようなフォントがいいと思います。
  明朝体などには不向きですのであしからず…




2008/11/07/(金)

*********************************************************

こちらは『AfterEffectsの救世主』のコーナーにあった投稿に
お応えする為に後日制作した書き文字を動かした応用の一例です。


上記のような動画にする場合は、トラックマットを設定したレイヤーと
下の図のように親と子の関連付けをして下さい。

スクリーンショット

これを忘れて文字レイヤーだけ動かすと、上の図にある「書き順ベジェ」
のようなキー信号となるレイヤーが追従しないため、
書き文字がずれてしまいますので気をつけて下さい。




仙台発信のCMを
ローカル発信のCMを
向上させませう!

映像と音声の調和。
ヾ(´▽`)ゝ

映像職人JERONI毛
http://jeronimovie.com



2009/02/11/(水)

034457