Adobe
製品
Acrobat
Creative Cloud
Creative Suite
Digital Marketing Suite
Digital Publishing Suite
Elements
Photoshop
Touch Apps
その他の製品一覧
ソリューション
デジタルマーケティング
デジタルメディア
教育
金融機関
Web Experience Management
その他のソリューション
ラーニング サポート ダウンロード 会社情報
ご購入
アドビストア 安心のサポート& サービス
アカデミックストア 学生、教職員、個人向け
アドビライセンスストア 中小企業向け
ボリュームライセンスについて 企業、教育機関、官公庁向け
販売パートナー
キャンペーン情報
検索
 
情報 サインイン
ようこそ、 さん カート 注文状況 マイアカウント
マイアカウント
注文状況
アカウント情報の変更
コミュニケーションの設定を変更
サインアウト
サインインの目的 お客様のアカウントや体験版ダウンロード、製品の拡張機能、コミュニティエリアへのアクセスなどを管理するため
Adobe
製品 セクション ご購入   検索  
ソリューション 会社情報
サポート ラーニング
サインイン サインアウト 注文状況 マイアカウント
先行予約の提供開始予定日Date. 商品が発送されるまで、クレジットカードには課金されません。提供開始の予定日は変更される場合があります。 先行予約の提供開始予定日Date. ダウンロードの準備が整うまで、クレジットカードには課金されません。提供開始の予定日は変更される場合があります。
個数:
ご購入には学生・教職員個人版の購入資格の確認が必要です。
小計
カートの中身を見る
Adobe Developer Connection / Flashデベロッパーセンター /

トーキングヘッドFlash Videoの作成

著者 Tom Green

Tom Green
  • www.tomontheweb.ca

Content

  • キーイングについて
  • Adobe Premiereでのマスクされたビデオの作成
  • アルファチャンネルを含むQuickTimeムービーのPremiereでの書き出し
  • ビデオの読み込みウィザードによるFLVファイルの作成
  • Flash 8 Video EncoderによるFLVファイルの作成
  • FLVファイルからのSWFファイルの作成

更新日

20 December 2005

ページ ツール

Facebookでシェア
Twitterでツイート
LinkedInでシェア
ブックマーク
印刷

タグ

必要条件

この記事に必要な予備知識

Adobe Premiere(またはApple Final Cut Proなどの他のノンリニアエディタ)およびFlash Professional 8についての知識が必要です。このチュートリアルは、これらのアプリケーションの初級者から中級者までを対象としています。

ユーザーレベル

中級

必要な製品

  • Adobe Premiere Pro (Download trial)
  • Flash Professional (Download trial)

サンプルファイル

  • talking_head_video.zip (65377 KB)

その他の要件

Apple QuickTime 6または7


ダウンロード

Dreamweaver 8の製品ページにある「お客様の成功事例」というポッドでは、いくつかのビデオを提供しています。これらのビデオを再生してみてください。Community MXの同僚であるStephanie Sullivan氏や私が特別出演しています(図1参照)。

Dreamweaver 8のすばらしさについて話すユーザ
図1. Dreamweaver 8のすばらしさについて話すユーザ

これらのビデオのおもしろい点は、暗い中間色の背景は、実際には私がインタビューを受けた場所の背景と異なることです。この背景は、ビデオ処理の編集段階(後処理)で追加されたものです。ビデオカメラマンは、一般に「グリーンスクリーン」と呼ばれる鮮やかな緑色の背景の前で私たちを撮影してから、特定の色調の緑色をマスクするキーイングと呼ばれる処理を行い、その色をもっと見映えのするものに置き換えます。

このチュートリアルでは、私の顔が映ったビデオ(図2参照)を使用して、Flash 8で「トーキングヘッド」ビデオを作成する方法について説明します。ここでは、Adobe Premiere Pro 1.5で作成したトーキングヘッドビデオをFLVウィザードとFlash 8ビデオエンコーダで処理し、QuickTimeムービーからWebページに配置可能なFLVファイルに変換します。

メモ: キーイング用フィルタを備えたApple Final Cut Proなどのノンリニアエディタの使い方を知っていれば、ここで説明する内容を理解することができます。

グリーンスクリーン背景のトーキングヘッドビデオ
図2. グリーンスクリーン背景のトーキングヘッドビデオ

ここで前置きしておきますが、このチュートリアルは初級者レベルの内容です。ビデオのキーイングは、非常に複雑な作業を要する場合があります。実際、この作業だけを説明しているデジタルビデオの解説書も数多くあります。キーイングに詳しい方の多くは、このチュートリアルを読んでまず「自分ならもっと別の方法で行う」という感想を持つでしょう。おそらくそのとおりでしょうし、私が通常行う方法とも多くの点が異なります。しかし、ここでは何かを出発点とする必要があります。そのために、このチュートリアルでは、まず基本的なワークフローについて説明することにします。

