コラボ配信のレイアウト調整、毎回やり直してませんか？【OBS対応ツール作りました】

コラボ配信の「あの作業」を自動化したい

VTuberやストリーマーにとって、コラボ配信は視聴者が増える大チャンスです。

でも、準備がめちゃくちゃ大変じゃないですか？

特にレイアウト調整。

OBSを開いて、ソースのサイズを調整して、位置を合わせて、名前を入れて......。2人ならまだいい。3人、4人、5人と増えると、もう配信前にぐったり。

しかも人数が変わるたびに全部やり直し。途中参加・途中退出があったら、配信中にレイアウトを組み直す羽目に。

「テンプレートとかないの？」

探しました。BOOTHには配信素材が5万点以上ありますが、コラボ配信のレイアウトを自動生成できるツールは見つかりませんでした。

「コラボ配信レイアウトジェネレーター」を作りました

ないなら作ろう。ということで、人数を選ぶだけでコラボ配信用レイアウトが完成するツールを作りました。

HTMLファイル1つ。ブラウザで開くだけ。インストール不要。月額課金なし。

主な機能

2〜6人のコラボに対応

人数ボタンを押すだけで、最適なレイアウトが自動生成されます。

透過マスク機能（OBSで超便利）

これが一番のこだわりポイント。

枠の内側が透明になっています。OBSでこのレイアウトを最前面に配置し、映像ソースを下のレイヤーに置くだけで、枠からはみ出さないレイアウトが完成します。

従来のオーバーレイ素材だと、映像のサイズをぴったり合わせないとはみ出してしまいますが、このツールなら枠がマスクとして機能するので、そこに映像を突っ込むだけでOKです。

5種類のデザインテーマ

• Gaming — ダーク×パープルの定番ゲーミングスタイル

• Neon Glow — ピンクネオンの華やかなデザイン

• Pastel — 柔らかい色合いの女性向けデザイン

• Cyber — ブルー×シアンのSFテイスト

• Minimal — シンプルで万能なクリーンスタイル

カラーも自由にカスタマイズ可能。メインカラーとアクセントカラーを変えるだけで、自分だけのオリジナルレイアウトが作れます。

豊富なレイアウトパターン

横並び、グリッド、メイン+サブ（ワイプ）など、人数に応じた複数パターンを用意。

メイン+サブパターンでは、サブ枠の上寄せ・下寄せも選べます。

名前＆SNS ID自動配置

参加者の名前とSNS ID（@username）を入力すると、おしゃれなネームプレートが自動配置されます。視聴者が「この人誰だろう？」と思ったときに、すぐフォローできるのがポイント。

PNG出力 & HTML出力

• PNG: 透過対応の1920x1080画像。OBSの「画像」ソースに直接使えます

• HTML: OBSの「ブラウザソース」にそのまま読み込み可能

使い方（3ステップ）

ステップ1: 設定する

index.htmlをブラウザ（Chrome推奨）で開いて、人数・テーマ・カラー・レイアウトを選択。参加者の名前を入力。

ステップ2: 生成する

「レイアウトを生成」ボタンを押すだけ。プレビューがすぐ表示されます。

ステップ3: OBSに配置する

PNGまたはHTMLで出力し、OBSに追加。映像ソースを下のレイヤーに配置すれば完成。

こんな人におすすめ

• コラボ配信を頻繁にするVTuber・ストリーマー

• 毎回OBSのレイアウト調整に時間を取られている人

• デザインスキルがないけどおしゃれな配信画面にしたい人

• 個人勢でワンオペ配信の準備を少しでも楽にしたい人

• 人数が変わるコラボで素早くレイアウトを切り替えたい人

既存の方法との比較

【比較：既存の方法 vs コラボ配信レイアウトジェネレーター】

■ 人数変更
　本ツール → ボタン1つ
　Booth素材(PNG/PSD) → 買い直し or 手動編集
　OBS手動配置 → 全部やり直し
　スコラボ → 自動（プラットフォーム内のみ）

■ 透過マスク
　本ツール → 対応
　Booth素材 → 素材による
　OBS手動配置 → 非対応
　スコラボ → -

■ 16:9対応
　本ツール → 全枠対応
　Booth素材 → 素材による
　OBS手動配置 → 手動調整
　スコラボ → -

■ カラーカスタマイズ
　本ツール → 自由
　Booth素材 → Photoshop必要
　OBS手動配置 → -
　スコラボ → 限定的

■ OBS対応
　本ツール → PNG/HTML両方
　Booth素材 → PNG
　OBS手動配置 → -
　スコラボ → ブラウザソース

■ 料金
　本ツール → 買い切り200円
　Booth素材 → 1素材ごと
　OBS手動配置 → 無料
　スコラボ → 無料（機能制限あり）

■ オフライン
　本ツール → 対応
　Booth素材 → 対応
　OBS手動配置 → 対応
　スコラボ → 非対応

商品ページ

BOOTHで販売中です。

https://chapihara-mhl.booth.pm/items/8156408

ここから先は有料パートです。開発の裏側を書いています。