お問い合わせ・無料相談
WEBのこと 2024.10.09

初心者でもはじめられる!ロゴアニメーションのアイデアの出し方【解説】

WRITER
Sasayama Sayaka ディレクター
Sasayama Sayaka

ディレクター。ウェブデザイン技能士(2級)/HTML5プロフェッショナル認定資格 レベル1・レベル2。

初心者でもはじめられる!ロゴアニメーションのアイデアの出し方【解説】

最近すっかりAfter Effectsにハマっているさやさんです。
いくつかロゴアニメーションを作って、こちらで公開しています。

今回はAfter Effectsでロゴのアニメーションを作るとき、
私流の「アニメーションはどのように考えるか(アニメーションのアイデアの出し方)」をご紹介します。

After Effectsとは

After Effectsは、Adobe社が提供する映像制作ソフトです。動画に様々な効果(エフェクト)を加えたり、アニメーションを作成したりすることができます。映画やテレビ番組、CMなど、プロの映像制作現場で広く活用されています。

アニメーションのアイデアの出し方

まずはストックを溜めておく

まずはアニメーションを作るため、アイデアの元となるアニメーションのストックを自分の中で溜めます。

具体的にどうするのかと言うと、たとえばネットや動画ではたくさんの広告がありますよね。
とくに動画の広告は、数十秒の短い間に、目を引くアニメーションの動きをするものが多くあります。
(Adobe等のクリエイティブなデザイン広告が特におすすめです)

また、アニメーション映画、MV、ゲームのオープニングなども、
やはり印象に残るアニメーションを使ったものが多いのでおすすめです。

たとえば、The First Takeのロゴのアニメーションは、
一発撮りである「1」「first」を強く印象付ける動きで、スタイリッシュで記憶に残るアニメーションですよね。

(Bling‐Bang‐Bang‐Born 作業中によく聞いています)

それら、自身が「おっ!」と感じた動きを記憶して、自分の中でストックとしておきましょう。
(今の自分の技術では再現が難しいと感じる動きも、それを目標に学習する! というふうに役立てられるので、ストックはどんどん増やすのをおすすめします)

また、ストックしたアニメーションは単体で使うこともできますが、それらを組み合わせることで、より独創的なアニメーションを生み出すこともできます。なので、ストックは多ければ多いほどいいので、どんどん自分の中のストックを溜めましょう!

アニメーションさせたいもの(ロゴやイラスト)のイメージを言語化する

ただ漠然と「なんかいい感じに動かしたいな~」と考えて作ろうとしても、いいアニメーションは生まれません。

デザインでも、文章でも、それを見た相手に「何かを伝える」目的があるはずです。

アニメーションも同じ。
見た人に「目的」が伝わらなければ、印象に残るアニメーションは作れないと、私は考えます。
なので、はじめに私は作りたいアニメーションのイメージや目的を言語化します。

実際に、アニメーションさせるロゴを参考にして説明しましょう。

今回アニメーションさせるものはこちら

キラキラアイドル系VTuberのネオン風のロゴ(というイメージで作った架空ロゴ)です。

イメージ

・キラキラアイドル
・わくわく感
・かわいい

最低3つくらいはイメージを上げます。
ここからイメージを元にアニメーションを考えます。

アニメーションのアイデアは、あとで誰かに説明できるものだったら、メモ書きのような感じでも大丈夫です!

・キラキラアイドルなので、ロゴのアニメーションもキラキラさせる
・ネオン風なので、ネオンが光る感じ?
・徐々に名前が出てきて、わくわく感演出

こんな感じでしょうか。

そうして作りたいアニメーションのイメージを固めたら、実際にアニメーション作成を行います。

実際に作ったアニメーションはこちら

最後に

あなたのロゴをアニメーションにするなら、どんなイメージですか?

アニメーションって作ってみたいけど作るのが難しいし、そもそもアイデアが浮かばないと、そう悩んでいる方は多いかもしれません。
そんな方に、今回の記事が少しでも参考になれば幸いです。

JOURNALが気に入ったら「いいね」してね!

Contact

ブランディング・WEB制作・運用まで、まずは一度お話を聞かせてください。 初回のご相談は無料で承っています。

お電話

0120-622835

10:00〜18:00 / 土日祝休

メールフォーム

お問い合わせはこちら