ビデオアプリケーションを持っていなくても、ビデオの編集方法を学ぶつもりがなくても、問題ありません。しかし、近い将来、アルファチャンネル対応のFlashビデオを作成することが必要になるでしょう。そうした万一の場合に備えて、このチュートリアルでは、QuickTimeムービーまたはFLVファイルを使った作業に取り掛かる前に、ビデオエディタの機能について説明します。

キーイングについて

キーイングというテクニックは、テレビのニュースを見ると実際に使われている場面を目にすることができます。天気予報では、常に使われています。気象予報士がレーダー画像の前に立ち、背景の中の重要な気象状況を指し示します。放送中のスタジオを見ると、これは少し奇妙な光景です。予報士は緑色または青色の壁の前に立ち、予報を伝えながらその壁を指しつつ、目では自分がレーダー画像の前に立っている場面を映したモニターを見ています。緑色または青色の背景は、ビデオ信号からはキーアウトされ、レーダー画像に置き換えられています。

Adobe PhotoshopやFireworksでマスクを作成する方法がわかっているならば、ビデオのキーイングについてもすでに多くのことを知っていると言えます。マスクでは、取り除く色を決め、エッジを操作し、対象と背景の間のトランジションがスムーズになるように微調整します。PremiereとAdobe After Effectsのどちらでも、この作業はプラグインを使用して行います。

図3に、Premiereのビデオに適用されているマスクを示します。黒い領域内のすべてのものがマスクされます。ただし、このタイプのマスクは、動きがあるという点でグラフィックアプリケーションにおけるマスクとは異なります。たとえば、右側に体を傾けると、白色の領域がその動きに対応して調整されます。これは、特にFlash Professional 8では重要な概念です。ビデオをムービークリップ内に配置し、マスクにドロップシャドウフィルタをアタッチすると、そのシャドウはビデオマスクの形状の変化に合わせて移動したり変化したりします。

緑色の背景を取り除くために使用されるマスク
図3.緑色の背景を取り除くために使用されるマスク

最初に必要なことは、作業対象の決定です。ビデオの作成時には、プロジェクト設定がソースファイルの設定と一致していることが必要です。一致していないと、あとで問題が発生します。

QuickTimeでCMXGS.movファイル(ダウンロードしたサンプルコードを参照)を開き、ウィンドウ/ムービーの情報を表示を選択します(またはCtrl+I)。ムービー情報ダイアログボックスに、Premiereでプロジェクトファイルを作成するために必要な情報が表示されます(図4を参照)。ここから、ムービーが320×240ピクセル(Webビデオの標準サイズ)でなければならないこと、およびフレームレートが1秒間に25フレームであることがわかります。このプロジェクトのオーディオは、モノラル44.1kHzです。

Adobe Premiereでプロジェクトを作成するために必要な情報
図4.Adobe Premiereでプロジェクトを作成するために必要な情報

Adobe Premiereでのマスクされたビデオの作成

Adobe Premiereには、10年以上の歴史があります。Premiereはさまざまな面で、PCにおけるビデオ編集の標準としての位置を固めてきました。MacintoshでAppleがFinal Cut Proを発表する前に、Premiereはクロスプラットフォームのデファクトスタンダードになっていました。Final Cut Proが追い付いてくるとAdobeはMac OS版をあきらめ、PremiereをWindows専用のアプリケーションにしました。

話す人物の顔を処理するビデオ(トーキングヘッドビデオ)をPremiereで作成することは、きわめて簡単です。

  1. Premiereを起動し、スプラッシュスクリーンで「新規プロジェクト」を選択します(図5を参照)。プロジェクトは、作業内容を保管し、プロジェクトに適用したエフェクトを保持できるという点で、きわめて便利なドキュメントです。これは、あとでクライアントから変更を依頼されたときにたいへん役に立ちます。
Premiereのビデオに対するすべての作業はプロジェクトファイルに保持される
図5.Premiereのビデオに対するすべての作業はプロジェクトファイルに保持される
  1. 新規プロジェクトダイアログボックスが表示されたら、「カスタム設定」タブをクリックし、ダイアログボックスの「一般」セクションで以下の値を設定します(図6を参照)。
    • 編集モード:Video for Windows
    • タイムベース:25.00フレーム/秒
    • フレームサイズ:横320、縦240(4:3)
    • ピクセル縦横比:正方形のピクセル(1.0)
    • サンプルレート:44100Hz
新規プロジェクトダイアログボックスであらかじめ設定されているプロジェクトの現在のフォーマット、場所、および名前
図6.新規プロジェクトダイアログボックスであらかじめ設定されているプロジェクトの現在のフォーマット、場所、および名前

「場所」フィールドで、プロジェクトおよびプロジェクトで使用されるすべてのファイルが置かれるフォルダを指定します。最後に、プロジェクトに名前を付けます。完了したら、「OK」をクリックします。

