[レポート] Media-JAWS 【第7回】「Inter BEEに合わせて久々にやっちゃいますか」に参加してきました #jawsug #mediajaws

こんにちは、大前です。

11/19 に開催された Media-JAWS 【第7回】「Inter BEEに合わせて久々にやっちゃいますか」 に参加してきましたので、参加レポートを書いていきたいと思います。

個人的にも久々の Media-JAWS という事で、楽しく参加させていただきました！

イベント概要

Amazon Interactive Video Service(IVS) と OBS Studio を使った動画配信システムの構築のハンズオンを実施します。みなさんご自身の環境からライブ配信をする仕組みを構築します！ 低遅延でインタラクティブな動画配信を構築しましょう！

こんな方向け ・配信やったことないけど、興味があるので手を動かしてみたい ・動画配信をビジネスにしたい ・低遅延でインタラクティブな配信をやってみたい ・OBS Studioを一度ちゃんと触ってみたい

この機会に是非ともご参加ください！

イベントレポート

オープニングトーク

• Media-JAWS とは
  • 東京近郊で 3ヶ月に一度程度を目標に勉強会や情報共有などを開催
  • 動画配信だけではなく、メディアという枠組みで様々なテーマを取り扱うコミュニティ
• 運営メンバー
  • 現在は 6名で運営
  • メンバー募集中とのこと！
• 是非アウトプットを！
  • note、ブログ、SNS、社内、なんでもよいのでアウトプットを！
  • ゆくゆくは登壇を...！
• ハッシュタグ
  • #jawsug #mediajaws

IVSハンズオン！ 初めてのライブ配信 〜Amazon Interactive Video Service（IVS） edition〜

スピーカー

AWS 亀田さん

レポート

• 初めてのライブ配信 〜Amazon Interactive Video Service（IVS） edition〜
  • 前回は MediaLive を使ったハンズオンをやったが、その後に IVS が出たため、今回はこちらを触ってみる
  • MediaLive の時は東京リージョンを使って 20〜30 秒ほどの遅延があったが
  • IVS は東京リージョンにまだ来ていないが、海外リージョンを使っても 3秒程度の遅延を実現できるサービス
• ストリーミング対応プロトコル
  • RTMP（年内でサポート終了）や Smooth Streaming が主流だった
  • 現在は HLS や DASH 等のストリーミング配信プロトコルが主流に
    • HTTP ベースで汎用性が高いという特徴
• HLS の基礎知識
  • プレイリストというファイルがあり、このファイルに各セグメント（細切れになった動画ファイル）のリストが記載されている
  • HTTP 上で行われるため、Web 用のネットワークがそのまま動画配信にも適用可能
  • このセグメントを小さくしていくのが低遅延配信において重要なポイントとなる
• 動的ビットレートとマルチビットレート配信
  • よくごっちゃになる単語だが、大切な要素なので違いをしっかり把握しよう
  • 動的ビットレート
    • 単一のファイル内でビットレートを可変させる仕組み
      • 映像の内容によって割り当てるビットレートを変える
  • マルチビットレート（Adaptive Bit Rate）
    • プレイリスト内で異なるビットレートのファイルを読み替える仕組み
• IVS は CBR を推奨
  • CBR
    • 常に同じビットレートで映像をエンコードし続ける
  • VBR
    • 平均と Max ビットレートを指定する方式
    • 自動でビットレートを変動させる
    • 最適化には手間がかかる
  • QVBR
    • VBR よりも動的にビットレートを変動させることができる
• マルチビットレート
  • あらかじめ複数のビットレートの動画ファイルを作成しておき、ユーザ側で切り替えられるようにする
  • クライアント側の帯域によって自動的に再生ファイルを切り替える方式
• ライブストリーミングでの課題
  • そもそも OTT（Over-the-top）の知識が必要となってくる
  • 双方向のインタラクティブなライブ体験には低遅延のビデオ配信が必要
• 遅延はどこで発生する？
  • 大きなポイントは 2つ
    • エンコード
    • プレイヤー
• 上記における遅延を最小化するための技術が色々と検討されている
  • LL-HLS
    • セグメントファイルをより細かく
    • セグメントファイル完了前にブラウザが読み込みを開始する
    • LL-HLS に対応していないブラウザは HLS で動作するため、互換性が高い
  • CL-HLS
    • LL-HLS はアップルが主導したもの
    • CL-HLS はコミュニティーベースで作り直しているもの
      • Communinty Low-Latency HLS
