動画を iPad/iPhone でもみられるようにする3つのステップ

Brightcove News

iPad/iPhone/iPod Touch (以下 iOS) ではFlashプレーヤがインストールできないため、通常のFlashベースのプレーヤでは動画が再生できません。最近リリースしたユニバーサル・デリバリー・サービス (UDS) とスマートプレーヤを使えば、以下の3つのステップで簡単にHTML5 で iOS 向けに動画を公開することができるようになります。

(1) ユニバーサル・デリバリー・サービス (UDS) とHTML5プレーヤの配信が有効になっていることを確認する

http://my.brightcove.co.jp からブライトコーブスタジオへログインします。右上部の『アカウント設定』をクリック。公開設定メニューにある『ユニバーサルデリバリーサービス』が有効になっていることを確認します。有効にする場合は右横の『編集』をクリックし、『有効にする』を選択し保存をクリックします。また、『HTML5プレーヤの配信』オプションも有効になっていることを確認します。

[アカウント設定/ユニバーサル・デリバリー・サービス/HTML5設定]

(2) 動画をH.264 でトランスコードする

トランスコード設定（アカウント設定 -> トランスコード設定）でマルチレンディションのトランスコード設定に

* H.264 (H264_BASE) 動画ビットレート: 110 kbps, 音声ビットレート: 40kbps, 幅: 400, 高さ: 300
* H.264 (H264_BASE) 動画ビットレート: 260 kbps, 音声ビットレート: 40kbps, 幅: 400, 高さ: 300

があることを確認します。このままでもiOSでの動画再生には問題がありませんが、Apple の推奨動画スペックにより厳密に従う場合は、上記2つの設定を下記に変更します。

* H.264 (H264_BASE) 動画ビットレート: 96 kbps, 音声ビットレート: 48kbps, 幅: 400, 高さ: 300, フレームレート: 15fps, キーフレームレート: 5, ビットレートタイプ: CBR
* H.264 (H264_BASE) 動画ビットレート: 192 kbps, 音声ビットレート: 48kbps, 幅: 400, 高さ: 300, フレームレート: 15fps, キーフレームレート: 5, ビットレートタイプ: CBR

変更したいエンコーディング設定の右はじの鉛筆アイコンをクリックすると編集画面に入ります。

トランスコートの変更は既にアップロードされている動画には影響はありません。変更後アップロードする動画に有効になります。マルチレンディションのH.264で動画がアップロードされていない場合は、設定後適当な動画をアップロードし、マルチレンディション、H.264を選択しトランスコードを行ってください。

(3) スマートプレーヤを設定し公開する

ブライトコーブスタジオのパブリッシングモジュールからプレーヤを新規に作成します。ここでは Chromeless Video Player を作ります。パブリッシングモジュール右下の『新規プレーヤ』をクリックし表示されるダイアログボックスから、"Chromeless Video Player" を選択し、新規プレーヤを作成します。名前はマイプレーヤとします。

作成したマイプレーヤを選択し『設定』をクリックします。設定ダイアログボックスの下方 "Enable HTML5 Delivery" のオプションにチェックが入っていることを確認してください。このチェックを入れるとプレーヤがデバイスを自動的に判別し、Flash と HTML5の動画プレーヤを自動的に切り替えるようになります。

これですべての作業が完了です。あとはこのマイプレーヤのJavaScriptパブリッシングコードをHTMLに貼りつけて先程マルチレンディションでトランスコードした動画ファイルを割り当てれば完成です。PCで見るとFlash の動画プレーヤで動画が再生され、iOS でアクセスすると HTML5 の動画プレーヤで動画が再生されます。