映像制作 eラーニングのことならビズバレー
文字サイズの変更 標準 
大きい
ホーム > スタッフブログ
スタッフブログ
k.takahashi
k.taguchi
j.hashimoto
j.katou
y.hotate
m.kawai
s_inomata
m_muraoka
ビズバレーは、東京都 千代田区で活動する、映像制作、DVD、eラーニングを扱う会社です。

Strobe Media Playback を利用して、動画にメディアプレイヤーを設置してみようと思います。Flash Media Playback を利用したやり方は、こちらをご参考ください。

Strobe Media PlaybackとFlash Media Playbackとの違い
両方とも、FLV、MP4動画をFlashで再生するメディアプレイヤーです。

  • Strobe Media Playback
    アドビがオープンソースとして公開したもので、オリジナルのプレイヤーをデザインしたり、自前のサーバーに、メディアプレイヤーを設置することができます。開発の母体は、Open Source Media Frameworkです。
  • Flash Media Playback
    ざっくり言えば、アドビが Strobe Media Playback をAdobe.comにホストして公開したものです。カスタマイズ性は低いですが、手軽に利用できる所が特徴です。

サーバーに、ホストするだけなら、Strobe Media Playback は、それほど難しくはありませんので、設定して試してみましょう。

Strobe Media Playbackをダウンロード
Strobe Media Playbackのサイトから、ファイルをダウンロードします。


StrobeMediaPlayback_1.6.328-full.zip をダウンロードします。解凍すると、ソースコードの srcフォルダとパブリッシュ済みの for Flash Player 10.1などがあります。

20130313-2
for Flash Player 10.1フォルダの中身を見ると、いろいろ入っていますが、とりあえず、フォルダ名を「StrobeMediaPlayback」にリネームしてFTPでサーバーにそのままアップロードします。


setup.htmlにアクセスすると、「Strobe.swf Setup page」画面が表示されます。ここで、動画ファイルの指定などパラメータの設定を行います。



既定では、サンプル動画のURLが指定されているので、画面下の「Preview and Update」ボタンをクリックするとPreview Player上に、オレンジシャツのお兄さんが出現します。



20130313-6

では、用意した動画で設定してみましょう。

動画の指定、ポスターフレームを設定する
<Embed parameters>
動画の縦横のサイズを指定します。
例)Width = 640、Height = 360

<Flash Vars>
動画ファイルの指定
例)src = http://bizvalley.co.jp/asset/01/bizvalley_pv.flv

ポスターフレームの指定
例)poster = http://bizvalley.co.jp/asset/01/poster.png

「Preview and Update」ボタンをクリックすると、設定が反映されます。

20130313-7
サンプル動画

そして、埋め込みコードを、HTMLに貼り付ければ完成です。Strobe Media Playbackを利用すると、メディアプレイヤーをサイト内に配置して配信をすることができます。

次回は、iframeを利用した方法を説明いたします。
http://bizvalley.co.jp/blog/2405.html