OBS Scene Switcher Ver.2 〜M5StackでOBSのシーンを切り替える〜

M5Stack Core2 のタッチスクリーンをタッチすることで、OBS Studio で設定した複数のシーンを切り替える、というものです。

動画

開発素材

ツール

OBS Studio

API

shiftr.io

デバイス

M5Stack

システム構成

仕組みについて、以下の「ストーリー」の部分を参照ください。

ストーリー

[English follows Japanese.]

ライブ配信などに使われるオープンソースソフトウェアの OBS で、表示される画面構成（シーン）を切り替える機能があるのですが、それを外部から制御したものです。その外部からの制御に M5Stack（デモ動画では M5Stack Core2）を使っています。

M5Stack用のプログラムの実装には UIFlow を使っており（ファームウェアは、Beta2-core2）、M5Stack Core2 の操作ではタッチスクリーンを活用してみました。M5Stack Core2 の画面上に設定した 3つのエリアへのタッチ操作をトリガーに MQTT の通信が行われ、MQTTブローカーの shiftr を介して、Node-RED がさらに仲介をして OBS を制御します（Node-RED と OBS の間は WebSocket での通信）。

M5Stack Core2 の画面上での操作が行われた際には、選択されたシーンが分かるように、表示の書きかえを行っています。

以前、以下の内容で投稿していた作品の構成を変え、プログラムもいろいろと手を加えたものです。

　●M5Stack やスマホを使った OBS Scene Switcher | ProtoPedia

　　https://protopedia.net/prototype/a11f9e533f28593768ebf87075ab34f2

　●OBS をスマホや M5GO（M5Stack）から遠隔制御 〜 MQTT や obs-websocket を利用 〜 - Qiita

　　https://qiita.com/youtoy/items/23fb0e16f1a4428b5c9b

---

M5Stack Core2 is used for switching scenes of OBS, an open source software used for live streaming, etc., that is useful for online events!

I used UIFlow to implement the program for M5Stack Core2 (the firmware is Beta2-core2), and I used the touchscreen of M5Stack Core2 for controlling OBS.

MQTT messages are sent triggered by touch operations to the three areas on the touchscreen of M5Stack Core2. The shiftr (MQTT broker) and Node-RED are used for connecting M5Stack Core2 and OBS. (WebSocket is used for communication between Node-RED and OBS because the plug-in of OBS is required communication using WebSocket.)

The display shows which scene is selected. When the touchscreen is manipulated and the selected scene is changed, a red underline, circle mark and frame will appear at the corresponding location on the screen.

メンバー

• 

  Yosuke Toyota @youtoy

同じニオイがする作品

• お絵描きライブ
• IoTコーヒーグラインダー
• 素敵な写真を残すために
• Möbiusschleife: Beyond the Bounds of a VR System