このチュートリアルのファイルが置かれているフォルダをプロジェクトフォルダとして使用できます。プロジェクトの作成後にフォルダの名前や場所を変更することだけは、絶対に行わないでください。Premiereではプロジェクトに関連する多数のファイルがこのフォルダに保存されるため、フォルダの名前や場所を変更すると、プロジェクトで使用されるファイルへのリンクが破壊されます。どうしてもプロジェクトフォルダの場所を変更する必要がある場合は、編集/環境設定/スクラッチディスクを選択し、表示されるダイアログボックスで場所を変更します。

  1. Premiereのワークスペースが表示されたら、ファイル/読み込みを選択してCMXGS.movファイルをプロジェクトに読み込みます。プロジェクトパネルにファイルが表示されたら、選択し、「再生」ボタンをクリックしてビデオをプレビューします。
  2. ビデオをプロジェクトパネルからタイムラインの「Video 1」レイヤーにドラッグします。これによってビデオはオーディオとビデオレイヤーで構成されるようになり、モニタウィンドウが開きます(図7を参照)。
Premiereワークスペースで作業する必要があるすべての要素
図7.Premiereワークスペースで作業する必要があるすべての要素

モニタウィンドウの緑色の背景をよく見てください。実際には緑単色ではなく、背景の数か所にグラデーションがあります。背景を観察することは、どのキーイングエフェクトを使用するかを決定することにつながるため、十分に時間をかける意味があります。標準のGreen Screen Keyフィルタでは、この背景にあるさまざまなシェードを得ることはできません。

次の手順は、使用するAdobe Premiereがスタンドアロンの製品(または「体験版」)であるか、Adobe Video Collectionに含まれるバージョンであるかによって異なります。後者のバージョンの場合は、2つの追加のフィルタをAdobe After Effectsと共有しており、ここではその1つであるColor Keyフィルタを使用します。スタンドアロンバージョンにはこのフィルタは含まれていませんが、ほとんどのキーイングはPremiereにデフォルトで含まれているChroma Keyフィルタで実現できます。

Chroma Keyフィルタしかない場合は、次のセクションをお読みください。Color Keyフィルタがある場合は、その後のセクション「Color Keyフィルタによるキーイング」に進みます。

Chroma Keyフィルタによるキーイング

次の手順に従って、デフォルトのChroma Keyフィルタを使用して緑色をキーアウトします。

  1. 緑色の背景をキーアウトする処理を開始するには、ウィンドウ/エフェクトを選択してエフェクトパネルを開きます。Premiereには多数のエフェクトが付属しています。.
  2. エフェクトパネルで、ビデオエフェクト/キーイング/クロマキーを選択します(図8を参照)。Chroma KeyプラグインをエフェクトパネルからVideo 1チャンネルのサムネイルにドラッグします。
キーイングするビデオのChroma Keyプラグインの選択
図8.キーイングするビデオのChroma Keyプラグインの選択
  1. Chroma Keyプラグインの設定を調整するには、ウィンドウ/エフェクトコントロールを選択します。ここでの変更は、モニタウィンドウ内のイメージに反映されます。エフェクトコントロールダイアログボックスが表示され、ここで3種類の設定を調整できます(図9を参照)。
    • カラー:取り除く色を指定するには、カラーピッカーでその色を選択するか、取り除く色のサンプルをスポイトツールで採取します。
    • 類似性:Fireworks 8またはPhotoshop CS2の自動選択ツールと同様に、選択した色が取り除かれる範囲の広さは類似性の値によって決まります。
    • ブレンド:このコントロールにより、マスクのエッジをブレンドしてスムーズにします。このエフェクトは、マスクのエッジを微調整することが中心です。Premiereの場合、ビデオの下に置かれた基になるイメージとマスクのエッジをブレンドします。この場合は不要(話す人物の後ろには何もないため)ですが、これを行う習慣を付けておくことをお勧めします。
    • スムージング:マスクのエッジに適用されるアンチエイリアスの量です。「低」では少量のブレンドが適用され、「高」(ここでの例)ではエッジ、およびビデオの背後にあるコンテンツをスムーズにするために十分なブレンドが適用されます。どちらの場合も、エッジが乱れて表示されることはありません。
マスクされる領域を制御するColor Keyプラグインの設定の調整
図9.マスクされる領域を制御するColor Keyプラグインの設定の調整
  1. モニタウィンドウで、カラー設定のスポイトツールをクリップの緑色の領域にドラッグします。スポイトツールをドラッグすると、緑色の領域の一部が黒くなります。これは、カラーがマスクされたことを示します。マウスを放すと、カラーのサンプルが採取されます。
  2. 類似性スライダを右にドラッグします。緑色が消えて、話す人物の後ろにある背景が黒くなります。話す人物の髪の毛と肩の部分に、特に注意してください。できるだけ多くの緑色を取り除きます。ここでは54という値が適切なようです。
  3. ブレンドスライダを値16の付近までドラッグします。このスライダで微調整して、エッジをスムーズにします。
  4. ここまでの結果を確認するために、エフェクトコントロールダイアログボックスの一番下にある「マスクのみ」ボタンをクリックします。これによってマスクが表示されます。目的は、背景を黒単色に、話す人物の顔を白単色にすることです(図10を参照)。

    ヒント:スライダを使用しないでこれらを調整することもできます。パーセンテージが示されている領域で値—青い数字—をクリックし、ドラッグして変更します。これはスマートな方法ですが、インタフェイスに慣れるまではスライダを使用することをお勧めします。また、値をダブルクリックしてから、手動で値を入力することもできます。

    最適な外観が得られるまで、さまざまな値を試してみてください。

