[PR] ストリーミングの事ならリアルストリームへ


« Real Media PLayerの場合 | メイン | Helix Universal Serverから... »

Chapter5 

●Windows Media の場合

遠隔学習や企業のプレゼンテーション用コンテンツの作成、あるいはブランドの強化を問わず、デジタル メディア ファイルに”URL” を挿入することにより、インタラクティブで同期的なプレゼンテーションを作成することができます。Web と Media Player の機能を組み合わせることで、視聴者の注意を引き付けるだけでなく、コンテンツのメッセージを効果的に伝える環境が実現できます。
pp-01.gif
Player はデジタル メディア ファイル内の ”URL” に達すると、デフォルトのブラウザが起動し、対応する Web ページが表示されます。デジタル メディア コンテンツ内の URL を使用することで、ファイル内の適切な位置で、指定した Web サイトにユーザーを確実に誘導できます。 ここではデジタル メディア ファイルに URL を埋め込むことで、視聴者に提供するコンテンツを向上させる方法をご説明いたします。

【デジタル メディア ファイルへの URL の埋め込み】
Windows Media ファイルエディタまたはWindows Media ASF Indexerを使用して、デジタル メディア ファイルに URL を埋め込むことができます。Windows Media ファイルエディタまたはWindows Media ASF Indexerは、Windows Media ファイル内でスクリプトを挿入および編集できるツールです。多数の URL をファイルに挿入できますが、デジタル メディア ファイルの指定した位置には 1 つの URL しか配置されません。

Windows Media Player は、デジタル メディア ファイル内の埋め込まれた URL に達すると、自動的にデフォルトの Web ブラウザを起動し、指定された Web ページを表示します。この機能は、URL フリップ と呼ばれています。URL フリップによって、デジタル メディア ファイルの特定の位置と、Web ページを同期させることができます。

Windows Media ファイルエディタを入手するには、Windows Mediaエンコーダをダウンロード、インストールすれば一緒にインストールされます。またはWindows Media ASF Indexerを入手するには、Windows Media テクノロジー Web サイトから Windows Media Resource Kit をダウンロードしてください。
http://msdn.microsoft.com/windowsmedia/downloads/default.aspx

【Windows Media ASF Indexer】
ここでは、Windows Media ASF Indexerを使用したデジタルメディアファイルへのURL埋め込みを解説いたします。

[注釈:何故Windows Media ASF Indexerなのか]
Windows Media ファイルエディタとWindows Media ASF Indexerの大きな違いはインポートファイルの書式により相違であります。作成者は常に簡易性を作業フローに求めます。Windows Media ファイルエディタのインポートファイル書式には作業者が戸惑う書式内容でのXMLになっており、映像クリエータ的には簡易的な書式でインポート可能である、Windows Media ASF Indexerを選択するでしょう・・

講座内で使用する素材はこちらからダウンロード出来ます。

Windows Media ASF Indexerでは下記作業が行なえます。
[タイトルなどの属性を付加する]
「Properties」欄に、「Title」(タイトル)、「Author」(作成者)、「Copyright」(コピーライト、)「Description」(説明)、「Rating」(ビットレート)の各情報を入力できます。

[トリミング(カット)編集する]
「再生」ボタンをクリックして動画を再生させ、トリミング(カット)して残したい動画の開始点で「Mark In」、終了点で「Mark Out」をクリックします。

[マーカーを付加する]
「マーカー」が付加された動画をWindows Media Playerで再生すると、Windows Media Playerの「表示」→「ファイルマーカー」を選択することで、マーカーが付加されたポイントへ一瞬に移動できます(頭出し機能)。マーカーを付加する方法は、「Edit Markers」をクリックし、「New」を押して、マーカーの「Name」(名前)とマーカーを付加するポイントの「Time」(時間)を入力して「OK」をクリックします。マーカーの位置は、マウスでドラッグ&ドロップして移動することも可能です。

[URL情報を付加する]
URL情報を付加すると、動画の再生と同時にブラウザが自動的に起動し、指定したURLのページを表示する。動画と関連のあるWebサイトを表示したい時に便利な機能。URL情報を付加する方法は、「Edit Script Commands」をクリックし、「New」を押して、Webサイトを表示したいポイントの「Time」(時間)を入力します。「Type」欄は「URL」を選択し、「Parameter」欄に表示したいWebサイトのURLを入力します。