• Amazon IVS の源流は・・・
  • Twitch が培ってきた配信技術などをベースに実装を行なっている
  • CloudFront など既存の AWS サービスとは別の枠組み
• Amazon IVS の機能
  • 様々な機能を提供
  • Timed Metadata API
    • 視聴者に対して任意のタイミングでアンケートを投げたりできる
  • 3秒未満の超低遅延配信
  • AWS のグローバルインフラを使用
• Timed Metadata API について
  • IVS API を叩くことで Metadata を送ることが可能
  • 今日は Postman でハンズオンを行う予定

ハンズオン

ここからは提供されたドキュメントに沿ってハンズオンを進めていく時間に入りました。

また、ハンズオン中に困った事があった際にすぐに質問ができるようにスプレッドシートが共有されました。この取り組みはとても良いなぁと感じました。

ハンズオン資料は以下です。興味ある方はのぞいてみてください。

• https://github.com/harunobukameda/Amazon-IVS

以下、手順にしたがってそれぞれ作業を行なってみます。

1. Amazon IVS チャネルの作成

まず、AWS アカウントにログインし、Amazon IVS のページを開きます。

ハンズオン手順では最初に IAM ユーザを作成する手順なども乗っているので、IAM ユーザを持っていない方は必要に応じてそちらも実施ください。

東京リージョンではまだ使用できないため、オレゴンにて作業を進めます。

「チャネルの作成」というボタンからチャネル作成画面に遷移するので、各情報を入力し、作成ボタンをクリックします。

問題なく作成が完了すると以下の画面に遷移するので、以下情報をメモしておきます。

• 取り込みサーバーとストリームキー
• 再生 URL
• ARN

2. ライブストリームの作成

IVS の作成が完了したので、作成したチャンネルに対してストリームを行います。

本ハンズオンでは OBS Studio を使用するため、OBS がインストールされていない場合はインストールしましょう。

OBS を開き、「設定」→「配信」から先ほどメモした取り込みサーバーとストリームキーを入力します。

続いて左メニューから「映像」を選択し、出力映像の解像度とフレームレートを以下図の様に設定します。

解像度などを抑えることで、PC の負荷を下げることができます。

続いて、同じく左メニューから「出力」を選択し、以下の設定を行います。

• 出力モード ... 詳細
• エンコーダ ... x264
• レート制御 ... CBR
• ビットレート ... 2000（以下）
• キーフレーム感覚 ... 2
• CPU 使用のプリセット ... veryfast
• チューン ... zerolatency

ここでキーフレーム設定をちゃんと設定しないと低遅延にならないそうです。

ここまで設定したら、OK をクリックして設定画面を閉じます。

続いて、配信する映像を配置します。

ハンズオン資料では、「適当なエディター」とあったため適当なメモ帳アプリを開きました。

「ソース」の「＋」ボタンから「ウィンドウキャプチャ」を選択し先ほど開いたメモ帳アプリをキャプチャ対象として選択します。

ここまで設定したら、「配信開始」をクリックしてライブ配信を開始します。

OBS 上の右下で緑色の四角が表示されていれば OK です。

Chrome ブラウザでライブストリームを再生する

Chrome で以下 URL を開きます。

https://codepen.io/amazon-ivs/pen/43773681607df81d127d24f7a3250337

下記の様な画面が表示されるので、「Change View」→「Editor View」をクリックします。

（最初からソースコードが表示されている場合は不要です）

「JS」タブをスクロールすると const playbackUrl〜という部分があるので、ここを先ほどメモした IVS の再生 URL に置き換えます。

置き換えたら、上部の「Run」ボタンをクリックします。

すると、OBS で配信しているメモ帳アプリの画面が表示されました！

ブログだと伝えづらいですが、メモ帳に何か記入するとすぐに配信画面でも変更が反映されたので、低遅延で配信されていることが確認できました！すごい！

Timed Metadata を使ってみる

Amazon IVS には Timed Metadata という機能が提供されており、こちらを利用することでライブストリーム内の任意のタイミングで独自のデータを送信することが可能となります。