エフェクトコントロールで「マスクのみ」をクリックすると作成したマスクが見やすくなる
図10.エフェクトコントロールで「マスクのみ」をクリックすると作成したマスクが見やすくなる

次のセクションは飛ばして、チュートリアルの残りを次のページから続行し、アルファチャンネルも含めてムービーを書き出す方法を学びます。

Color Keyフィルタによるキーイング

次の手順に従って、Adobe Video Collectionに追加で付属しているColor Keyフィルタを使用して緑色をキーアウトします。

  1. 緑色の背景をキーアウトする処理を開始するには、ウィンドウ/エフェクトを選択してエフェクトパネルを開きます。Premiereには多数のエフェクトが付属しています。.
  2. エフェクトパネルで、ビデオエフェクト/キーイング/カラーキーを選択します(図11を参照)。Color KeyプラグインをエフェクトパネルからVideo 1チャンネルのサムネイルにドラッグします。
キーイングするビデオのColor Keyプラグインを選択
図11.キーイングするビデオのColor Keyプラグインを選択
  1. Color Keyプラグインの設定を調整するには、標準/エフェクトコントロールを選択します。ここでの変更は、モニタウィンドウ内のイメージに反映されます。エフェクトコントロールダイアログボックスが表示され、ここで4種類の設定を調整できます(図12を参照)。
    • キーカラー:取り除く色を指定するには、カラーピッカーでその色を選択するか、取り除く色のサンプルをスポイトツールで採取します。
    • カラー許容量:Fireworks 8またはPhotoshop CS2の自動選択ツールと同様に、選択した色が取り除かれる範囲の広さは「カラー許容量」の値によって決まります。
    • エッジを細く:このコントロールにより、マスクを拡張または接触させます。
    • エッジのぼかし:この機能は、名前のとおりです。マスクのエッジと対象とのトランジションがスムーズでない場合があります。このコントロールでは、マスクのエッジに微調整を加えてスムーズにします。
マスクされる領域を制御するカラーキープラグインの設定の調整
図12.マスクされる領域を制御するカラーキープラグインの設定の調整
  1. モニタウィンドウで、キーカラー設定のスポイトツールをクリップの緑色の領域にドラッグします。スポイトツールをドラッグすると、緑色の領域の一部が黒くなります。これは、カラーがマスクされたことを示します。マウスを放すと、カラーのサンプルが採取されます。
  2. カラー許容量を右にドラッグします。スライダをドラッグすると、それに合わせて黒色の領域が拡大します。話す人物の髪の毛と肩の部分に、特に注意してください。できるだけ多くの緑色を取り除きます。ここでは91という値が適切なようです。
  3. エッジのぼかしスライダを値1.6または1.8の付近までドラッグします。緑色を取り除くと、話す人物の顔のエッジがスムーズでないことに気が付きます。このスライダでは、微調整によってエッジをスムーズにします。

    ヒント:スライダを使用しないでこれらを調整することもできます。パーセンテージが示されている領域で値—青い数字—をクリックし、ドラッグして変更します。これはスマートな方法ですが、インタフェイスに慣れるまではスライダを使用することをお勧めします。また、値をダブルクリックしてから、手動で値を入力することもできます。

    最適な外観が得られるまで、さまざまな値を試してみてください。

最適な結果を得るために設定を試す
図13.最適な結果を得るために設定を試す

次のセクションでは、アルファチャンネルも含めてムービーを書き出す方法について説明します。

アルファチャンネルを含むQuickTimeムービーのPremiereでの書き出し

Premiereで緑色の画面をキーアウトしたので、次は、Flash 8 Video Encoderで使用するQuickTimeファイルを作成します。

  1. モニタウィンドウをクリックし、ファイル/書き出し/ムービーを選択します。ムービーを書き出しダイアログボックスが表示されたら、ビデオを保存するフォルダに移動し、ビデオにTalkingHead」という名前を付けます(図14を参照)。
