Skip to main content
Participant
January 14, 2024
Answered

文字を使ったモーショングラフィック。

  • January 14, 2024
  • 1 reply
  • 164 views

添付動画のようなモーションを作成したいのですが
このように文字の感覚をバラバラに動かすことができず調べても良い方法がありません。
どなたかご教示いただける方いらっしゃいましたらお助けください。。。

よろしくお願いいたします

    This topic has been closed for replies.
    Correct answer Mukaida

    アニメーターを追加すると出現する「範囲セレクター」を使って文字単位でコントロールできます。


    波のような動きは、三角関数を使用したエクスプレッションを使うとキーフレームなしで作成できます。
    参考動画と同じにはなりませんが、
    一例として、「字送り」で作成してみました。


    字送りの「トラッキングの量」に下記コードを追加。

     

    f = 0.2;
    amp = 50;
    value+amp*Math.sin(f*(time-inPoint)*Math.PI*2)

     


    範囲セレクターの「オフセット」に下記コードを追加。

     

    f = -0.2;
    amp = 100;
    value+amp*Math.sin(f*(time-inPoint)*Math.PI*2)

     

     

     

     

     

     

     

     

     

    元の数値やエクスプレッションの数値を変えたり、エクスプレッションを追加するプロパティを変えたりしてみると良いでしょう。


    複数のレイヤーを使用する場合は、バーを左右に移動させるとタイミングを変えることができます。

    1 reply

    MukaidaCommunity ExpertCorrect answer
    Community Expert
    January 14, 2024

    アニメーターを追加すると出現する「範囲セレクター」を使って文字単位でコントロールできます。


    波のような動きは、三角関数を使用したエクスプレッションを使うとキーフレームなしで作成できます。
    参考動画と同じにはなりませんが、
    一例として、「字送り」で作成してみました。


    字送りの「トラッキングの量」に下記コードを追加。

     

    f = 0.2;
    amp = 50;
    value+amp*Math.sin(f*(time-inPoint)*Math.PI*2)

     


    範囲セレクターの「オフセット」に下記コードを追加。

     

    f = -0.2;
    amp = 100;
    value+amp*Math.sin(f*(time-inPoint)*Math.PI*2)

     

     

     

     

     

     

     

     

     

    元の数値やエクスプレッションの数値を変えたり、エクスプレッションを追加するプロパティを変えたりしてみると良いでしょう。


    複数のレイヤーを使用する場合は、バーを左右に移動させるとタイミングを変えることができます。

    Participant
    January 14, 2024

    Mukaida様

    とても丁寧にわかりやすい説明ありがとうございます。
    こちらの方法で色々と試してみます。
    誠にありがとうございます。