最近良い感じに涼しくなりましたね。フットサルとかやりたいtaichiです。 

前回の記事『FlashにPremiereで映像素材を用意する時のメモ』では、

DVテープをPremiereで取り込み、Flashに持って行くまでの初歩的な行程をメモして見ました。

今回は取り込んだ映像に背景透過処理を加えて、Flashで使うまでの行程をメモします。

 

 

 ーー

 

利用するソフトはタイトル通りAdobe AfterEffects CS4

ae01_img.png

 

 

※AEはCS4から面白い機能が増えてはいますが、
過去の記事で「XFLファイルの書き出しAEでswf書き出しを試してみて、
Flashとの連携にあまり満足いくものが無い気がすることが少しだけ残念。。

で、

今回はシンプルに「背景を透過にして使う」という一点に絞って行程を追ってみようと思います。

 

ae02_img.png

 
 (1) 早速起動します。

 

 

ae03_img.png

 
(2) コンポジション設定はお好みにですが、正方形ピクセルかどうかだけは気を付けます。

 

 

ae04_img.png 

(3) 「ファイル」→「読み込み」。またはプロジェクトへ直接ドラッグ&ドロップして
  編集したい映像素材を取り込み、「コンポジション」に追加します。 

 

ae05_img.png 

(4-1) 「背景の透過」でまず思いつくのがマスクを使った処理かと思います。

   ペンツールで目標物を囲み、マスクを作成します。

ae06_img.png


(4-2) この処理の仕方は風景やテレビの画面なおど、一定の範囲から動かないものを

   合成したいとき等に便利ですが、被写体が細かかったり動き回るときは以下の方法をとります。

 

ae07_img.png

 (5-1) 「KeyLight」つまりクロマキーの処理です。

    スポイトツールで選択した色のアルファを透過させてくれます。

 

ae08_img.png


 (5-2) 緑色の人工芝が部分のアルファが透過になり、背景の黒色になりました。

 

※「クロマキー」は「ブルーバック」や「グリーンバック」と言った、青色・緑色など、
人体の色に含まれない色を背景に置く事が一般的ですが、
撮影時に背景に被写体の影を落としてしまう様なライティングをするとあまり意味が有りません。
日光を利用して、背景から有る程度遠ざけて撮影する方法がオススメです。 

 

ae09_img.pngのサムネール画像

 

 (6) 出力モジュール設定では、Premiere同様「FLV|F4V」を選択。

ビデオ出力のチャンネルがRGB+アルファである事を確認し、

ビデオコーデックにはOn2VP6を選択します。

その他、オーディオやビットレートは素材の映像に合わせてその都度選びます。

 

 

 

ae13_img.png

(7) 出力が確認できたら早速Flashに取り込みます。

 

 

ae14_img.png

 

 (8) 早速Flashへ

 

 

ae15_img.png

 

 (9) 「swfにFLVを埋め込み、タイムラインで再生する」を選択します。

 

ae16_img.png

 

(10) タイムラインに埋め込まれます。

芝生の緑色だった部分が透過に成っています。

 

 

ae17_img.png

 

(11) レイヤーを追加し、通常通りアニメーションに利用します。

  あまり動きが激しかったり、色数の多い映像は処理に時間が掛かったり

  再生スピードが不安定になるので注意が必要です。 

 

長々と書いてしまいましたが以上になります。

映像や実写を使ったコンテンツはそれだけでインパクトや説明力を感じます。

コーデックや圧縮形式など、何が最適な方法なのかをもっと色々勉強したいです。

 

 

HTML5飯