ムービーに名前を付ける
図14.ムービーに名前を付ける
  1. 「設定」ボタンをクリックして、ムービー書き出し設定ダイアログボックスを開きます。この手順を正しく実行するには、このダイアログボックスが最も重要です。ここで、ビデオのファイルタイプと、アルファチャンネルを表示する適切なコーデックを選択します。
  2. 「一般」カテゴリを選択し、図15に示したように設定します。ファイルタイプとして「QuickTime」を選択します。また、「ビデオを書き出し」および「オーディオを書き出し」オプションを選択します。「終了時にプロジェクトに追加」を選択すると、ビデオの作成後に変更を加える必要が発生したときに、この設定に戻ることができます。「埋め込みオプション」で「なし」を選択します。ファイルにプロジェクトを埋め込んでも、ビデオがプロジェクトの一部であることをQuickTimeに知らせることによってファイルのメタデータに情報が追加されるだけです。
ムービー書き出し設定ダイアログボックスの「一般」カテゴリの設定
図15.ムービー書き出し設定ダイアログボックスの「一般」カテゴリの設定
  1. 「ビデオ」カテゴリを選択し、図16に示したように設定します。「圧縮形式」として「アニメーション」を、「色深度」設定で「数百万色+」を選択します。この2つの選択は、アルファチャンネルを持つビデオを作成するときに重要です。「数百万色+」を選択すると、ビデオにはフィルタによって作成されたアルファチャンネルが含まれます。それに対して、「数百万色」を選択すると、ビデオは十分な数のカラーで作成されますが、アルファチャンネルは含まれません。
「色深度」として「数百万色+」を選択するとアルファチャンネルが保持される
図16.「色深度」として「数百万色+」を選択するとアルファチャンネルが保持される
  1. 「OK」をクリックしてムービー書き出し設定ダイアログボックスを閉じます。ムービーを書き出しダイアログボックスに戻るので、「保存」をクリックします。圧縮の進行状況を示す小さなダイアログボックスが表示されます。このダイアログボックスは、圧縮が完了すると閉じます。
  2. ファイル/保存を選択してプロジェクトファイルおよびここまでの作業内容を保存してから、Premiereを終了します。

    QuickTimeでTalkingHead.movファイルを開くと、意外に思うはずです。依然として緑色の画面が表示されます。しかし、アルファチャンネルも存在しているため問題はありません。まだ使用していないだけです。

アルファチャンネルを含むビデオが用意できたら、Flash Playerで再生できるようにFLV(Flashビデオ)形式に変換する必要があります。これには次の2つの方法があります。1つ目はFlash Professional 8のビデオの読み込みウィザードを使用する方法で、FLVファイルを作成するだけでなく、プレーヤーにコントロール(「スキン」と呼ばれます)を追加できます。2つ目は、Flash 8 Video Encoderを使用する方法です。このスタンドアロンアプリケーションは、Flash Professional 8をインストールすると使用でき、複数のビデオを同時にエンコードできます。

FLVファイルをビデオの読み込みウィザードで作成する場合は、次のセクションを参照してください。Flash 8 Video EncoderでFLVファイルを作成する場合は、その後のセクションに進んでください。

ビデオの読み込みウィザードによるFLVファイルの作成

ビデオを作成したので、次に、Flash Professional 8のビデオの読み込みウィザードを使用してFLVを作成する方法について説明します。

  1. Flash Professional 8のドキュメントを開き、ファイル/読み込み/ビデオの読み込みを選択して、ビデオの読み込みウィザードを開きます。ビデオの選択ダイアログボックスが表示されたら、「参照」ボタンをクリックして、話す人物の顔のビデオまで移動します。ビデオを開き、「次へ」ボタンをクリックして、展開画面を表示します。Flash Player 8でビデオをどのように再生するかについて、入力を要求されます。
  2. 「Webサーバーからのプログレッシブダウンロード」オプションを選択し、「次へ」をクリックしてエンコーディング画面を開きます。

    この画面で、アルファチャンネルを含むFLVファイルを作成します(図17を参照)。Flash Professional 8と、アルファチャンネルを含むFLVファイルに関しては、いくつかの規則があります。

    • Flash 8のプロファイルの1つを選択します。デフォルトは「標準品質」で、FLVのデータレートは400kbpsに固定され、On2 VP6コーデックが使用されます。
    • アルファチャンネルは、On2 VP6コーデックを使用するFLVファイルにのみ追加できます。これはエンコーダのデフォルトのコーデックですが、まだ「次へ」をクリックしないでください。
    • Flash Video Encoderの「詳細設定」領域で、アルファチャンネルを使用することをFlash Professional 8に対して明示的に指定する必要があります。
Flash 8のすべてのプロファイルは、Flashビデオにアルファチャンネルを含めるために必要なOn2 VP6コーデックを使用
図17.Flash 8のすべてのプロファイルは、Flashビデオにアルファチャンネルを含めるために必要なOn2 VP6コーデックを使用
  1. 「詳細設定を表示」ボタンをクリックして詳細設定を表示します。ビデオコーデックポップアップメニューで、「アルファチャンネルのエンコード」を選択します(図18を参照)。
Flash Video Encoderの「詳細設定」領域で「アルファチャンネルのエンコード」オプションを選択
図18.Flash Video Encoderの「詳細設定」領域で「アルファチャンネルのエンコード」オプションを選択
  1. 「次へ」をクリックして、スキンの適用画面を開きます。「なし」を選択し(話す人の顔を写した単純なビデオなので)、「次へ」をクリックします。

    メモ:スキンは、再生コントロールです。リストには、ビデオに適用できるコントロールのスタイルとして27種類が用意されています。ここで実行したように「なし」を選択すると、ビデオは自動的に再生され、ユーザーはその動作を変更できません。ここで「なし」を選択したのは、このテクニックの動作を確認するためです。

    ほかのスキンは、名前が機能を示しています。これらは、ビデオの上に置かれるコントロールと、下に置かれるコントロールの2種類に分けられます。ビデオの上に置かれるコントロールは、実行時にユーザがカーソルをビデオの上に置くと表示されます。ビデオの下に置かれるコントロールは、スキン名に「External」が含まれています。スキンのスタイルを選択すると、プレビューが表示されます。ステージでは、ビデオコンポーネントの下に、外部のスキンスタイル用に約35ピクセルのスペースを残しておく必要があります。このスペースがないと、スキンは途中で切れて表示されるか、まったく表示されません。これは、すべてのスキンが外部SWFファイルであるためです。

    スキンスタイルを適用すると、そのスキンのSWFがFlashアプリケーションのフォルダから、ビデオのSWFと同じフォルダにコピーされます。ビデオのSWFとスキンのSWFの両方をWebサーバにアップロードする必要があります。

  2. 次の画面では、ファイルを保存する場所が尋ねられます。「終了」をクリックすると、「名前を付けて保存」ダイアログボックスが表示されます。FLAファイルの名前を入力して、「保存」をクリックします。FLVには同じ名前が付けられます。

    FLVが作成される進捗状況が表示されます(図19を参照)。FLVが作成されると、Flash Videoエンコードの進捗状況ダイアログボックスが閉じ、ステージにFLVPlaybackコンポーネントが表示されます。

FLVエンコード処理の進捗状況
図19.FLVエンコード処理の進捗状況
  1. マスクが存在していることを確認するために、ビデオの下に新しいレイヤーを追加し、このレイヤーにイメージを配置します。図20では、Community MXのグラフィックを使用しました。ビデオの下に配置した、アルファチャンネルを含むコンテンツが表示されます。
  2. ファイルを保存し、Ctrlキーを押しながらEnterキーを押すか(Windows)、またはCommandキーを押しながらReturnキーを押して(Macintosh)、話す人物の顔のビデオをプレビューします(図20)。
話をするTom
図20.話をするTom

これで作業は終了です。話す人物の顔の背後にイメージを表示できる、アルファチャンネルを含むFlashビデオファイルが作成されました。Flash 8 Video Encoderでビデオをエンコードする方法については、次のセクションを参照してください。または、「高度なリソース」を参照してください。

Flash 8 Video EncoderによるFLVファイルの作成

ビデオをエンコードするもう1つの方法は、Flash Professional 8に付属するFlash 8 Video Encoderを使用するものです。このスタンドアロンアプリケーションには、ビデオの読み込みウィザードにない機能が1つあります。複数のビデオを同時にエンコードすることです。もう1つの大きな違いとして、Flash 8 Video Encoderではビデオにスキンを適用するオプションがありません。これは、Flashで行う必要があります。Flash 8 Video Encoderの機能は、FLVファイルの作成だけです。

  1. Flash 8 Video Encoderを起動します。メイン画面が表示されたら、ビデオファイルをWindowsのエクスプローラまたはMacintoshのFinderからダイアログボックスのキュー領域にドラッグします(図21参照)。「追加」ボタンをクリックし、ビデオが置かれているフォルダに移動しても、同じことを実行できます。ビデオファイルを直接ドラッグ&ドロップする方がずっと簡単です。
エンコードするビデオファイルのリスト
図21.エンコードするビデオファイルのリスト
  1. キューからビデオを選択し、「設定」ボタンをクリックしてFlash Videoエンコード設定ダイアログボックスを開きます(図22を参照)。Flash Professional 8のデフォルトのコーデックは、On2 VP6コーデックです。このダイアログボックスには、設定済みのプロファイルのリストも表示されます。ビデオでアルファチャンネルを使用できるコーデックは、On2 VP6コーデックだけです。Flash Player 7をターゲットにする場合、またはアルファチャンネルがエンコードされないSorensonコーデックを使用する必要がある場合は、Flash 7のプロファイルの中から選択してください。ビデオの読み込みウィザードの場合と同様に、アルファチャンネルを含むFLVを作成する前には微調整が必要です。