この機能を活用することにより、クイズやアンケート、統計情報の通知など、インタラクティブなアプリケーションを開発することができます。

今回は Timed Metadata の使用に Postman を使用します。

アカウントを持っていない方は作成しましょう。

アカウント作成後、以下 URL から Postman のアプリをダウンロードします。

https://www.postman.com/downloads/

Postman アプリを開いたら、「+」を押して新しいウィンドウを開きます。

メソッドを「POST」にし、URL にはhttps://ivs.us-west-2.amazonaws.com/PutMetadataを入力します。

続いて、「Authorizationn」タブより「AWS Signature」を選択し、IAM ユーザの AccessKey と SecretKey を入力します。

少し下にスクロールし、Region に us-west-2、Service Name に ivs を入力します。

Body タブから raw をクリックし、右側のドロップボックスから JSON を選択した上で、以下の値を貼り付けます。

その際、channelArn には IVS チャンネルを作成した際の ARN を指定ください。

ここまで設定したら、Postman にて「Send」をクリックします。

すると、先ほどのデモページにアンケートが表示されました！

これにて、無事に IVS Timed Metadata を使用することができました！

ハンズオンは以上となります。約30分でライブ配信基盤の構築から再生、メタデータの挿入まで試せたため、非常に手軽なサービスであることを改めて実感しました。

セッション1 : 9年前から欲しかったサービス

スピーカー

エフエム和歌山 山口さん

レポート

• 今日のメインは Amazon Polly の話
• 何を求めていたか？
  • 自分で開発できる Web プログラミングから呼び出せる
  • ラジオで放送しても OK な品質
  • 地方局でも使用できるぐらい安い
  • 文字の読み上げをやらせたかったが、なかなか実現方法が見つからなかった
    • 2011年の秋からずっと求めてた（長い...！！）
• ある日 Polly と出会う
  • 最初は AWS の事をほとんど知らなかった
  • API が提供されている事を知り、求められていたものだと直感しその後 1週間ほどで実装
    • 人がいなくてもニュースや天気予報を再生する
    • 災害時にディレクター1人だけで延々と放送し続ける
  • 6年越しで思いが形になり、感謝の気持ちが高まり AWS にメールをした
    • よくわからなくて料金問い合わせ的な所に連絡した
• そしたら・・・
  • お話を聞きたいと電話がかかってきた！
  • ニュース7デビューを果たしたり、InterBEE で登壇したり・・・人生が変わった
  • AWS のお問い合わせフォームを受け取る方が一番すごいと思っている
    • 頓珍漢な問い合わせを咀嚼して担当部署に連絡してくれた
    • AWS ほどの大企業がここまでの対応をしてくれる事に対し感激
• 何が言いたいかというと・・・
  • 何か良いものができたら AWS に連絡すると良いことがあるかもしれないですよ
• Sumerian の話
  • VR 上でニュース番組を作成するデモが流されました（すごかったです！）
    • 日本語だけでなく、英語の読み上げもしていたり
  • javascript で実装できる
  • S3 上の動画を再生できる、Youtube とかも再生可
  • まだまだ課題はあるが、現実のテレビ番組ではできない事が実現できるため、非常に将来性を感じている

セッション2 : 配信イベントで大活躍！！ AWS Elemental Link のお話

スピーカー

HTB 西崎さん（初登壇とのこと！）

レポート

• 10月に動画を見ながら買い物ができるエアcaravan というイベントを実施した
  • 赤平から Elemental MediaLink を経由して AWS に映像を取り込んだ
  • 今日は Elemental Link のお話
• AWS Elemental Link とは？
  • 電源 & LAN & 動画ソースさえあれば配信できるデバイス
  • AWS アカウントにハードが紐づけられる
• よくある構成
  • OBS → MediaLive → MediaPackage
  • 上記の OBS を MediaLink で置き換え可能
• なぜ Elemental Link を使用した？
  • 今までは様々な機材を会場に持ち込む必要があった
  • ハードウェアエンコーダーは他にもあるが設定が複雑。。。
  • Elemental Link は軽量、かつ使いやすい点がメリット
• 使い方
  • ネットワークの設定をし、各種ケーブルを接続するだけ
• Elemental Link 2台による構成
  • 片方が落ちてもシームレスに予備系に切り替わる点が素晴らしい
