OBSのブラウザソースで動作する音声ビジュアライザーです。 『無料版』は、音声接続不要で手軽に使えるシンプルなビジュアライザー。 『有料版』は、OBSの音声にリアルタイムで反応する高機能版です。 配信画面の下部や背景演出として、 音に合わせた動きや、雰囲気づくりにお使いいただけます。 ■ 無料版 / 有料版について 【無料版】 音声接続不要。 ファイルをOBSに追加するだけで動く、シンプルなビジュアライザーです。 【有料版】 OBSの音声にリアルタイムで反応する音声対応版です。 円形モード・入力ソース選択・カスタムプリセット保存など、 より細かい演出ができます。 ■ 同梱ファイル 【無料版】 visualizer_free.html ビジュアライザー本体 【有料版】 index.html ビジュアライザー本体 ■ 動作環境 OS ：Windows 10 / 11 macOS（動作するはずですが動作確認はWindowsのみ） OBS ：OBS Studio 32以降 ■ 無料版のセットアップ 【Step 1】 OBSのソースパネルで + → ブラウザ を追加する 【Step 2】 以下を設定してください。 ローカルファイル ：チェックを入れる ファイル ：visualizer_free.html を選択 幅 ：1920（配信解像度に合わせる） 高さ ：576以上 FPS ：60 透明な背景 ：チェックを入れる 【Step 3】 設定後は、Alt + ドラッグで端をトリミングして配置してください。 ■ 有料版のセットアップ 【Step 1】 OBSのWebSocketを有効にする（初回のみ） OBS → ツール → obs-websocket 設定 「WebSocketサーバーを有効にする」にチェック 「認証を有効にする」はオフのまま OKを押して閉じる 【Step 2】 OBSのソースパネルで + → ブラウザ を追加する 以下を設定してください。 ローカルファイル ：チェックを入れる ファイル ：index.html を選択 幅 ：1920（配信解像度に合わせる） 高さ ：576以上 FPS ：60 透明な背景 ：チェックを入れる 【Step 3】 設定後は、Alt + ドラッグで端をトリミングして配置してください。 ■ 設定パネル ブラウザソースを右クリック → 対話（操作） を開き、 画面右下の歯車ボタンから各種調整ができます。 ■ 無料版で調整できる項目 ・色 ベース色 / 中間色 / アクセント色を #RRGGBB 形式で設定できます。 ・プリセット Default / Light / Natural / Cute / Neon / Dark ・バー 太さ / 本数 / 高さ上限 / 角の丸み ・アニメーション 速さ / 不透明度 ■ 有料版でできること ・OBSの音声にリアルタイムで反応 ・入力ソースの選択（マイク・BGM・全体ミックスなど） ・円形モード ・各種デザイン調整（太さ・本数・高さ上限・角の丸み・グロー） ・アニメーション調整（感度・立ち上がり・減衰・不透明度） ・カスタムプリセット保存（名前付きで現在の設定を保存） ・より細かいビジュアライザー演出 ■ ご利用について 配信での使用は、商用・非商用問わず自由です。 再配布・改変・転売はご遠慮ください。 ■ 免責事項 本アプリの使用によって生じたトラブルや損害については、責任を負いかねます。 OBS Studioのアップデート等により、動作しなくなる場合があります。 ■ サポートについて 不具合やご要望がありましたら、お知らせください。 可能な範囲で確認しますが、対応をお約束するものではありません。