Flash Professional 8では、エンコード設定は常にデフォルトのOn2 VP6コーデック
図22.Flash Professional 8では、エンコード設定は常にデフォルトのOn2 VP6コーデック
  1. 「詳細設定を表示」ボタンをクリックして、インタフェイスを展開します(図23を参照)。「アルファチャンネルのエンコード」オプションをクリックします。ポップアップメニューからSparkコーデックを選択すると、このボタンはグレーで表示されます。設定済みの部分が「カスタム設定」に変わっていることに注意してください。「OK」をクリックしてキューに戻ります。
展開したFlash Videoエンコード設定ダイアログボックスで「アルファチャンネルのエンコード」オプションを選択
図23.展開したFlash Videoエンコード設定ダイアログボックスで「アルファチャンネルのエンコード」オプションを選択

「詳細設定」領域には、強力な機能が隠れています。3つのタブ(「エンコーディング」、「キューポイント」、および「切り抜きとカット」)で、ビデオストリームを調整したり、FLVファイルにキューポイントを追加してFlashイベントをトリガできるようにしたり、プロジェクトの物理的なサイズに正確に収まるようにビデオイメージを切り詰めたりすることができます。

エンコードのオプションは、ビデオのエンコードとオーディオのエンコードの2つの領域に分けられます。ここでは、コーデック、ビデオのフレームレート、キーフレームの配置、ビデオの画質などの設定を変更できます。ビデオのサイズも変更できますが、サイズはビデオ編集アプリケーションで変更することを考慮してください。ここで320×240ピクセルのビデオを240×180ピクセルに変更しても、ファイルサイズはまったく小さくなりません。同じことをビデオ編集プログラムで行うと、ファイルサイズは非常に小さくなります。

データレートには2種類の数値があります。実質的なデータレート(情報がユーザーのブラウザにストリーミングされる速さ)は、オーディオとビデオのレートを合計して得られます。図20に示した例では、このデータレートは496kbps(ビデオ400kbps+オーディオ96kbps)で、ダイヤルアップには速すぎます。

  1. キューでビデオを選択し、「キューの開始」をクリックします。エンコード処理の進捗状況が表示され、各フレームがエンコードされるのに合わせてビデオがゆっくりと進捗状況領域に再生されます(図24を参照)。エンコード処理が完了すると、キューの中で、エンコードしたビデオの隣にチェックマークが付きます。これで、Flash Video Encoderを終了することができます。
キューウィンドウでのエンコード処理
図24.キューウィンドウでのエンコード処理

Flash Video Encoderの本当に便利な点は、ビデオに適用した設定が保存されるということです。何かをやり直したり、設定を微調整したりする必要がある場合に、ビデオがキュー内のリストに残っているのです。ビデオを選択し、「設定」をクリックし、調整を加えるだけで、新しいFLVファイルを生成できます。

次のセクションでは、作成したFLVファイルをFlash Professional 8に取り込んで、Flash Playerで再生できるSWFファイルを作成する方法について説明します。

FLVファイルからのSWFファイルの作成

Flash 8 Video Encoderを使用してFLVファイルを作成したので、次はそれをFlash Professional 8に取り込んでSWFファイルを作成し、Flash Playerで再生できるようにします。ウィザードを使用する場合とEncoderを使用する場合の主な違いは、Flashでスキンをアタッチする必要があるかどうかです。以下に手順を示します。

  1. Flash Professionalで新しいドキュメントを開き、FLVPlaybackコンポーネントをFLV Playback–Player 8コンポーネントパネルからステージにドラッグします。FLVアイコンを含む黒い矩形が表示されます。

    メモ:アルファチャンネルを含むビデオは、Flash 8コンポーネントでのみ再生できます。Media–Player 6-7のコンポーネントパネルでは再生できません。

  2. ステージでコンポーネントのインスタンスをクリックしてから、プロパティインスペクタの「パラメータ」タブをクリックします。このパネルを使用して、作成したFLVファイルへのパスを設定し、スキンを追加します。
  3. 「パラメータ」タブでcontentPathをクリックしてから、入力領域をクリックしてコンテンツパスダイアログボックスを開きます。
  4. 「参照」ボタンをクリックし、作成したFLVファイルまで移動します。「OK」をクリックして選択を受け入れます。
  5. プロパティインスペクタに戻り、パラメータのリストをスクロールダウンしてSkinパラメータを表示し、入力領域をクリックしてスキンの選択ダイアログボックスを開きます(図25を参照)。ポップアップメニューをクリックして、スキンを選択します。すべての選択はダイアログボックスの「プレビュー」領域に表示されます。スキンを選択したら、「OK」をクリックします。

    メモ:スキンの選択時に注意する必要があることは、一部のスキン(スキン名に「External」が含まれるもの)はFLVPlaybackコンポーネントが使用する領域の下に置かれるということです。外部スキンを使用する場合は、コントロールを置くために、ムービーの下に約35ピクセル残してください。

