Skip to content

イラストを使用したプレゼンムービー 制作過程7~全体のバランスを考えつつ仕上げていく~

2013年1月15日

動画の構成も決め、デザインの方向性も決めたら、後はもくもくと実制作作業を進める
のみです。
モーショングラフィックス主体の動画を作成する、という作業はここからが本番という
面もありますが、ここまでの作業を疎かにすると、テイストや演出がカットごとにブレて
収拾がつかなくなる恐れがありますので、実作業前に方向性は定めておいたほうがよいと
思います。

今回は短い動画ですので、カットごとの作成も最終編集もAdobeのAfter Effects CS4を
使用して一気に作成しました。
以下の動画作成過程はAEの機能を基準に解説しますので、AEをご存じない方には少々
わかりにくいと思いますが、ご了承ください。
また、AEのTutorialやTipsはほとんどありません。
TutorialやTipsに関してはすばらしいサイトがいくつもありますので、そちらを参考に
なさって下さい。

 【オープニング】00:00~00:17
キャラAの憧れというか妄想のカットなので、具体性がなくてぼんやりとした感じを出す
ためにキャラはキャラクターデザインの際のキャラ絵のシルエットを使い、構図も中央
配置であまり遊びがない演出にしています。
正面からだと平面の構図ですが、3Dレイヤーでデザイン素材とテキストを前後に配置し、
絵が掃ける際に少しだけ立体感を感じるようにイメージの箱庭的な組み方にしました。 

movie_01<

【憧れから現実へ】00:17~00:26
前回のエントリーでも触れました主人公の「素敵素敵!キャー!」という妄想の雄たけび
が倍々に増えていき、夢から現実に引き戻された瞬間に画面を暗転させテレビの電源が
消えたようなSEを入れることによって、一気に場面転換を図っています。
黒背景に出てくるテキストは、Kinetic typographyらしく3Dレイヤーで箱状に組んだり、
天地を反転させたりしています。
「間違えた!?」だけきちんと認識できれば良いので、他は結構早い動きになっています。
カメラの被写界深度を使っていますが、カメラアニメーションはありません。

movie_02

【各キャラ紹介】00:26~00:52
キャラクターデザインに合わせ、キャラごとにメイン背景色やセリフの色とフォントなど
を決め、それに合わせて背景の細かいデザインパーツを組み合わせて、画面が止まらない
ように常に何か動きがあるように組みました。
キャラが出現して状況がわかるセリフを足早に畳み掛ける、という基本の構成が3回連続
する演出です。

キャラ名は伏せたのですが、キャラのセリフ内に数箇所キャラ名が出てきます。
(キャラAがあかり、キャラBがみどりです。)下の名前だけでしたら問題がなさそう
ですし、バランスがおかしくならないようにこちらはあえて残しました。
各キャラごとに、結構細かい差異をつけて構成してあります。

■キャラA
元気良く画面手前から出現。テキストやデザインパーツも画面手前から出現し、考える
前に行動してしまうトラブルメーカー的なイメージで構成。
背景のコラージュは大あじな柄を中心にアクティブなイメージで。

movie_03

■キャラB
画面下や画面後方からスィッと出現。控えめで人に振り回されがちなイメージにするため
テキストやデザインパーツは上から落ちてきて、それらに押し切られるような構成。
背景のコラージュは繊細なモチーフを多めにし、やわらかなイメージに。

movie_04

■キャラC
画面上部方向からえらそうに出現。テキストやデザインパーツはサイドからスライドで出現
し、てきぱきとしたスピーディな印象の構成。
先輩ではありますが一番年下という設定なので、身長以外でも幼さを出すために背景コラ
ージュはややビビットな色の組み合わせにし、子供っぽいイメージで。

movie_05

最後のキャラCの「甘くないから覚悟しなっ!!」というセリフは、残響で次につなげる
イメージで、Z方向に複製が重なるようにしました。

各キャラ共通で最背面に配置している踊る花のモチーフ部分は、こちらのサイトの作例62
をベースに、エクスプレッションの数値などを調整して作成しました。
バカ・アフター 
作例62:振幅
(バカ・アフター管理人様、データの使用許可、誠にありがとうございます。)

キャラ紹介部分は全体的に非常に早いので、一度動画を見ただけでは全部のテキストは
読めないと思いますが、半分はにぎやかしの部分もあるのである程度読み取れればOKと
して構成しました。

次回に続きます。

広告
コメントする

コメントを残す

以下に詳細を記入するか、アイコンをクリックしてログインしてください。

WordPress.com ロゴ

WordPress.com アカウントを使ってコメントしています。 ログアウト / 変更 )

Twitter 画像

Twitter アカウントを使ってコメントしています。 ログアウト / 変更 )

Facebook の写真

Facebook アカウントを使ってコメントしています。 ログアウト / 変更 )

Google+ フォト

Google+ アカウントを使ってコメントしています。 ログアウト / 変更 )

%s と連携中

%d人のブロガーが「いいね」をつけました。