もっと読む

アニメチームポートフォリオ 「いるるのお部屋」背景アニメーション

こんにちは!2DCGプラネットスタジオ アニメチームのKです。今回は「背景イラストのLive2Dアニメーション」作品をご紹介します!オリジナルキャラクター「星奈いるる」をテーマにしたお…

続きを読む

もっと読む

【新卒インタビュー】新人研修って何するの?入社後の“最初の一歩”をのぞいてみよう!

こんにちは、ARTチームのブログ担当アダチです!9月に入り、就職活動を真剣に考え始める方も多いかと思います。「入社したらすぐ現場に出るのかな?」「研修って実際何をするの?」そん…

続きを読む

もっと読む

【初心者向け】ゲームの「UI」デザインとは?

はじめまして!ブログ運営担当・デザインチームの笈田です。皆さんは「UI」という言葉をご存知でしょうか?デザインのことを少し知っている方なら、もしかすると聞いたことのある言葉かと思います…

続きを読む

もっと読む

【若手PMインタビュー】チームのリアルと、これからの展望

若手PMの成長ストーリーから見える「PMという仕事の本質」こんにちは、PlanetDesignStudio プロジェクトマネジメントチーム(以下、PMチーム)のM.Kです。今回は、PM…

続きを読む

もっと読む

【現役UIデザイナーが語る!】UIデザイナーになる前となった後

今回は「UIデザイナーになる前と、なった後で変わったこと」をテーマに、現場で活躍しているメンバーにインタビューしました。UIという言葉は聞いたことがあるけれど、「実際にはどんな仕事をし…

続きを読む

もっと読む

PMチームが挑む「自走できる組織づくり」遠慮が生む“微妙なズレ”を無くすために。

2DCGプラネットスタジオ PMチームが生まれた理由と、これからの展望こんにちは、2DCGプラネットスタジオ プロジェクトマネジメントチーム(以下、PMチーム)のM.Kです。今回は、2…

続きを読む

もっと読む

【Spine】2Dアニメーションを2.5次元にする方法

はじめまして! 2DCGプラネットスタジオ アニメーションチームの馬場です。  皆様Spineというものをご存じでしょうか?Spineとはイラストを素材にアニメーションを作るソフト…

続きを読む

もっと読む

【就活生向け】新卒入社デザイナーに聞く「ゲーム業界のポートフォリオ制作」ポイント

はじめまして!ブログ運用担当、アートチームの石原です。就活って日々の授業に始まり、エントリーシートの制作にポートフォリオ制作や面接とやることが多くて悩みが尽きないですよね。…

続きを読む

もっと読む

2年目デザイナーが東京本社で修行!?感想レポ

こんにちは!2DCGプラネットスタジオ、デザイナーのオハシです。突然ですが、皆さんは「出張」経験されたことはありますか?なんと私オハシ、新卒2年目にして初の出張─本社で約2か月…

続きを読む

もっと読む

<プロジェクトを動かす人の話>PM/進行管理ってこんな仕事です。