プレーヤー向けにスキンを選択
図25.プレーヤー向けにスキンを選択
  1. 新規レイヤーを追加し、そのレイヤーをコンポーネントレイヤーの下にドラッグします。このレイヤーにムービークリップ、別のビデオ、またはイメージを追加し、ムービーをテストします。

    図26では、ニューヨーク市42丁目の通りの様子を写した写真を使いました。Layer 1を追加し、FLV再生コンポーネントのLayer 2をイメージの上に配置してから、プロパティインスペクタでビデオのパラメータを設定しています。

FLVファイルのアルファチャンネルを使用した背景に、話す人物の顔をスーパーインポーズ
図26.FLVファイルのアルファチャンネルを使用した背景に、話す人物の顔をスーパーインポーズ

これで作業は終了です。話す人物の顔の背後にイメージを表示できる、アルファチャンネルを含むFlashビデオファイルが作成されました。

高度なリソース

アルファチャンネルを含むビデオを作成できるため、ビデオ、話す人物の顔のビデオ、目を引くバナー広告をWebページに組み込むことができます。Flashでの処理には追加のハードウェア、ソフトウェアは不要で、高度なWeb開発の技術さえも必要としません。マウスをクリックすることさえできれば、ビデオをWebページに追加できます。

ビデオ編集アプリケーションとFlashの両方で、このテクニックをお試しください。ここではAdobe Premiereを使用しましたが、Adobe After EffectsとApple Final Cut Proのどちらにも、きわめて強力なキーイングフィルタが多数用意されています。これらの使用方法を身に付けてください。

ビデオ制作スタジオや地元のテレビ局を訪問することができるならば、「緑色の画面」での撮影を見学できるかもしれません。影を消すために、背景に照明が当てられていることに注意してください。自分でビデオを作成してアルファチャンネルを追加する場合は、単色(白い壁などの単色)を背景にして対象を撮影し、得られた素材を使用してください。「プロ級の品質」にはならないかもしれませんが、妥協も必要です。

More Like This

  • Flash Video テンプレート : ナビゲーターのビデオと各種グラフィックを同期したプレゼンテーション

製品

  • Acrobat
  • Creative Cloud
  • Creative Suite
  • Digital Marketing Suite
  • Digital Publishing Suite
  • Elements
  • モバイルアプリ
  • Photoshop
  • Touch Apps

ソリューション

  • デジタルマーケティング
  • コンテンツオーサリング
  • Web Experience Management

業種別ソリューション

  • 教育
  • 金融機関

サポート

  • ヘルプ&サポート
  • 注文と返品
  • ダウンロードに関するヘルプ
  • ユーザー登録に関するヘルプ

ラーニング

  • ADC: Adobe Developer Center
  • Adobe TV
  • Design Magazine
  • Photoshop Magazine
  • Focus In

ご購入方法

  • アドビストア
  • アカデミックストア
  • アドビライセンスストア
  • ボリュームライセンスについて
  • 販売パートナー
  • キャンペーン情報

ダウンロード

  • Adobe Reader
  • Adobe Flash Player
  • Adobe AIR
  • Adobe Shockwave Player

会社情報

  • プレスルーム
  • パートナープログラム
  • 企業の社会的責任(英語)
  • 採用情報
  • 投資家の皆様へ(英語)
  • イベント&セミナー
  • Legal(英語)
  • セキュリティ
  • お問い合わせ
国・地域および言語の選択 日本(変更)
国・地域および言語の選択 閉じる

North America

Europe, Middle East and Africa

Asia Pacific

  • Canada - English
  • Canada - Français
  • Latinoamérica
  • México
  • United States

South America

  • Brasil
  • Africa - English
  • Österreich - Deutsch
  • Belgium - English
  • Belgique - Français
  • België - Nederlands
  • България
  • Hrvatska
  • Česká republika
  • Danmark
  • Eastern Europe - English
  • Eesti
  • Suomi
  • France
  • Deutschland
  • Magyarország
  • Ireland
  • Israel - English
  • ישראל - עברית
  • Italia
  • Latvija
  • Lietuva
  • Luxembourg - Deutsch
  • Luxembourg - English
  • Luxembourg - Français
  • الشرق الأوسط وشمال أفريقيا - اللغة العربية
  • Middle East and North Africa - English
  • Moyen-Orient et Afrique du Nord - Français
  • Nederland
  • Norge
  • Polska
  • Portugal
  • România
  • Россия
  • Srbija
  • Slovensko
  • Slovenija
  • España
  • Sverige
  • Schweiz - Deutsch
  • Suisse - Français
  • Svizzera - Italiano
  • Türkiye
  • Україна
  • United Kingdom
  • Australia
  • 中国
  • 中國香港特別行政區
  • Hong Kong S.A.R. of China
  • India - English
  • 日本
  • 한국
  • New Zealand
  • 台灣

Southeast Asia

  • Includes Indonesia, Malaysia, Philippines, Singapore, Thailand, and Vietnam - English

Copyright © 2012 Adobe Systems Incorporated. All rights reserved.

利用条件 | プライバシーポリシーとCookie (更新)

Reviewed by TRUSTe: site privacy statement