ここでは、各機能の作業手順は割愛して、[URL情報を付加する]作業をご説明いたします。

では、早速Windows Media ASF Indexerを使用したデジタル メディア ファイルへの URL の埋め込作業を行ないましょう!

まず、Windows Media ASF Indexerで作業できる様に拡張子を変更します。Windows Media ASF Indexerで作業できる拡張子は「.asf」です。「.wmv」ファイルを「.asf」に拡張子を変更しましょう!
pp-02.gif


pp-03.gif
デスクトップのWindows Media ASF Indexerショートカットをダブルクリックして起動します。もしくは、スタート>プログラム>Windows Media>Windows Media ASF インデクサを選択。

するとWindows Media ASF Indexerが起動しますので、ファイル>開く を選択して、拡張子を変更したWindows Mediaファイルを選択します。(素材 slide.asf)
pp-04.gif

ファイルを開いたら再生ボタンをクリックしてプレビュー画面に表示させます。URLを埋め込むシーンになったら一時停止ボタンをクリックして再生を停止します。この状態で「スクリプトコマンドの編集」をクリックします。
すると、「スクリプトコマンド」画面が起動しますので、画面右上にある「新規追加」ボタンをクリックします。
pp-05.gifpp-06.gif

すると新たに「スクリプトコマンドのプロパティ」画面が起動します。入力項目“時間”には自動的に埋め込みたいタイムが記載されています。(一時停止を押したタイム)
"種類"は動作させるタイプが選択できます。ここでは「URL」を選択します。“パラメータ”で表示させたいWEBページのURLを記入します。なお、フレームで区切っているページ上に表示させたい場合には、ターゲットフレーム名を「アンパサンド(&)」を2つ入れ記入します。

(例)
http://www.realstream.jp/lecture/slide/html/1.html&&main
(1.htmlのページをフレーム“main”に表示させる)
http://www.realstream.jp/lecture/slide/html/1.html
(1.htmlを新しいウィンドウで開きます)

pp-07.gif

すべての指定が終わりましたら「OK」ボタンを押します。
するとWindows Media ASF Indexerインターフェイス「スクリプトコマンドの時間軸」に緑色のマークが付き、URLが埋め込まれた事を表します。
URLの変更やタイムラインの変更は「スクリプトコマンドの編集」をクリックして「スクリプトコマンド」画面にて変更・削除したい設定内容を選択し、変更の場合は「編集」ボタンをクリックし、「スクリプトコマンドのプロパティ」画面で変更します。削除したい場合は「削除」ボタンをクリックします。
pp-08.gifpp-09.gif

設定が終了したら、ファイル>上書き保存を選択して保存します。違う名前で保存したい場合は、ファイル>名前を付けて保存を選択して任意の名前で保存して下さい。なお、上書き保存や名前を付けて保存をしても、拡張子は「.asf」のままですから「.wmv」に変更しましょう!
※ちなみに拡張子「.asf」でもストリーミング再生は可能です。

【インポートファイルを使用して一括設定】
パワーポイントのスライド数が何十枚にもなると、表示させるWEBページ数も並行して増えます。これを「スクリプトコマンドのプロパティ」で設定していくには手間と時間が必要です。そこで、前もってデジタル メディア ファイルへURLを一括して埋め込めるスクリプトファイルを作成してインポートする機能がWindows Media ASF Indexerにはあります。
下記インポートスクリプトファイルを作成します。これは普通のテキストエディタ(メモ帳・秀丸)で作成できます。

;Properties
Title:
Author:
Copyright:
Description:
Rating:

;Script Commands
start_script_table
00:00:04.0 URL http://realstream.jp/pp/1.html&&main
00:00:10.0 URL http://realstream.jp/pp/2.html&&main
00:00:20.0 URL http://realstream.jp/pp/3.html&&main
00:00:34.0 URL http://realstream.jp/pp/4.html&&main
00:01:04.0 URL http://realstream.jp/pp/5.html&&main
end_script_table

