配信オーバーレイの作り方！無料/かっこいい/かわいいオーバーレイを配信画面に
配信オーバーレイは、配信画面にオリジナリティを加えられる手段として、人気Vtuberやゲーム実況者なども使用しているデザインの一つです。
無料でかっこいいorかわいいオーバーレイを作成してみましょう。
目次
配信オーバーレイとは
配信オーバーレイは、配信画面に表示する枠やフレームのことを指す名称です。
配信オーバーレイの独自性のあるデザインからは、配信画面で誰の配信なのかがわかるようになり、認知度へも影響があります。
本記事では、無料でできる配信オーバーレイの作り方を解説するので、ぜひ参考にしてみてください。
かっこいいorかわいい配信オーバーレイを作成して、人気配信者への第一歩を踏み出しましょう。
配信オーバーレイを利用するメリット
配信オーバーレイを表示させるメリットは、次のとおりです。
- 配信画面が彩られ、画面映えする
- 配信画面が整えられ、美化できる
- 他の配信者との差別化を図れる
配信オーバーレイは自分でカスタマイズするものであり、デザインは自由です。
そのため、どのような配信オーバーレイを作成するのかによって、得られるメリットも異なります。
配信オーバーレイの有無により、どのように配信画面が変化するのかを確認しましょう。
配信オーバーレイがない状態の配信画面は、テキストが読みにくいことに加え、パッとしない画面です。
配信オーバーレイを表示させると、次のような配信画面になります。
配信オーバーレイを表示させることで、コメント欄の枠組みやテロップ背景、SNSアカウントの宣伝が表示できます。
また、色やデザインによりかわいい配信画面にしたり、かっこいい配信画面にしたりできるため、オリジナリティのある配信画面が作成可能です。
画面映えする配信作りやほかの配信者との差別化を図りたい方は、ぜひ配信オーバーレイを作成してみましょう。
OBSでの設定手順
まずは配信オーバーレイを表示させる設定手順から解説します。
表示手順は、基本的にYouTubeもTwitchも同じです。
画像の準備とサイズ調整
配信オーバーレイは画像として表示させることが一般的です。
STEP1：画像の準備
配信オーバーレイの元となる画像を準備しましょう。
画像の準備は、次の方法から選んでみてください。
- 自作する方法
- サイトから見つけてくる方法
- プロに依頼する方法
それぞれの詳細は後述いたします。
パソコンやデザインに知見がある方は、自作の配信オーバーレイに挑戦してみてください。
自作が難しい方は、サイトから見つけるかプロに依頼して配信オーバーレイを入手しましょう。
STEP2：画像の編集
プロに依頼する場合を除き、自作またはサイトから配信オーバーレイを見つけてきた方は、サイズの調整やデザインの工夫が必要です。
OBSでの設定方法と位置調整
OBSで配信オーバーレイを設定する手順は、次のとおりです。
STEP1：画像ソースの追加
OBSで配信オーバーレイを表示させる方法は、ソース内「+」ボタンから「画像」を追加してください。
参照ボタンから画像が保存されているフォルダを選択して追加してください。
追加すると、画像作成の際に設定したサイズで表示されます。
使用中のパソコンや配信する際の比率で画像サイズが異なるため、合わせて作成しましょう。
今回は、1,920(px)×1,080(px) にて作成しています。
続いて、位置調整を確認しましょう。
STEP2：配信オーバーレイの位置調整
配信オーバーレイを画像ソースで追加したあとは、位置調整をおこないましょう。
さまざまな種類がある配信オーバーレイですが、外枠の場合は作成時点で配信画面に合わせて作成すると、位置調整が不要です。
今回は、配信オーバーレイに配信コンテンツのサイズを合わせて調整します。
最後に、ほかのコンテンツを追加していけばオリジナリティのある配信画面の完成です。
動く配信オーバーレイの作り方
配信者を見ていると、配信オーバーレイが動いている方もいるでしょう。
オーバーレイを光が走っていたりキラキラと輝いているように見えたり、さまざまな動く配信オーバーレイがあります。
次のような動く配信オーバーレイの作り方や、コメント欄の枠の作成方法を確認して、一層盛り上がる配信画面を作成しましょう。
- 動く外枠オーバーレイの自作方法
- 動くコメント欄の枠の簡単な設定方法
動く外枠オーバーレイの自作方法
動く外枠オーバーレイは、Adobe After EffectsやGIMP2での作成がおすすめです。
Adobe After Effectsでは、Adobe Photoshopで作成した画像に動きを加えることができます。
しかし、Adobe Photoshopと同様に有料ソフトであるため、本格的に作成したい方向けです。
対して、GIMP2は無料で作成できるソフトであり、初めての方にもおすすめができます。
GIMP2で動く外枠オーバーレイの作成方法はOBSで配信映えする動く枠を作成する方法！イメージマスクの作成方法も解説！を参考にしてみてください。
動くコメント欄の枠の簡単な設定方法
動くコメント欄の枠を作成したい方は、簡単に設定できるCastCraftがおすすめです。
手順1.CastCraftのインストールとログイン
まずは、CastCraftをインストールしてください。
手順2.OBSのブラウザソースにchatboxオーバーレイのURLを貼り付け
CastCraftでカスタマイズしたchatboxのURLを、OBSのブラウザソースに貼り付けます。
詳細は下記をご確認ください。
手順3.CastCraftを配信に接続
YouTubeやTwitchを配信した後、CastCraft内の「配信に接続」ボタンを押せばOBSにコメントが映し出されます。
コメントに反応する演出作りなど
視聴者のコメントに反応するような画面演出を作りたい場合、Screen機能をお試しください。
Vtuberの配信画面におすすめな配信オーバーレイ
配信オーバーレイは配信者のタイプにより大きく異なり、Vtuberはとくに注力すべき要素です。
Booth様から出典させていただき、ここではVtuberにおすすめな配信オーバーレイを種類別に紹介します。
かわいい配信オーバーレイ
かわいい系統のVtuberであれば、配信オーバーレイもかわいいものを選びましょう。
かわいいと感じるものに個人差はあるものの、花やイラストのタッチなど一般的にかわいいと感じられるものがおすすめです。
色合いでは濃い色よりもパステルカラーのほうが無難といえるでしょう。
自分のイメージや、Vtuberとしてどのような立場を確立するのかによって大きく異なるため、入念に検討してみてください。
かわいい配信オーバーレイとして、次のようなものを参考にしてみましょう。
パステルカラーではないものの、落ち着いた雰囲気のあるポップな印象を与えられる配信オーバーレイでは、次のようなものがおすすめです。
さまざまな配信オーバーレイのデザインから、自分の好みのものを見つけてみてください。
おしゃれでシンプルな配信オーバーレイ
Vtuberの配信には雑談や歌枠、ゲームなどさまざまな種類があります。
配信の種類により配信オーバーレイが目立ち過ぎないほうが良い場合もあるので、シンプルでおしゃれな配信オーバーレイも用意しましょう。
たとえばパステルカラーを使用してポップな感じを残しつつ、強調し過ぎないデザインがおすすめです。
シンプルかつかっこいい黒系統のデザインが好みの方は、次のような配信オーバーレイを選んでみてください。
クリエイターによっては、「宇宙」のようなテーマを設けて作成している配信オーバーレイも多くあります。
また、シンプルさを重視した配信オーバーレイはゲーム実況やアバターを強調させたいときにおすすめです。
それぞれの特長を意識して、配信の種類ごとに配信オーバーレイを変更しましょう。
配信オーバーレイを変えることで、視聴者を飽きさせないことにもつながります。
Vtuberの配信画面と相性が良い素材
Vtuberの配信は、雑談配信やゲーム配信、歌枠配信など多岐に渡ります。配信の種類によっては、それに特化した素材が必要になる場面もあるでしょう。
ここでは、Vtuberの配信画面に使用するとリスナーが喜んでくれる配信素材を紹介します。
時計（雑談配信向け）
長時間の雑談配信や朝活配信では、視聴者がひと目で時刻を確認できる時計の素材が重宝されます。
OBSのウィンドキャプチャで表示するものから、時計ウィジェットのURLをブラウザソースに読み込ませて表示するものまで、時計素材には多くの種類があるので、自分の配信画面と相性が良い時計素材を探してみましょう。
おすすめの時計素材やツールは、以下の通りです。
セットリスト（歌枠配信向け）
歌枠配信では、途中から来た視聴者でも状況がわかるよう、曲目や曲順を記したセットリストを表示するのが定番です。
こちらも、OBSのカスタムブラウザドックを使用して動かせるツールがあるので、頻繁に歌枠配信をおこなう方は、ぜひ導入してみましょう。
おすすめのセットリスト作成ツールは、以下の通りです。
配信オーバーレイを入手できるサイト
配信オーバーレイは外枠やコメント欄など多岐に渡り、それぞれデザイン性が重要視されています。
さまざまなサイトでフリー素材が配布されているほか、購入できるサイトもあるので、ぜひ参考にしてみてください。
ここからは、配信オーバーレイの素材を入手する方法や注意点を解説します。
- フリー素材の無料配布サイト
- 有料素材の販売サイト
- 配布された配信オーバーレイを利用する注意点
無料素材の配布サイト
無料素材の配布サイトは数多く存在しますが、中でもおすすめのサイトを紹介します。
OKUMONOは、配信オーバーレイに役立つ背景画像や外枠などが多く配布されているフリー素材配布サイトです。
画像編集ソフトを利用して、配信に役立ててみましょう。
Adobe Stockには、Vtuber向けの配信オーバーレイが豊富に用意されています。
一部有料ですがコメント欄やテロップ枠など、 配信オーバーレイがすべて揃ったものをダウンロード可能です。
イラストACは、配信オーバーレイをはじめとしたイラストがダウンロードできるフリー素材配布サイトです。
商用利用可能なものが多く、さまざまなものに利用できるイラストがダウンロードできます。
シンプルな配信オーバーレイを探している方は、ニコニコモンズがおすすめです。
レトロな雰囲気のフレームや、王道RPGゲームを連想させるフレームなどが選択でき、ゲーム配信にも適しています。
Freepikは、ネオン系や近未来的なデザインの配信オーバーレイを探している方におすすめです。
英語表記ですが、「stream overlay」や「download」などの簡単な英語がわかれば問題なく利用できます。
スコラボは、これまでのフリー素材をダウンロードするサイトではなく、スコラボ上で設定した配信オーバーレイを配信に接続できる配信者向けのサイトです。
ブラウザ画面を配信画面に接続するのみでさまざまなデザインが利用できます。
Alive Studioは、OBSのカスタムブラウザドック機能を利用して、OBSの内部で直接素材やコメント欄を制御できる、背景画面構築サービスです。
有料素材の販売サイト
フリー素材よりもクオリティを重視したい方は、有料素材を購入してみましょう。
費用がかかることをデメリットと捉える方もいますが、有料素材ならではの品質の高さはフリー素材にはないデザインを配信に取り入れられます。
Booth
Boothは、国内Vtuberの文化を理解したクリエイターが作成した配信オーバーレイを購入できます。
Nerd or Die
Nerd or Dieは、プロクオリティの配信用素材のパックを一式購入できるため、統一感を出したい方におすすめです。
Etsy
無料配布はありませんが、Etsyならクオリティの高い配信オーバーレイが購入できます。
Streamlabs
Streamlabsは、配信に特化した多彩なサービスを提供しており、配信オーバーレイも購入できます。
配布された配信オーバーレイを利用する注意点
配布された配信オーバーレイを利用する際は、ライセンス規約や利用範囲に注意が必要です。
配信での利用は可能ですが、商用目的では利用不可である場合や第三者への提供の禁止など、作品ごとに規約が設けられています。
また、編集して利用してはならないものもあるので、利用前に必ず確認しましょう。
プロに依頼する方法
自作が難しい方でもオリジナルの配信オーバーレイを使用したい方は、プロに作成を依頼してみてください。
ここでは、プロに依頼する方法について次のように解説します。
- 依頼先の選び方と依頼プロセスの概要
- 配信オーバーレイを作れるプロを探せるサイト
依頼先の選び方やプロを探せるサイトを確認し、納得できるプロのクリエイターを見つけましょう。
依頼先の選び方と依頼プロセスの概要
配信オーバーレイの作成をプロに依頼する際は、依頼先に掲載されているサンプルを見て判断しましょう。
また、依頼先やサイトによっても納品方法やオプションなどで料金も異なるため、注意が必要です。
実際に依頼する際は、基本的に次のような流れになります。
- サンプル掲載ページでデザインを確認
- 希望デザインや納期の相談
- 依頼確定・支払い
- 進捗確認
- 修正依頼
- 納品
修正は依頼先ごとに回数が決められているほか、在籍するサイトにより規約や支払い方法も異なります。
一から作成を依頼する場合は、自分の希望イメージや参考になる配信オーバーレイの画像を送付してみてください。
配信オーバーレイを作れるプロを探せるサイト
配信オーバーレイを作れるプロを探す際は、次のサイトを参考にしてみましょう。
SKIMA
SKIMAには、Vtuber向けの配信オーバーレイ作成を受け付けているクリエイターが多く登録しています。
アバターの作成も含めて販売しているクリエイターも在籍しているので、Vtuberデビューを検討中の方にもおすすめです。
ココナラ
ココナラにはクリエイターの在籍数が多く、比較的安価な料金で配信オーバーレイの作成を依頼できます。
登録したばかりで実績の少ない方もいるため、依頼先選びが重要です。
多くの選択肢から選びたい方は、ココナラで配信オーバーレイを探してみてください。
Behance
英語ができる方は、Behanceも視野に入れて検討しましょう。
海外ならではのデザインで配信オーバーレイを作成してもらえるほか、ハイクオリティなクリエイターが多く在籍しています。
自作するには
ここからは、配信オーバーレイの準備方法について解説します。
まずは配信オーバーレイの自作とカスタマイズについて、次のように解説するのでぜひ参考にしてみてください。
- 配信画面に必要な素材を準備する
- 画像を透過させる
枠を準備するのみではなく、メインコンテンツが表示されるように透過させる手順も解説するので、確認しましょう。
配信画面に必要な素材を準備する
配信画面に表示させる素材は配信者ごとにさまざまですが、必要なものとして次の2つが挙げられます。
- 枠/フレーム
- SNSアカウント等
難しいデザインやカスタマイズは、視聴者数が増えてきた際や自分がデザインに慣れてきた際に挑戦してみてください。
初めての方は、最低限の配信オーバーレイとして上記2つを作成しましょう。
素材を自作するためには、画像編集ソフトが必須となります。
Canva
Canvaはブラウザ版の画像作成・編集ソフトです。
アカウント登録すればインストール不要で画像を作成できるので、初めて画像編集に挑戦する方におすすめができます。
デザインが思い浮かばない方でも、キーワード検索から配信オーバーレイのテンプレートが閲覧可能です。
テンプレートを基にして作成できるので、ぜひ活用してみてください。
GIMP2
GIMP2はインストールして使用できる画像作成・編集ソフトです。
無料とは思えないほどのカスタマイズ性を備えており、無料画像編集ソフトの中でも人気を集めています。
公式サイトは基本的に英語表記ですが、シェア率が高いことから操作方法を解説している記事もネット上に散見されるため、初心者でも安心して利用可能です。
Adobe Photoshop（有料）
配信画面の作成以外にもサムネイル作りやアイコン作成など、今後の展開を見据える方は有料ソフトを購入してみてください。
画像編集ソフトでは、世界的に多くのクリエイターが使用しているAdobe Photoshopがおすすめです。
本記事で掲載している配信オーバーレイもAdobe Photoshopにて作成しています。
Adobe Photoshopは、無料ソフトよりもさらに細かく美麗で自由な編集が可能です。
画像を透過させる
配信オーバーレイを作成する際は、画像の透過処理をしなければなりません。
透過させなければ配信のメインコンテンツが表示できなくなるので、切り抜きや不透明度の調節をおこないましょう。
Adobe Photoshopでの手順を例として取り上げます。
透過させる部分を切り抜くため、不要な部分を選択します。
今回はAdobe Photoshopを例に挙げています。
しかし、基本的に画像編集ソフトは共通して「レイヤー」が定められているので、選択レイヤーを間違えないようにして切り抜いてください。
ほかにも、不透明度を調節することで透ける背景を作成できます。
自作の配信オーバーレイは、初めての方にとって非常に難関なコンテンツです。
しかし、ほかの配信者とは一味違う配信画面を作成できるメリットがあるので、ぜひ挑戦してみましょう。
配信オーバーレイを使いこなす
配信オーバーレイを使いこなすためのヒントとして、次のことを解説します。
- 配信の種類ごとに配信レイアウトは変わる
- 全体のデザインの調和
- 視聴者との交流を促進する方法
配信オーバーレイを活用して、チャンネル登録者数やフォロワーを増やしましょう。
配信の種類ごとに配信レイアウトは変わる
自分がどのような配信者になるのかによって、配信の種類も異なります。
また、Vtuberの場合は雑談配信やゲーム実況、歌枠など豊富な種類の配信を行い、視聴者を集めることになるでしょう。
そのため、雑談配信には雑談配信のレイアウトが必要となり、歌枠には歌枠のレイアウトが欠かせません。
レイアウトの変更はOBS上でシーンやシーンコレクションを変更すれば、毎回一から配信画面を作成する必要がなくなります。
ゲーム実況用のシーンに切り替えると、ソース内がすべて切り替わるので画面もゲーム実況用のものに変更されます。
シーンを増やさず、シーンコレクションを増やすことでも同様の切り替えが可能です。
ゲーム実況のシーンコレクションから、雑談配信のシーンコレクションに切り替えることで、ソースだけでなくシーンもすべて切り替えられます。
シーンやシーンコレクションを活用して、配信の種類に合わせたレイアウトを準備してみてください。
配信オーバーレイに関するよくある質問
配信オーバーレイは無料で作れますか？
はい。無料のテンプレートや自作素材を使って作れます。まずはシンプルな構成で始めて、必要に応じて装飾を増やす方法が現実的です。
かわいい系とかっこいい系では作り方が違いますか？
基本の手順は同じですが、色やフォント、枠線、アニメーションの方向性が変わります。見た目の方向性を先に決めてから素材を選ぶとまとまりやすいです。
オーバーレイは画像とブラウザソースのどちらで入れればいいですか？
固定デザインなら画像ソース、動きやカスタマイズが必要ならブラウザソースが向いています。用途に合わせて使い分けるのが基本です。
オーバーレイを入れると配信画面が見づらくなるのはなぜですか？
装飾が多すぎたり、ゲーム画面に重要な情報が重なっていたりすると見づらくなります。主役は配信内容なので、余白と視認性を優先して配置することが大切です。
コメント表示や通知もオーバーレイに含められますか？
はい。コメント欄、アラート、目標表示なども配信オーバーレイの一部として組み込めます。必要な要素だけを追加すると、画面が散らかりにくくなります。
関連の人気記事
OBS配信をより面白くするために
配信で視聴者のコミュニティ形成をうまく行うことで、日常の配信をより面白いものにすることができます。
そのような観点で最もおすすめな配信ツールがCastCraftです。
機能のご紹介
配信中のコメント管理ダッシュボード
- 視聴者ごとの情報をためて、視聴者全員を覚えられる
- 初見や常連を一目で判断できる
- スパチャ・ビッツ等を読み上げたかどうか管理できる
画面演出の「Screen」
- 視聴者の特定のコメント・投げ銭に応じたエフェクトを画面に出せる
- コメントを画面に横流しできる
- 設定した画像やGIFで自由に画面演出が作れる
いつでも投げ銭（収益化）機能
- 配信者に9割還元できる
- 投げ銭してくれた視聴者に対して個別のお礼の返信や、特典ファイル（画像や音声など）を送付することも可能
導入実績
CastCraftは上記のような機能により、配信者（ゲーム配信者やVtuber）が視聴者との関係を深めることを手助けします。
導入されたチャンネルの総登録者数は1.6億人を超えており、これまで20万回以上の配信で使われています。
CastCraftを活用すれば、視聴者との関係をより良いものに進化させ、あなたの配信コミュニティをより濃いものにできます。
日々の配信をより楽しくするために、ぜひ導入を検討されてみてください。