脇の毛穴から薩摩芋

主に映像編集技術向上のための何か

【After Effects】カウントダウンの作り方

未来と過去どちらか一方に行けるとしたら

どちらに行きたいですか?

 

どっちも行きましょう。

(ただし映像でな!)

 

 

というわけでカウントダウン(カウントアップ)の作り方です。

カウントの表現方法にもいくつかありますが

ここではスロットのようにくるくるカウントする方法を紹介します。

*簡易版も最後に紹介します

f:id:nodoame_troche:20200529120407g:plain

1桁だけ考える

まず0から9までの数字を縦に配置

f:id:nodoame_troche:20200529114117p:plain

 

次に、[エフェクト]>[モーションタイル]を適用します。

 

f:id:nodoame_troche:20200529114157p:plain

[スケール]を調整して、

モーションタイルによって複製された数字との間隔を調整します。

 

 

上下に複製できたら

1回転ループするように[モーションタイル]>[タイルの中心]を調整しキーフレームを打ちます。

この時、1フレーム毎の移動幅が小さい方が後々きれいに作れます。 

とりあえず5秒で1ループにします。

f:id:nodoame_troche:20200529114855g:plain

 

1ループできたらプリコンポーズして10ループくらい複製。

f:id:nodoame_troche:20200529114933p:plain

ここのループ数は、どのくらいカウントするかによって決まります。

とりあえず10ループあればいいかな。

 

 

イムリマップで1桁ずつ動かす

10ループをプリコンポーズしたら

カウントし始めたい数値を作りましょう。

とりあえず2020で。

f:id:nodoame_troche:20200529115008p:plain

10ループのコンポを4つ並べて、見えなくていいところはマスクします。

 

ここから1192までカウントダウンして鎌倉時代にタイムワープします。

 

1桁目が1回転したら2桁目が回転するように

イムリマップにキーフレームを打って調整します。

f:id:nodoame_troche:20200529120343g:plain

 

 

あとはこの応用で、こう。

f:id:nodoame_troche:20200529120407g:plain

イージングで気持ちの良い動きにしましょう。

 

 

簡易版

もっと簡単でシンプルなカウントの作り方も紹介します。

 

まず適当にテキストレイヤーを作ります。

テキストレイヤーに[エフェクト]>[スライダー制御]を適用。

作ったテキストレイヤーの[ソーステキスト]と

[スライダー制御]>[スライダー]の値を紐付ける。

f:id:nodoame_troche:20200529120643p:plain

 

 

こうするとスライダー制御の値に入力した数値が

テキストとして扱えるようになります。

f:id:nodoame_troche:20200529120710p:plain

 

 

つまりキーフレームを打って数値を変化させると

それに応じてテキストレイヤーの数字も変化します。

f:id:nodoame_troche:20200529121258g:plain

 

あとはソーステキストに、Math.floor()を追加することで

小数点以下切り捨てにすることができます。

f:id:nodoame_troche:20200529121315g:plain

 


以上です。

てか字ちっさ。

カウントダウン (宝島社文庫)

カウントダウン (宝島社文庫)

  • 作者:真梨 幸子
  • 発売日: 2020/06/04
  • メディア: 文庫