HTTP Live Streaming（以下 HLS） とは、Appleが開発した、動画配信のテクノロジーで、iPhoneなどで動画をストリーム再生したい場合、利用される形式です。

HSLは、特別なストリーミングサーバーを必要とせず、通常のWebサーバーから配信できるため、レンタルサーバーでも、その気になれば、少しの設定で配信することは可能です。

HLSの動作デバイスは

• MacOS X10.6以降のSafariブラウザ
• iOS3.0以降
• Android3.0以降

Windowsでは、VLC media playerで（一応）動作しますが、IE、Chrome、Firefox、そしてMacOSでもChrome、Firefoxといったメジャーなブラウザでは、動作しません。

※追記 2014/7/25 FlashでHLSを再生できるようにしたベンダーがでてきています。（有償です）

HLSの特徴として、通信速度に応じて映像画質を変えるアダプティブストリーミングで再生することができます。これは、ビットレート・画面サイズの異なる同一の動画を複数作り、クライアント側の通信速度に応じて、再生しながら切り替えるストリーミングのことを言います。

同じWebサーバーからの配信で、HLSとの比較に、プログレッシブダウンロードの動画ストリームがあります。この場合、別のビットレートの動画に切り替えることができないため、柔軟性の面で、HLSのほうが優れています。逆に、HLSのネックは、再生環境が限られるといった所でしょうか。

HLS動画の仕組み
HLSの動画フォーマットは、MPEG TS（映像 コーデックH.264）、AAC（音声）です。そして、１つの動画は、10秒ごとに分割された、細切れのファイル（.ts）になり（※ これをメディアセグメントファイルと言います。）、目次に相当するプレイリストファイル（.m3u8）の２つから構成されます。



ファイルが分割されているので、プレイリストの再生指示により、どのファイルからも読み込むことができ、プレイリストの指定順に、次々とファイルが読み込まれます。見た目には、ファイルが分割されていても、スムーズに一体として再生されます。



１つ１つのファイルは、プログレッシブダウンロードのように読み込まれるため、10秒を超えてあまり長い分割だと、再生に時間がかかったり、細かすぎるとサーバーに負担がかかるため、推奨は10秒になっています。

またベンダー製品のAdobe Media Server、Wowza Media Serverでは、HLSをサポートしています。通常のWebサーバーで配信できるなら、ストリーミングサーバーは、必要なさそうですが、ファイルをあらかじめ分割せず配信できたり、Flashなど別の配信フォーマットにも１つの動画ファイルで対応できるといった、特徴があります。

Appleのサイトでは、HSLについてのドキュメントが公開されているので、気になる方は、一読しておくといいでしょう。また、サンプル動画のURLも記載されているので、参考になると思います。
HTTP Live Streamingの概要 (PDFファイル)

次回は、実際に作ってみようと思います。
HTTP Live Streaming 動画配信のやり方 （実践）

参考
「FlashでHLS（HTTP Live Streaming）を再生するには・・・ただし有償」
https://bizvalley.co.jp/blog/7055.html

-

【求人情報】
映像制作正社員スタッフ募集しています！
応募は＜こちらのページ＞からお気軽にどうぞ。


※スマートホンでご覧いただいたる方はPCページのトップにリンクがございますのでそちらからお願い致します。

HTTP Live Streaming は、特別なサーバーアプリケーションを必要とせず、MIME設定を行えば簡単に配信できることを、HTTP Live Streaming 動画配信のやり方 （実践）で、説明しましたが、そのとき、Webサーバーは、Apacheをベースにしていたので、今回は、Windows ServerのIISから配信を試してみようと思います。

とはいっても、MIME設定するだけです。

サーバーを用意する
Windows Serverは、AmazonEC2のクラウドを利用しました。数時間程度の利用なら数百円程度で高スペックなサーバーを利用できるので、とても便利です。

IISでMIMEを設定する
IISは、インストール済みであることを前提として、MIMEの設定を追加します。サーバーマネージャーから、Webサイトの設定を行います。いくつか設定項目がある中から「MIMEの種類」を選択します。

MIMEタイプを追加する
「追加」を選択すると、種類を追加することができます。

ここで、下記２つを追加します。

ファイルの拡張子　.m3u8
MIMEの種類　application/x-mpegURL

ファイルの拡張子　.ts
MIMEの種類　video/MP2T

これで設定は完了です、あらかじめ動画用意すると、このような感じで再生できます。

サーバー側のネットワーク負荷をみると、常に負荷が掛かっている訳でなく、断面化された動画のセグメントファイルを、定期的に送信しているように見えます。このあたり、プログレッシブダウンロードと比べてみると面白いかもしれません。

-

【正社員募集のお知らせ】

当社では、映像制作の経験がある方を広く募集しています。自らの発想力とコミュニケーション力を映像制作の現場で発揮したい熱意ある方からのご応募をお待ちしております。

詳しくは【人材募集】のページをご覧ください。

※スマートホンでご覧いただいている方は、PCページのトップにリンクがございます。そちらからご応募お願い致します。

ビズバレーの映像スタジオのご紹介です。まず立地がとても良いのでどなた様もアクセスは容易です。地下鉄神保町駅・九段下駅、JR水道橋駅、から徒歩5～6分の好立地です。


