お問い合わせ

POST 投稿

TOP>投稿>【オーバーレイ編】OBSでオーバーレイを表示させる方法と小技【鮭 おかゆ】

コラム

【オーバーレイ編】OBSでオーバーレイを表示させる方法と小技【鮭 おかゆ】


B-DASHでは10月21日(金)に第1回B-DASH大会を開催いたしました。

当Media初の大会であり、配信も初めてのことで多くの困難や、失敗がありましたので大会当日の準備や操作を担当しましたVキャスター鮭 おかゆからレポートをお送りいたします。

 

 


 

 

B-DASH杯の当日の様子はこちら↓

 

 

・大会放送までに行ったこと

 

初めまして、B-DASH杯で当日のlive配信やゲーム操作をし司会進行も務めました鮭 おかゆです。

今回大会開催までの準備はほぼ一人で行ったのですが大変だったことや、やったことなどをお伝えできればと思います。

今後大会を開こうとしている人の参考になれば良いなと思いますので、宜しくお願い致します。

 

まずは最初、配信することは確定事項だったので配信の設定をする為にOBSの設定をしました!

 

 

■配信用ソフトOBS
https://obsproject.com/ja/download

 

 

OBSをDLしてから大会当日の流れなどを考えながらシーンの作成をしましたが次はOBSで使用するオーバーレイの作成に取り掛かりました

 

 

__オーバーレイとは?配信画面に重ねる画像の事

 

オーバーレイというのは、ゲーム画面以外の余っている余白を飾ることで配信画面にオリジナリティを出したりする事が出来る、画面を囲っている画像のことを言います!

 

ゲーム配信画面(オーバーレイ有り)

”OBSシーンオーバーレイ表示あり”

 

ゲーム配信画面(オーバーレイ無し)

”OBSシーンオーバーレイ表示無し”src="https://b-dash-media.com/wp-content/uploads/2022/11/2e2fb1dea3a1e807deeb3fe5d2bc7777-400x190.png"

 

上記二つの画像。オーバーレイを用意してあるのとないのとでは大分印象が変わりますよね!

 

 

__オーバーレイの作成方法、静止画か動画で作成

 

オーバーレイがあるのと無いのとでは配信画面の華やかさが段違いなので、早速作成に取り掛かりました

 

オーバーレイは基本配信画面のゲームに合わせて周りを囲うように作成し、ゲーム画面の上に配置する画像タイプが主なのですが私が今回作成したものは、枠にも動きを出したかったので5秒程度の簡単な動画で作成をすることにしました。

 

実際作成された動画

 

 

この動画の上にゲームの画面を配置することで次の動画のようになります

 

 

 

私はポップで可愛い感じにしてゲーム名と私と相方の名前が表示されるように作成しました、皆さんお好みの動くオーバーレイを是非作成してみてください!

__オーバーレイの作成方法はこちら↓

【動く背景】動くオーバーレイを作成して配信画面を飾ろう!【鮭 おかゆ】

 

さて、オーバーレイがあるのと無いのとでの配信画面の見え方についてお話ししましたが、幾つか注意点がありますのでそちらをお伝えしていこうかと思います!

 

 

__動くオーバーレイをOBSに表示させる方法

 

”OBSシーンオーバーレイ表示方法メディアソース”/

 

作成したオーバーレイはOBSのソースの欄で追加させることが出来ます。ソース欄の+マークを選択したら出てきたウィンドウにあるメディアソースから追加する事が出来ます!静止画の場合は画像を選択してください

 

 

__動くオーバーレイの注意点、リピート再生は忘れずに!

 

まず、動くオーバーレイは最長1分ほどの動画(MP4)で作成します。なので動画内に文字を表示させてしまうと、OBS内で文字の変更が出来ないので注意が必要です

 

もし、文字を変更したい場合は事前に何パターンか動画を作成しておくか、動画内に文字を記載せずにOBSのテキストで表記するか、画像タイプのオーバーレイを重ねて使用するというのが良いかもしれません

 

次に注意する点ですが、OBS内で動くオーバーレイを使用する時は忘れずにループ再生を選択しておく必要があります

 

”OBSオーバーレイ表示プロパティ”

 

画像内【ループ(繰り返し)】から【非アクティブ時にファイルを閉じる】の項目まで全てチェックを付けても大丈夫です。必要に応じて不要な項目は外しておきましょう!
参考程度に私が外している設定の【可能な場合ハードウェアデコードを使用】は画面がカクつく場合は外してください。更に【アクティブでないときにファイルを閉じる】は表示遅延が気になる場合は外しておきましょう!
以上でOBSで動くオーバーレイを使用する為の設定は終わりです!次はちょっとした小ネタをお教えします

 

