高見知英のかいはつにっし(β)

高見知英のアプリケーション開発日誌 のほか、地域活動などの活動報告ブログ。

SBC.にてブレ恋の配信支援を行いました。 技術的振り返り

f:id:TakamiChie:20210330221734p:plain

まちづくりエージェント SIDE BEACH CITY.のブログでも書きましたが、先日3月13日まで、五回に分けて、ブレストウォーズ恋する標準治療という演劇のプレ番組配信のサポートを行いました。

sbc.yokohama

こちらはStreamYardという配信サービスを使って、YouTube Live、Facebook Liveで同時配信をやった番組。当日は3月20日に行われた本公演の出演者による演劇内容紹介、関係者の感想紹介、番組の閲覧者のコメント紹介などを、毎回30分~1時間にわけて行いました。

視聴者もなかなか多かったようで、わたしたちまちづくりエージェント SIDE BEACH CITY.が関わったオンライン放送の中ではかなり盛り上がった番組だと思います。

ブレ恋配信を支えた裏側

さて。今回はこのブレ恋配信を支えた裏側について、まちづくりエージェント SIDE BEACH CITY.のブログで書くにはややカロリーの大きな話題について触れていこうと思います。

具体的にはあちらの記事にも書いたツールの紹介や、当日出演者との連絡、今後同じようなイベントをやる際の注意について、2,3書いてみようかなと。

当日使用したツール

当日使用したツールは、あちらの記事にも書いたとおりですが、以下の三つです。

CastBackground

CastBackgroundについては、まちづくりエージェント SIDE BEACH CITY.の方でわたしが開発していたHTML5アプリ。ブラウザのタブに表示することで、写真や動画など、さまざまなコンテンツをワンタッチ表示できるようにするツールです。

簡単な使い方については、先日YouTubeに動画をアップしましたので、ご覧ください。

11月、12月の配信ではまだCastBackgroundを作っていなかったので、いちいち空っぽのブラウザタブに写真や動画をドロップするという非常にアナログな手法でスイッチングしていたのですが、これを開発したことによって本当に配信が楽になった。

まだこのツールも伸びしろがありそうなツールなので、今後いろいろと拡張を行ってみたいツールです。

Zello

Zelloのほうは、日本ではあまり名前を聞きませんが、トランシーバーのように「ボタンを押している間だけ喋ることができる」というトランシーバー風通話アプリ*1

これを自分の端末と、現場スタッフの方のうち一人*2スマートフォンに入れてもらい、「ゲスト参加の順番が変わった」とか「画像を切り替えてください」などの指示を受け取るわけです。

StreamYardにはPrivate Chat機能があるのでその中でやりとりしても良いのですが、配信に関する操作を行っている最中はPrivate Chatを見ることができず、即時対応が難しいため、このへんは音声でやりとりした方が楽だと感じました。

連絡係の声が配信に入らないように注意が必要ですが。

Excel台本

そして地味に助かった、Excel台本の存在。

台本には当日のタイムラインとそこでの内容、画面上の出演者フレームイン・アウトなどの指示が書かれており、大まかにはみなさん台本の通りに話を進めていきます。

これがあったおかげで、ブレストウォーズのメンバーとは普段それほどかかわりのない自分でもちゃんと当日の進行が務まったわけで。本当にこのような台本を作っておくことは大事かなと。

ちなみに「Excel方眼紙だ!ウムム!」と思う方もいらっしゃるかもしれませんが、以下の理由からこれはExcelでないといけなかったです(Google SpreadSheetなどでもいいけど)。

  • だいたいの時間とそのときの会話内容が対で記録できること
  • 行番号が振られているため「以降何行に飛びます」みたいな指示ができたこと
  • OneDrive上に配置してあれば複数人で同時に編集できたこと*3
  • こちらで備考を書き込む欄があること*4

場面ごとにシートを分けるなど、突然の式次第変更に対応しやすい仕組みは欲しかったですが、個人的にはExcelブックで正解だったと思いました。

やっぱり配信スタッフは重要!

さて。同じようにまちづくりエージェント SIDE BEACH CITY.で行っているStreamYard配信イベントとしては、SBC.オープンマイクがあります。

sbc.yokohama

こちらのほうは、裏での場転換を行うスタッフなどはおらず、わたしが司会と配信操作を兼務しています。

じゃあ当日配信スタッフがいなくてもやっていけるかというと、そんなことはない。

実際にStreamYardの配信スタッフを行う場合、テロップを出したりコメントの確認、配信状況の確認、ロゴの表示などやることが結構多い。

正直SBC.オープンマイクは結構異常です。視聴者がそんなに多くなく、ゲストも多くて3人の小規模な放送だからあれでなんとかなっているものの、正直それ以降だと、専任スタッフがいた方がかなり安定度が増します。

実際SBC.オープンマイクも、配信操作を行う前後などあからさまにわたしの言動が不自然になっているときがありますし。

なので、今回のブレ恋プレ番組のように、配信スタッフがいて、現場の人とZelloなどで繋ぎつつ実施する(または、現場に配信スタッフと司会者が共にいる状態にする)のがベストだなと感じました。

まとめ

個人的には、オンラインイベントの配信は、StreamYardがかなり鉄板だと思っています。

オンラインでの配信を支えるツールとしては、OBSというツールもありますが、StreamYardでは、OBSで難しいところや、失敗しやすいところが全部カバーされている。

そのうえ配信に関する制御はすべてサービス上で行われるため、万が一司会のPCやインターネット回線が落ちても、配信が止まらない。

技術力のあるスタッフを複数人確保でき、太い通信回線が確保できるのでなければ、無理にOBSを使ったりせず。StreamYardで配信を行う というのが無難でしょう。

また、YouTubeに映像を飛ばせるオンライン通話サービスとしては、Zoomなどもあります。

ただしYouTubeFacebookなど、一度に一つのチャンネルにしか送信できず、テロップを表示したり参加者のコメントを表示したりすることもできないため、絵的には今ひとつな感覚があります。

やはりウェビナーや一部のスピーカー中心のスピーチイベントは、StreamYardが鉄板だなあ と。

映像や動画などの表示は、CastBackgroundを使うなり、PowerPointやブラウザなどをまるごと共有 といったところでしょうか*5

StreamYardの惜しいところ

StreamYardでテロップを表示した場合、スタジオ画面ではテロップは日本語フォントで表示されるのですが、YouTubeFacebook Live上では中国語フォントで表示されてしまう という問題があります。

f:id:TakamiChie:20210330215321p:plain
日本語文字列を表示したところ(上:スタジオ画面、下:配信画面)

正直これはStreamYard開発チームの方も想定外の動作ではないか?と思っているのでいちおうフィードバックは出したのですが…。修正されるかどうかは微妙なところ。

いちおうStreamYardは透過PNG画像を配信上に被せて表示する、オーバーレイなんて機能もあるので、独自でテロップを描画するなど回避策はあるのですが、実用性はイマイチ。

あとはTwitterハッシュタグを追ってコメントを表示したりなどといったことができないので、イベントによってはあまりStreamYardの力を活かせない場合もあります。このへんも一応フィードバックはしているけど実装してくれるかなあ。

ただ、その辺を差し引いてもStreamYardは十分に素晴らしいツールで、オンライン配信においてはとても力強い味方となるツールです。

操作方法はやはり複雑なのでいきなりフル機能を使うのは難しいですが、是非使い方を覚えていろんなイベントをやりたいところですね。

今後のオンライン配信

わたしとしては、ひとまず今までどおり、まちづくりエージェント SIDE BEACH CITY.でのオンライン配信を行っています。

とりあえず来月は、磯子七福神巡りをテーマとした配信と、図書館とゲームをテーマにしたトーク回を行う予定です。

www.youtube.com

www.youtube.com

五月以降もいちおう大まかには決定済み。翌月のイベント状況をあらかじめ確保しておくことで、かなり心の余裕も生まれました(時間的余裕は未だにあまりないですが・・・)。

こちらのほうも、自分の負担を少しでも減らすような取り組みを検討中。かたまったらまたどこかで記事化するのも良いかな と。

また、それ以外の箇所でも、オンライン配信のサポートは行っていこうかなと。

もちろんこちらも人手不足ですので場合によっては「その代わりにこれを手伝ってね」など言うこともあるかと思いますが。

*1:以前、Ingressのチーム戦で使われたことがあるらしい

*2:たぶん複数人に入れてもらってもいいと思いますが

*3:常に最新の情報をこちらで確認できた

*4:テロップとして何を表示する、ロゴを表示する・非表示にする など

*5:タブを共有する場合と違ってIMEの入力候補が配信されてしまうので、見せたくない情報が見えてしまうというリスクもありますが