2DCGプラネットスタジオ PMチームのお仕事とははじめまして。今回から社内ブログを担当することになった、PMチームの”とみ”です。初回はゲーム制作に関わる「PM(…

続きを読む

アニメチームポートフォリオ 「いるるのお部屋」背景アニメーシ...

【新卒インタビュー】新人研修って何するの?入社後の“最初の一...

【初心者向け】ゲームの「UI」デザインとは?

【若手PMインタビュー】チームのリアルと、これからの展望

【現役UIデザイナーが語る!】UIデザイナーになる前となった...

PMチームが挑む「自走できる組織づくり」遠慮が生む“微妙なズ...

【Spine】2Dアニメーションを2.5次元にする方法

【就活生向け】新卒入社デザイナーに聞く「ゲーム業界のポートフ...

2年目デザイナーが東京本社で修行!?感想レポ

<プロジェクトを動かす人の話>PM/進行管理ってこんな仕事で...

【初心者向け】モーション・エフェクト制作時に迷ったときの解決ポイント!

 

はじめまして。
クリーク・アンド・リバー社2DCGプラネットスタジオ
アニメーションチームの吉村です。

私は主にアニメーション、2Dエフェクトの制作を行っております。
お仕事では基本的にご依頼元からの指示書通りに制作していきますが、
プロジェクトによっては、自身で考えてアニメーションの一部となるモーションまたはエフェクト制作を行う必要があります。

そこで今回は私がモーション・エフェクト制作などで
行き詰った時やアイデアが欲しいと思った時に利用するサイトをご紹介させていただきます。

 

皆様はモーションやエフェクト制作に挑戦しようと思ったとき、または制作する上で、

・色々エフェクトがあるけれど、どの制作方法を使えば良いか迷う・わからない
・そもそも始めたばかりでどのような表現ができるのかわからない

といったようなことはありませんか?
そんな時におススメなのが、モーション周期表になります!

MOTION PERIODIC TABLE

https://foxcodex.html.xdomain.jp/index.html

モーション周期表とは?

https://foxcodex.html.xdomain.jp/About.html

モーション周期表とはモーショングラフィックスにおける基本要素を
元素記号表のようにルールをもとに並べられたものとなります。

このモーション周期表では、数多くあるエフェクトの中から基礎となる動きや表現が可視化されているので大変わかりやすく、
エフェクトをクリックするとどのように使用するのか作例と共に解説もされてあるので非常に重宝しております。

実例

実際に円が広がって消えるモーションを作りたい!
と思ったときにモーション周期表の中から似たようなものを探してみると、Line Weight(線幅)というのがあります。

Line Weight (線幅)
https://foxcodex.html.xdomain.jp/LineWeight.html

ページを開いてみると応用の一番上に探しているイメージ通りの円が広がって消えるモーションがありますね。

書いてある通りScale(拡縮)を合わせることで理想のモーションが制作できそうです。

Scale(拡縮)
https://foxcodex.html.xdomain.jp/Scale.html

これらをもとに実際にモーションを作ってみましょう!

  1. サイトに書いてある通り、線幅で太くなっていく円を作り、
  2. これに拡縮(Scale)を加えて、
  3. さらに良い感じになるように終わる時の線幅や色を変えるなど調整して完成です。

このように、作りたいモーションのイメージから似たようなエフェクトを探して組み合わせることで簡単に制作することができます。

After effectsの操作方法なども記載されており、各エフェクトでの作例も豊富ですのでモーション初心者の方でもこのサイトを見ながらなら制作に取り掛かりやすくなるかと思います。

 

いかがでしたでしょうか?
このモーション周期表はAfter effectsを使用したサイトとなっておりますが、
アニメーションツールで有名なLive2Dやspine、モーションやエフェクト、3Dなどで使用されるUnityなどでのアニメーション制作でも大変役に立つものですので、
アニメーションやエフェクトに興味がある方への制作を始める後押しや、クリエイターの皆様の制作の手助けになれれば幸いです!

関連記事

  1. もっと読む

    【Spine】2Dアニメーションを2.5次元にする方法

    2022-05-17

  2. もっと読む

    Live2D・Spineで作るアニメーションの12原則の話 ②カーブを使いこなそう

    2026-03-05

  3. もっと読む

    Live2D・Spineで作るアニメーションの12原則の話 ①概要

    2026-03-05

  4. もっと読む

    アニメーション ポートフォリオのススメ~Live2D~

    2025-08-25

採用情報

ABOUT

C&R Creative Studiosに所属するPlanet Design Studio(プラネットデザインスタジオ)です。
最高のクリエイティブ制作・クリエイターの キャリアデザインができるスタジオを目指しています。

運営:
Planet Design Studio

所属:
C&R Creative Studios

ページ上部へ戻る