__動くオーバーレイのカラー変更はフィルタをかけることで簡単に可能!

 

作成したオーバーレイ用の動画のカラーを変更する小ネタをご紹介いたします!

 

 

OBSの画面でソースの所にある対象のオーバーレイを選択して右クリックをします

 

”OBSのメディアソースカラー変更する為のフィルタ”

 

上記画面のようになったら、フィルタを選択してフィルタの設定画面を出します

 

”OBSでフィルタを掛けて色補正”

 

設定画面の左下にある+をクリックし色補正を選択します。すると名前を指定してくださいと出ますが自分に分かりやすい名前でいいと思います

 

”OBSで色補正操作するバーの表示”

 

名前を決めて作成するとこのような画面が出てきます!これを色を見ながらいっぱいあるバーを適当にいじると……

 

”OBSで色補正操作するバーを弄った後”

 

このように色を変えることが出来ます!たまには気分を変えて違う色にしたいなと思ったら是非使用してみてください!

 

 

 

 

■オーバーレイを自作できなくても依頼することも可能!

 

オーバーレイがあるのと無いのとでは、見え方が結構変わりますね。

鮭 おかゆさんはご自身でオーバーレイを作成しましたがご自身で作るのが難しい方もいらっしゃると思いますので、幾つかオーバーレイを入手、依頼できるサイトを紹介しておきます。

 

・『Booth』

 

https://booth.pm/ja/search/%E9%85%8D%E4%BF%A1%E3%80%80%E3%82%AA%E3%83%BC%E3%83%90%E3%83%BC%E3%83%AC%E3%82%A4?max_price=0

 

pixivが運営するコンテンツマーケットBoothでは無料のものから有料のものまでさまざまなクリエイターが作成したオーバーレイが入手できます。
オーバーレイ使用してみたいと思ったらまずはここで探してみるのが良いでしょう。

 

・『Canva』

 

https://www.canva.com/ja_jp/templates/?query=%E3%82%AA%E3%83%BC%E3%83%90%E3%83%BC%E3%83%AC%E3%82%A4&fCategory=tAEeOcewkdg

 

Canvaではテンプレートが数多く用意されているデザインツールです。

基本無料で使用できますが、有料プランを使用すると専用のテンプレートや素材を使用して、オリジナルのオーバーレイを作ることが出来ます。
操作感も素材は位置や位置の調整をしたりと簡単な操作で作成可能です。

1から作成するのは無理でも、既存のデザインを掛け合わせてオリジナルのオーバーレイを作成したい人は試してみるのも良いかと思います。

 

・『イラストAC』

 

https://www.ac-illust.com/main/search_result.php?search_word=%E9%85%8D%E4%BF%A1+%E3%82%AA%E3%83%BC%E3%83%90%E3%83%BC%E3%83%AC%E3%82%A4&sl=ja&qt=&qid=&creator=&ngcreator=&nq=&srt=dlrank&orientation=all&format=all&color=all

 

イラストACはフリーイラストのサイトです。
シンプルなオーバーレイが多いですが、その分画面がごちゃごちゃしたりしないので使用しやすいものが多いです。
他にもイラスト全般ダウンロードできるので自作する用の素材が欲しいという方も使えるサイトです。

 

・『Behance』

 

https://www.behance.net/search/projects?search=vtuber%20overlay%20free&tracking_source=typeahead_nav_direct&sort=appreciations

 

Adobeが運営するクリエイター向けのSNS『Behance』は基本的にはクリエイターの作品を閲覧することですが、中にはフリー素材のDLリンクも張っている方もいらっしゃいます。

海外のクリエイターが作成したオーバーレイを使用してみたい方はこちらで探してみるのも良いかと思います。

 

・『ココナラ』

 

https://coconala.com/search?keyword=%E3%82%AA%E3%83%BC%E3%83%90%E3%83%BC%E3%83%AC%E3%82%A4

 

ココナラでは有料でオリジナルのオーバーレイを作成してくれるクリエイターさんが沢山いらっしゃいます。

数千円から数万円のものまでありますので、既存のものよりこだわったオリジナルのオーバーレイが欲しい方はこちらをチェックしてみてください。

 

・『SKIMA』

 

https://skima.jp/item/search?cc_id=&w=%E3%82%AA%E3%83%BC%E3%83%90%E3%83%BC%E3%83%AC%E3%82%A4

 

SKIMAはイラスト専門のスキルマーケットです。

オリジナルのオーバーレイを依頼するのに適したサイトで、クリエイターごとに価格が設定されており価格帯は数千円から2万円程のものがあります。