LoginSignup
5
0

More than 1 year has passed since last update.

Zoom Meeting SDKでタイムキーパーちゃんを作る

Last updated at Posted at 2022-07-11

はじめに

ZoomがSDKを提供しはじめたということで盛り上がりを見せている昨今ですが、Qiitaでも盛り上げイベントが開催されています。SDKでいろいろ遊ばせてもらえる上に、アイテムもゲットできるかも、ということで参加するしかないですね。

ということで、これを機にいろいろ実験してみたのですが、面白そうなことがたくさんできそうだったので、いくつか連投する予定です。ご興味を持たれましたら、後続の投稿もご覧ください。

第1回の記事はこちら⇒Zoom Meeting SDKでタイムキーパーちゃんを作る ←本記事
第2回の記事はこちら⇒Zoom Meeting SDKでアバターにいろいろしゃべらせる
第3回の記事はこちら⇒Zoom Meeting SDKをつかって会議にアバターで参加する
第4回の記事はこちら⇒Zoom Meeting SDKでなんちゃってボイスチェンジャー
番外編の記事はこちら⇒Zoom Meetingにアバターで参加するぞ。番外編
第5回の記事はこちら⇒Zoom Meeting SDKとVosk browserでZoom会議のリアルタイム文字起こし

今回は、まずは手始めにZoomでタイムキーパーを作ってみたいと思います。
こんな感じに動きます。

とりあえず、Dockerイメージにしているので、ダウンロードして使ってみてください。

$ docker run -p 8888:8888 dannadori/zoom-meeting-plus:v01

http://localhost:8888/ にアクセスすれば使えるようになります。
なお、httpで起動しているのでローカルで使用する必要があります。

操作は次の通りです。

image

image

image

image

image

Zoom提供のSDK

ZoomはMeeting SDKとVideo SDKを提供しています。
Video SDKはかなり自由にUI/UXをカスタマイズできるようです。しかし、通常のZoomのミーティングへ参加することはできないようです。なので、Zoomのバックエンドを使って完全独立したコミュニケーションアプリを作る時に使うという理解をしています。
一方で、Meeting SDKは、Zoomが提供している公式アプリのUIコンポーネントを使ってお手軽にアプリが作れるという代物です。通常のZoomミーティングにも参加できます。なので、通常のZoomを使ったビデオ会議でちょっとしたお助け機能を追加するという時に使える、という理解をしています。

今回は、そもそもの私のデザインセンスだとZoomの提供しているUI/UXを超えることができるとは思えないですし、通常のZoomミーティングに参加できるアプリの方が使ってくれるユーザも多そうだ、という考えから、Meeting SDKを使うことにしました。後ほど時間があればVideo SDKの方も触ってみようと思います。

構成

タイムキーパー機能は、BotとしてZoom会議に参加します。少々トリッキーですが、Zoomが映像と音声のストリームを取得するとき(getUserMedia)に、ボットの映像と音声を流し込むMediaStreamをZoomのSDKに渡してあげます。この時、後から音声を流し込めるように、WebAudioAPIでAudioNodeを作成してそのストリーム(track)をzoomに渡してあげるのがよさそうです。そして指定された時刻になったら、そのノードに終了時刻の音声を流します。今回は終了の1分前、3分前、5分前にも通知できるようしました。

image

デモ

記事の冒頭で示した通りです。

リポジトリ

ここで紹介したデモは次のリポジトリで公開しています。
https://github.com/w-okada/zoom-meeting-plus

どんどんアップデートしていくので最新版は安定しない可能性があります。
次のタグでcloneして使ってください。

$ git clone https://github.com/w-okada/zoom-meeting-plus -b v01

宣伝

弊社 FLECT は、Salesforce を中心に AWS, GCP, Azure を用いたマルチクラウドシステムの提案、開発を行っております。 また、ビデオ会議システムについては、Zoom SDK, Amazon Chime SDK, Twillio など各種ビデオ会議用 SDK を用いたシステムの開発しており、サービス化の実績も多数あります。 ご興味をお持ちいただけたら是非ご相談ください。

5
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
0