;Properties項目ではタイトル/作成者/著作権・・を記入できます。(任意)
;Script Commands項目では埋め込むURLの時間(タイム)と場所(URL)を記入します。
「start_script_table」~「end_script_table」の間に決められたスクリプト形式で入力します。
(例)00:00:04.0 URL http://realstream.jp/pp/1.html&&main
この例では再生0秒から再生4秒時にWEBページ「http://realstream.jp/pp/1.html」をフレームターゲット「main」へ表示させます。(&&を忘れずに)
この書式を表示させたい順番に改行して記入していきます。
すべて記入し終えましたら、任意の名前を付けて保存します。(拡張子は.txt)

pp-10.gif
Windows Media ASF Indexerを起動して、ファイル>開くを選択し拡張子を変更したWindows Mediaファイルを選択します。つぎに作成したScript Fileを読み込みます。
File>Import from script file..を選択して、作成したファイルを指定します。すると指定したURLの埋めこみが反映されました。

実際にちゃんと作成したScript Fileの内容でURLが埋め込まれているか確認をしてみましょう!
「スクリプトコマンドの編集」をクリックします。すると、「スクリプトコマンド」画面が起動します。インポートしたスクリプトファイルの内容で反映されていることが確認できます。
pp-11.gifpp-12.gif

pp-13.gif
反対にファイル>スクリプトファイルのエクスポートを選択することにより、Windows Media ASF Indexerで設定した内容がスクリプトファイルとして書き出されます。


【インデックス(索引)を設ける】
pp-14.gif
長編(20分以上)のパワーポイント同期コンテンツには、視聴者に見たい項目へジャンプさせるインディクス(索引)機能を設けたほうが良い場合があります。
ここでは、スクリプトコード(JavaScript)を使用したインディクス作成を解説いたします。

次の JavaScript コードの例では、Windows Media Player コントロールが呼び出され、インディクスがクリックされると対応する動作が実行されます。

<script language="JavaScript">
<!--

<!—インディクス -->
function Index(timeValue)
{
Player.controls.play();
Player.controls.currentPosition=timeValue;
}

-->
</script>

この例での関数は
Index 関数は、インディクスがクリックされると呼び出され、Controls オブジェクトのcurrentPosition メソッドが呼び出されます。currentPositionプロパティは先頭からの秒数で、メディア項目の現在位置を取得または指定します。

この例の全体のコードを次に示します。

<HTML>
<HEAD>
<script language="JavaScript">
<!--

<!-- インディクス -->
function Index(timeValue)
{
Player.controls.play();
Player.controls.currentPosition=timeValue;
}

-->
</script>
</HEAD>

<BODY>

<!--Streaming Screen-->
<OBJECT ID="Player" width="160" height="120"CLASSID="CLSID:6BF52A52-394A-11d3-B153-00C04F79FAA6">
<PARAM name="URL" value="slide.wmv">
<PARAM name="uiMode" value="none">
<PARAM name="autoStart" value="false">
<!--<PARAM name="autoStart" value="True"> -->
</OBJECT>

<br>

<!--Player Control-->
<a href="#" onClick="Index(0.200)">TOP</a><br>
<a href="#" onClick="Index(4.500)">スライド(01)</a><br>
<a href="#" onClick="Index(12.100)">スライド(02)</a><br>
<a href="#" onClick="Index(19.600)">スライド(03)</a><br>
<a href="#" onClick="Index(26.800)">スライド(04)</a><br>
<a href="#" onClick="Index(32.600)">スライド(05)</a><br>

</BODY>
</HTML>

Body内の構文
<a href="#" onClick="Index(4.500)">スライド(01)</a>

関数Indexを使用して4.5秒を指定しています。この指定する数字は秒数で書き込んで下さい。
(例)
1分30秒=90.000
2分53秒=173.000

◆インディックスの秒数を指定する際のヒント!
指定したインディクス内容に合ったWEBページも同時に表示させるには、先に埋め込んだURLの秒数より前の秒数を指定する。

★完成したパワーポイントと同期を見てみる


この講座へのリンク

この講座のリンクを入れるHTML: