配信 · OBSブラウザソース

OBS用コントローラーオーバーレイ

OBS用のコントローラー入力表示を作成。パッドの図かアーケードパネルを、自分のコントローラーでライブプレビューできます。

スタイル
背景
押したときの色
プレビュー — コントローラーを押してくださいコントローラー未検出
オーバーレイを開く

ブラウザソースのサイズ: 600 × 400

  1. ブラウザソースを追加。 OBSで「ソース」の下の+を押し、「ブラウザ」を選んで名前を付けます。
  2. URLとサイズを貼り付け。 上の幅と高さを使います。ソースはあとから拡大縮小できます。
  3. 読み取りを止めない。 「表示されていないときにソースをシャットダウン」のチェックを外すと、シーンを切り替えてもコントローラーを読み続けます。
  4. ボタンを一度押す。 ブラウザは一度使われたコントローラーしかページに渡しません。OBSを起動したら何かボタンを押すと、オーバーレイが動き出します。

テスト前のクイック回答

OBSにコントローラーオーバーレイを追加するには?

ここでスタイルを選んでURLをコピーし、OBSでブラウザソースを追加してURLと表示されたサイズを貼り付けます。「表示されていないときにソースをシャットダウン」のチェックを外し、ボタンを一度押してください。

オーバーレイが動かないのはなぜ?

ブラウザは一度使われたコントローラーしかページに渡しません。OBSを開いた状態でコントローラーのボタンを押し、ソースが非表示時にシャットダウンされない設定か確認してください。

格闘ゲーム用の入力表示は?

アーケードスタイルを選んで入力履歴をオンにすると、トレーニングモードのように、すべての入力がテンキー表記と押していたフレーム数で表示されます。

この結果が実際に測定するもの

オーバーレイは、どのブラウザでもできる方法(OBSのブラウザソースも対応するGamepad API)でコントローラーを読み、毎フレーム描画するページです。押したボタンが光り、スティックが動き、トリガーが満ちます。アーケードスタイルはボールトップのレバーと8ボタンのパネルを描き、その下に入力をテンキー表記と押していたフレーム数で並べられるので、視聴者はコンボの裏にある入力を見られます。設定はすべてURLに入るため、アカウント不要で何も保存しません。

測定の範囲: オーバーレイが読めるのは、配信PCでOBSから見えるコントローラーだけです。ゲーム機や別のPCにつないだコントローラーは見えません。ブラウザのフレームレートで読み取るため、1フレームより短い入力は取りこぼすことがあります。背面パドルや追加ボタンは、割り当てられた標準ボタンとしてのみ表示されます。

結果の読み方

透過背景

標準設定:ゲーム画面の上にコントローラーだけを描きます。後ろにパネルを置くならダークカード、色を抜く環境ならグリーンバックを選んでください。

入力履歴

アーケードスタイルでは、新しい入力から順に方向とボタン、押していたフレーム数を表示します。236のあとにLPなら、波動拳コマンドから弱パンチです。

サイズ

ブラウザソースに設定する幅と高さです。オーバーレイはOBSが与える枠に合わせて拡大縮小するので、あとから自由にサイズを変えられます。

予期しない結果の確認

オーバーレイが真っ白、または反応しない

OBSを起動したあとにコントローラーのボタンを押してください。「表示されていないときにソースをシャットダウン」のチェックを外し、ソースのプロパティで「現在のページのキャッシュを更新」も試してください。

別のコントローラーが表示される

オーバーレイは最後に使われたコントローラーを追います。プレイするコントローラーのボタンを押し、2台が同時に有効なら他方を外してください。

アーケードのレバーが動かない

スティックを十字キーモード(DP)にしてください。左スティックモードも読み取れますが、右スティックモードは読めません。

後ろに黒い箱が出る

透過背景を選び、ブラウザソースのカスタムCSSで背景が指定されていないか確認してください。

よくある質問

このコントローラーオーバーレイは無料?

はい。OBSが普通のウェブサイトとして読み込むページです。アカウントもダウンロードも不要で、何も保存しません。設定はURLの中にあります。

OBSでPS5のコントローラーは使える?

はい。Windowsが認識していれば有線でもBluetoothでも使えます。記号を合わせるならPlayStationスタイル、他のスタイルも自由に選べます。

レバーレスやアケコンの入力表示はできる?

はい。アーケードスタイルはレバーと8ボタンを描き、入力履歴がすべての入力をテンキー表記と押していたフレーム数で並べます。レバーレスは方向ボタンからレバーの図を動かします。

視聴者にスティックの動きは見える?

はい。パッドのスタイルでは、操作に合わせて左右のスティックが枠の中で動き、トリガーも押し込みに応じて満ちていきます。