ライブプレビュー

変更はすぐ反映されます。OBSで使う前に保存してください。

配信ガイド

OBS配信用の透明ルーレットオーバーレイ

編集画面を配信に映さず、OBS上で名前ルーレットを表示・操作できます。SpinWheelifyは、ルーレットだけを表示する公開URLと、編集用の非公開リンクを分けて発行します。ブラウザソースにはナビゲーション、広告、不要なアカウント機能が読み込まれません。

ルーレットをOBSに追加する

最初にルーレットを作り、次にオーバーレイを公開し、最後にOBSを設定します。非公開の編集操作が配信に入らない手順です。

  1. 1

    ルーレットを準備

    名前を追加し、色と当選結果の表示方法を設定します。作業中はスタジオのプレビューがすぐ更新されます。

  2. 2

    OBSリンクを作成

    「OBSリンクを作成」を押し、公開OBS URLをコピーします。ブラウザソースにはこのURLだけを使用します。

  3. 3

    ブラウザソースを追加

    OBSでシーンを開き、「ソース」の+を押して「ブラウザ」を選びます。

  4. 4

    URLとサイズを設定

    公開URLを貼り付け、配信レイアウトでルーレットに割り当てる幅と高さを入力します。

  5. 5

    操作して回す

    ブラウザソースを右クリックして「対話」を選び、ルーレットをクリックするかCtrl/Cmd+Enterを押します。

ブラウザソースの推奨設定

OBSのブラウザソースは初期状態で800 × 600、30 FPSです。SpinWheelifyは指定した表示領域に合わせて変化するため、必須の解像度はありません。

設定推奨理由
URL公開OBS URL非公開編集リンクはOBSに貼り付けないでください。
幅と高さルーレット単体なら800 × 800正方形のソースは配置とサイズ変更がしやすくなります。
フレームレートまず30 FPS配信用PCに余裕がある場合のみカスタム60 FPSを有効にします。
カスタムCSS追加CSSは不要オーバーレイは透明・余白なしで、OBS標準の透明CSSにも対応しています。
OBSで音声を制御ミキサー管理時はオンルーレット音声がOBSの音声ミキサーに入り、モニター、ミュート、音量調整ができます。
非表示時にソースをシャットダウン状態維持のためオフオンにすると非表示時にページが破棄され、一時的な状態がリセットされる場合があります。
シーンがアクティブになったとき更新必要な場合のみオンシーンに戻るたび意図的に再読み込みしたい場合だけ有効にします。

各項目の詳しい説明は OBS公式ブラウザソース資料をご覧ください。

配信中にルーレットを操作

OBSのメインプレビューはソースの選択と変形用です。回すにはブラウザソースの「対話」を開き、クリックするか、WindowsではCtrl+Enter、macOSではCmd+Enterを押します。結果表示、音、紙吹雪、自動削除は保存済み設定に従います。

きれいに配置・サイズ調整

ルーレットは正方形を保ち、横方向の中央に配置され、表示領域の短い辺に合わせて拡縮します。上部の余白でポインターの切れを防ぎます。OBSの「変換」でサイズ、中央揃え、切り抜きを調整してください。

OBSでソースを配置する方法

よくある問題の解決方法

多くの原因は古いキャッシュ、間違ったリンク、またはソースサイズです。

OBSにルーレットが表示されない

公開URL、ソースの表示状態、幅と高さが0より大きいことを確認し、プロパティで「現在のページのキャッシュを更新」を実行します。

ルーレットが切れる・位置がずれる

ブラウザソースのサイズを設定し直し、「変換」でフィットまたは中央揃えします。

保存した変更が表示されない

保存完了を確認してからブラウザソースを更新し、最新版を読み込みます。

プレビューをクリックしても回らない

通常のOBSキャンバスは操作用ブラウザではありません。ソースを右クリックし「対話」ウィンドウを使います。

動きが重い・負荷が高い

30 FPSと適切なソースサイズから始めます。60 FPSは滑らかですが、より多くの性能を必要とします。

ルーレットを配信に出す準備はできましたか?

上のスタジオを使うか、メインのルーレットに戻ってすべての編集機能を利用できます。