• 購入の仕方
  • 清水さんのブログを参考にしたとのこと！
    • AWS Elemental Linkのデバイスを注文してみた
  • 注意点
    • 注文したアカウントに紐づいて納品される
    • 注文したアカウントのルートアカウントに請求が行く
  • 電源と本体が届く、結構コンパクト
  • お値段
    • 約10万円 + 輸入消費税 1万円ほど
    • 計11万円
• 先週アップデートが
  • アカウントをまたいで動画を出力する事ができるように
    • AWS Elemental Link が機能とサービスリージョンを追加
  • MediaLive の STANDCHANNEL に対応
    • MediaLive のチャネルが 1つで良くなる
• エアcaravanにて発生した問題について
  • 配信画面に謎の線が・・・
  • 原因は不明、、、位相ずれなどを想定
    • ElementalLink の電源やケーブル類の抜き差しで復旧
    • 後日事象は再現せず・・・
  • 反省点としては実テストを前日のみしか行わなかった事

セッション3 : Amazon Chime SDKを利用したリモート演出ツール TBS Bell

スピーカー

TBS 藤本さん

レポート

• AWS Chime SDK をベースとしているシステム
  • AWS Chime SDK は AWS Chime の元となる技術
• コロナの影響でテレビ番組もリモート出演をする機会が多い
  • Skype など一般的な Web 会議ツールでは様々な UI が表示されてしまい、テレビ放送的にはあまり嬉しくない
  • zoom などでは会議に参加する順番や人数にレイアウトが依存してしまう
  • これらはあくまで会議システム向け
    • 放送向けの Web 会議システムを作ろうという流れに
      • Amazon Chime SDK を使用する事に
• システムについて
  • Amazon Chime SDK は UI など細かい部分をいじれるので痒い所にも手が届いた
  • レイアウトも独自にカスタマイズ、制御する事が可能に
  • 映像部分のみ放送する事が可能なので、OA にも使いやすい
  • 良くある Web 会議ツールはデバイス制御が難しいが、本システムはホストから各ユーザのデバイス制御を行う事ができる（支配的な Web 会議システムと表現されていました）
• 活用事例
  • 音楽番組で活用した
    • 本番で一気に 75人を表示
    • 一部落ちている方もいたが、問題なく本番を乗り切れた
  • その後も様々な番組で活用した
  • 今後も色々とアップデートしていきたい

セッション4 : いろんな映像MediaLiveにつないでみた～誰でも簡単に使えるクラウドプロダクションに向けた第一歩～

スピーカー

エクセラクス 大山さん

レポート

• 何を目指している？
  • コロナ状況でも営業できるバーチャル活動環境が欲しい
  • オンライン会議ではデモなどを見せずらいなど、課題あり
  • キーワード
    • 高画質、複数拠点、簡単に移動できる、ワンオペ・少人数チーム
• 今回 InterBEE でのバーチャルブースの支援をしている
  • AWS 側は Elemental Link や MediaLive などを使用しているシンプルな構成
  • 最終的な出力は Youtube Live
  • 多少の遅延はあれど問題なく配信できている
• 繋いでみたもの（発表資料が公開されるそうなので、細かい構成図などみたい方は是非そちらを参照ください）
  • HDMI 出力できるカメラがなかった・・・ → iPad で配信
  • BMPCC4K を使用したり
  • ST 2110 ネットワーク機器を接続してみた
    • NVIDIA のハードウェアを使用したり
  • Sony のハンディカム
  • Raspberry Pi3 + FFMPEG から RTMP を出力
• まとめ
  • 目指す環境に向けて、色々な映像を AWS につなげる実験をしてみた
  • まだまだ道半ばだが、色々試していく予定

おわりに

Media-JAWS 【第7回】「Inter BEEに合わせて久々にやっちゃいますか」 の参加レポートでした。

IVS の Timed Metadata はまだ触った事がなかったので今回のハンズオンで触れたのはとても良かったですし、各 LT も非常に内容が濃くて楽しい 2時間となりました！

次回開催を楽しみに待ちたいと思います。

以上、AWS 事業本部の大前でした。

参考

• Media-JAWS 【第7回】「Inter BEEに合わせて久々にやっちゃいますか」