それではスタジオへご案内いたします。


弊社のスタジオはブルーバックを使用したクロマキー合成が可能です。


まずはモデルの村岡さんにポーズをとってもらいます。これだけだと背景が青くて特に面白味もないです。


そこにプールサイドの画像を合成すると、もう気分は夏です。（※実際は動画です）


次はこちらです。


雪山登山の映像に早変わりです。


他にもパソコン画面を背景にすることもできます。


ワイプでの切り抜きなど多種多様なニーズに応えられます。


完全防音のモニターブースからカメラ等を操作できます。

今回はクロマキー合成のほんの一部をご紹介しました。パワーポイントを使ってのプレゼンや、セミナー動画など可能性は無限大です。プロンプターもありますのでカメラ目線で原稿を読むことも可能です。

詳細はこちらのスタジオページをご覧ください。見学も可能ですお気軽にご連絡くださいませ。

-

【中途採用・求人情報】

映像制作正社員スタッフ募集しています！
応募は＜こちらのページ＞からお気軽にどうぞ。


※スマートホンでご覧いただいている方は、PCページのトップにリンクがございます。

前回はオブジェクトの位置に

x=Math.sin(time*2)*20;
y=Math.sin(time*4)*10;
[x,y]

というエクスプレッションを適用して、ふわふわ浮いているようなアニメーションを作成しました。

今回はこれをベースに別のアニメーションを作成します。

早速ですが記述していきましょう。
2行目を少し変更します。

y=Math.abs(Math.sin(time*4)*10);

太字部分が書き加えられた部分です。
さて、どうなったか見てみましょう。



天井に頭をぶつけて跳ね返っているようなアニメーションができました。

書き加えた Math.abs() は()内の数値の絶対値を取得する命令です。

今回の場合は()内に Math.sin(time*4)*10 すなわち 0 → 10 → 0 → -10 → 0 と
推移する数値が入っています。

よってその絶対値ですから、 0 → 10 → 0 → 10 → 0　と なります。

波形はこのようになっています。



少し改良します。

同じく2行目を

y=Math.abs(Math.sin(time*4)*10)*-1;

と、　*-1　を追加しました。

するとこのように変化します。



反復横跳びのようなアニメーションができました。

Math.abs(Math.sin(time*4)*10)が生成した　0 → 10 → 0 → 10 → 0 　と推移する数値に
*-1 していますので　0 → -10 → 0 → -10 → 0　という結果になっています。



仮にこれで目的のアニメーションができたとします。

ところが、「基本的にはokだけど、もう少し動きを大きくして欲しい」とオーダーがありました。
さてどうしましょう。

簡単ですね。
前回の記事をお読みの方はすぐにお分かりだと思います。

x=Math.sin(time*2)*200;
y=Math.abs(Math.sin(time*4)*50)*-1;
[x,y]

太字部分が変更点です。
xの振れ幅を 20 → 200
yの振れ幅を 10 → 50　と変更しました。

こんな感じになりました。



ちょっと左右の動きが速すぎる気がしますが今回は良しとしましょう。

次回はオブジェクトの位置だけでなく他のプロパティにもsin波を利用した
アニメーションを作成したいと思います。

-

【中途採用・求人情報】

映像制作正社員スタッフ募集しています！
応募は＜こちらのページ＞からお気軽にどうぞ。


※スマートホンでご覧いただいている方は、PCページのトップにリンクがございます。

最近、映画館に行かなくなりました。TSUTAYAでDVDレンタルもしなくなりました。
何故なら、家のテレビで観れちゃうからです。Netflix、Amazon Prime、Huluに代表される動画配信サービス便利ですよね。

レベルの高い海外ドラマも容易に観られるようになって嬉しい限りです。そこで今回は保立おすすめの作品を6本ご紹介したいと思います。（アルファベット順）

①BARRY（バリー）
エミー賞で二年連続主演男優賞コメディ部門を獲った作品です。ビル・ヘイダー好きは必見。1話30分というのも、空き時間に観るにはちょうど良いです。

②BIG LITTLE LIES（ビッグ・リトル・ライズ）
ママ友同士のいざこざ話。最後の最後までどうなるかわからない展開です。有名女優たちが熱演します。シーズン2にはメリル・ストリープも出ます。

③BLACK MIRROR（ブラック・ミラー）
近未来を舞台に社会風刺が強烈な1話完結ものです。好みにもよりますが、捨て作ないです。Netflixに入会していてどれを見るか迷ってる人にオススメ！

④STRANGER THINGS（ストレンジャー・シングス）
80年代のインディアナ州が舞台。グーニーズ、スタンドバイミー、ETとか好きな人はハマります。シーズン2のラストは感涙必至。サントラも最高。

⑤TRUE DETECTIVE（トゥルー・ディテクティブ）
南部ゴシックの傑作。私生活でも親友同士のM・マコノヒーとW・ハレルソンが未解決事件を追います。ドラマというより、もはや映画です。

⑥WHEN THEY SEE US（ボクらを見る目 ）
4話完結のミニドラマです。NYセントラルパークで起きた実際の冤罪事件の物語です。この時代に絶対観なければいけない作品だと思います。