今月からYouTube配信の頻度を上げたいと思い、LIVE2Dモデルを作ったり、配信用のオーバーレイを作ったりと色々準備していました。
配信で使う素材、主に背景やタイトルなど表示用のオーバーレイを自作しましたが、思ったより完成度も低いので何かいい方法無いのかなと模索して最適案を見つけたのでみなさんに共有したいと思います。
失敗作？Canvaで自作したが・・・
最初はCanvaでオーバーレイを自作していました。
下記みたいな感じでパーツ毎に分けて背景透過させます。
Canvaで背景を透過するには有料プランに入る必要がありますが、Freeソフトを使えば透過自体は安易に行えるのでデザインだけでも十分です。
ただし、欠点があり、文字を入力するのにCanva→画像出力→OBSで画像選択と面倒くさい工程を踏む必要があります。
タイトルなどを入れる際に都度出力をするのがとても面倒なのと、リアルタイムで変更できないという欠点を抱えていました。
また画像データがぼやけて見える気がしていてイケてない感がありました。
もっといい方法が無いか模索してみました。
オーバーレイを自作した理由
世の中には便利な配信ツールがたくさんありますが、使うたびに「アカウント作成」を求められたり、重いアプリを「インストール」しなければならなかったり、使い始めるまでのハードルが高いものが多いですよね。
特に外出先のPC環境だと、ログイン情報を残すリスクやインストールの手間は避けたいところ。
そこで、「登録不要・インストール不要・URLをOBSに貼るだけ」で1秒で使える、究極に身軽なオーバーレイを自作することにしました。
ブラウザ基準なら変更が簡単
今回の一番の目的はスマートに文字を変更出来る、フォントが綺麗に表示出来るようにしたい。
実は入力を自由にする方法があるんですよね。
OBSではブラウザ機能があり、URLを入力すればそのページを操作することが可能です。
「ソース」から「ブラウザ」を追加後に対象のページを追加して、追加後に「対話（操作）を押下するとブラウザの操作が可能になります。
欠点はOBSの対話画面だと日本語入力がうまく出来ないです。
こちらの問題は予めテキストエディタ等に文字を準備しておいてコピペすれば問題無いでしょう。
自作ツールの紹介
実際につくったものがこちら。
入力する項目は自由に移動出来るようにしたり、可変するように工夫してみました。
また設定のエクスポート、インポート機能もあるので簡単に反映出来ます。
URL一つで配信画面が簡単に作れてします。滅茶苦茶便利ですね。
作ってみた感想は難しいデザインを作るとCSSの知識が前提になるのと、細かいデザインが難しいので画像編集ソフトよりは自由度が低いって感じです。
現在無料公開しているので是非試しに使ってみてください！
BOOTHでも公開しました。
今後先行でテーマを販売するかもしれないです。お楽しみに！
ゲームセンターやネカフェ等の配信で使うのにかなり最適では？
今回制作したツールは、簡単に設定値をリセットしたり、ローカルに保存したカスタム設定から一瞬で復元できる仕様になっています。
そのため、ネットカフェやゲームセンターといった「不特定多数が使う公共のPC（配信環境）」で利用する際、個人情報や前回の設定が残るリスクを最小限に抑えられるのが大きな強みです。
配信を始める際も、OBSにURLを一つ登録するだけで瞬時にセットアップが完了します。
(※もちろん、店舗ごとの配信ルールをしっかり確認した上で利用し、配信が終わったら追加したソースを削除して元に戻すのを忘れないようにしましょう！)
URL貼るだけオーバーレイで、もっと身軽に配信を楽しもう！
今回は、Canvaでの配信画面作りに限界を感じた結果、OBSのブラウザソースを活用した「登録不要・インストール不要」の自作オーバーレイにたどり着いたお話を紹介しました。
自宅での配信はもちろん、「ゲームセンターやネットカフェから配信してみたいけれど、設定が面倒だしセキュリティも不安……」という方にこそ、このURL一発でセットアップできる身軽さをぜひ体験してみてほしいです。
ツールはLIVE配信向け オーバーレイのページで無料公開していますので、まずは気軽にOBSにURLを貼り付けて、ポチポチとお好みのレイアウトを試してみてくださいね！
もし「こんな機能があったら便利かも」「このデザイン好き！」などあれば、ぜひXなどでシェアして教えていただけると開発の励みになります！
好評ならデザインを都度増やしたり販売も考えています、
それでは、最高の配信ライフを！
コメント