キーフレーム補間法って? リニアとベジェ

キーフレームが設定できるようになったら、次は補間法のおはなしです。

キーフレーム補間法とは?

アニメーションの基本! トランスフォームを使いこなそう! でも触れましたが、キーフレームを2つ以上打つとアニメーションします。
これ自体が補間法で、AとBの間を自動的に補間している、というのがこのキーフレームの補間です。

通常、上記の記事のようなトランスフォームだと
AからB地点に達するまでの移動速度は同じです。

これは同一間隔で補間するという補間法になっているからで、この補間法を変更することで
より滑らかなアニメーションを作り出すことができます。

キーフレーム補間法はAfterEffectsではいくつか用意されています。

キーフレーム補間法を変更する

まずはキーフレームの設定をします、今回は例としてテキストが移動するアニメーションにしています。

キーフレームを右クリックして、キーフレーム補間法を選択します。

設定ウィンドウが出てきます。

このウィンドウの項目を変更することで、キーフレーム補間法が変更されます。

時間補間法

時間の移動に関する補間法です。
先程、初期設定では一定速度というように表現しました。

この時間補間法は、補間量/秒数の設定です。

空間補間法

こちらは秒数ではなく、例えば移動に関しての場合
直角に曲がったキーフレームの補間を行ったり、少しカクカクした動きでも曲線のように補間してくれたりと
空間に対する補間法です。

それぞれリニアになっていますが、ここを変更することで補間法の種類が変わります。

リニア

キーフレーム間を一定量変化します。

ベジェ

ベジェ補間法はキーフレームにベジェ曲線のハンドルが追加されて、手動で変化量を調整できるようになります。
ハンドルはそれぞれ独立しているので移動の場合、はじめが遅く、あとで速くといった緩急あるアニメーションを付けることが可能となっています。

ベジェ曲線って?
  • 2つ以上のポイントを作成し、それぞれのハンドルを操作することで線をつなぐ曲線。
  • Illustratorなどではよく使われていますが癖があるため、何度も使って覚えていきましょう!

自動ベジェ補間

上記のベジェ曲線を、自動的に補間して変化量をスムーズにしてくれます。

連続ベジェ補間

自動ベジェで保管されたキーフレームを、手動でも変更することが可能です。

停止補間

キーフレーム間の数値は保管されず、直前のキーフレームの値が次のキーフレームまで持続します。

キーフレーム補助

AfterEffectsにはキーフレーム補間法の他に、キーフレーム補助機能があります。
これはキーフレーム補間法のAfterEffectsプリセットのようなものです。

イージーイーズ

変化し始めが遅く、中間で最もはやくなり、終盤でまた緩やかに遅くなる補間。

イージーイーズアウト

はじめは遅く、最後にかけてはやくなっていく補間。

イージーイーズイン

イージーイーズアウトの反対で、はじめが速く、最後にかけて遅くなっていく補間。

同じ1秒でも、見た目には大きく違ってきます。

アドバイス
  • 滑らかなアニメーションをする場合は、イージーイーズなどを適用しよう!
  • 逆に機械的なアニメーションではリニアがおすすめ!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください