はじめに
オンラインイベントで視聴者の反応をポン出し(効果音)で伝えるための仕組みを考えてみました。
きっかけ
いつもは河野総統(@nanbuwks)の拍手システムを使っていますが、少し前のイベントで効果音ポン出し画面を作ったので、それをオンラインイベントで使ってみないか、と連絡を受けて実装してみました。
効果音ポン出し画面についてはこちらの記事に詳細を記載しています。
構成
Node-REDダッシュボード
視聴者用のダッシュボード画面でボタンが押されると、運営用のダッシュボード画面で効果音がポン出しされます。
Node-REDフロー
視聴者用のボタンが押されると、運営用のダッシュボードで効果音がポン出しされるフローです。
仕組み
①参加者がブラウザでNode-REDダッシュボードにアクセスしてボタンを押します。
②Node-REDは効果音ラボのサイトへ音源データを要求します。
③Node-REDは効果音ラボのサイトから音源データを取得します。
④Node-REDは運営のブラウザへ音源データを送信し、効果音がポン出しされます。
運営の機器構成
イベントではオンラインツールとしてGoogle Meetを使用しました。
機器はRaspberry Pi 4を使用し、ブラウザはChromium (Chromeブラウザの基盤を形成するオープンソースプロジェクト)を使用し、運営用のNode-REDダッシュボード画面を開きます。
同じくChromiumブラウザでGoogle Meetへ接続しますが、効果音(ポン出し)をGoogle Meetのマイクへ入力するため、USBオーディオデバイス(PL-US35AP)を使用します。
Node-REDダッシュボードの効果音(ポン出し)の出力先をUSBオーディオデバイスのスピーカーとし、USBオーディオデバイスの音声出力と音声入力をステレオミニピンジャンクケーブルで直接接続し、ループバック構成にします。Google Meetのマイク入力にUSBオーディオデバイスを指定すれば完成です。
注意点としては、Google Meetの音声出力にUSBオーディオデバイスを指定しないことです。
(もし、USBオーディオデバイスを指定するとGoogle Meet内で音声がループしてしまいます。)
Google Meetの設定
音声と動画の設定を行います。
ノイズキャンセル機能
後で判明したことですが、GoogleアカウントによってはGoogle Meetの設定にノイズキャンセル機能が付いており、効果音(ポン出し)で大勢の人の歓声と笑い声が聞こえませんでした。(ノイズキャンセル機能をOFFにしたら問題ありませんでした)
驚き(ワオ！)や感嘆の声(すごい！)は問題ありませんでした。
ラズパイのオーディオ設定
Google Meetは入力音声の音量に応じて自動で調整する機能が有効になっており、効果音(ポン出し)の内容によってマイク入力レベルが変化(上昇)しました。
(Google Meetが音声が小さいと判断すると、Chromiumが勝手にマイク入力レベルを上げる動きをしました。)
効果音(ポン出し)の音量が大きいと感じた際は手動でマイク入力レベルを下げる必要がありました。
映像 (TIPS)
Google Meetのケースですが、参加者へ視聴者用のダッシュボードのURL情報を伝える手段としてQRコードを表示した際に、プロフィール画像の表示が小さく、スマートフォンのカメラで認識しませんでした。
Google Meetの映像をONにすることで、大きなQRコードを表示しました。
映像出力にQRコードを表示する方法①
OBS-Studioの仮想カメラ機能を使用すれば映像出力にQRコードを表示することが可能です。
OBS-Studioの導入手順については以下を参照してください。
映像出力にQRコードを表示する方法②
ffmpegコマンドで映像出力にQRコードを表示することが可能です。
仮想ビデオデバイス(v4l2loopback)をインストールして作成します。
以下のコマンドを実行すると、/dev/video0 デバイスが作成されます。
$ sudo apt install v4l2loopback-dkms
$ sudo modprobe v4l2loopback devices=1 video_nr=0 card_label=VirtualCam exclusive_caps=1
起動時に仮想ビデオデバイスを有効にする (v4l2loopbackカーネルモジュールを組み込んで /dev/video0 デバイスを作成する) 場合は以下の内容を設定します。
/etc/modules-load.d/v4l2loopback.conf ファイルを作成します。
v4l2loopback
/etc/modprobe.d/v4l2loopback.conf ファイルを作成します。
options v4l2loopback devices=1
options v4l2loopback video_nr=0
options v4l2loopback card_label=VirtualCam
options v4l2loopback exclusive_caps=1
ffmpegコマンドで "QRコードの画像ファイル" を仮想ビデオデバイスへ出力します。
$ ffmpeg -loop 1 -i "QRコードの画像ファイル" -f v4l2 -vf format=pix_fmts=yuv420p /dev/video0