配信画面のデザイン方法は?おすすめ素材サイトも紹介

最終更新 2024-01-01
15-テロップ

自分の配信を見返したときに、画面がパッとしないと感じたことがある方も多いのではないでしょうか。
パッとしない配信画面を改善するためには、デザインが必要です。
本記事では、配信画面のデザイン方法を解説するとともに、おすすめの素材サイトを紹介します。
配信者の方やこれから配信をはじめたい方におすすめの内容となっているため、ぜひ最後まで読んでみてください。

目次

配信画面は内容別に構成をデザインしよう

配信画面のデザインは、内容ごとに分けて構成することが大切です。
ゲーム実況を例に挙げると、画面の枠組みとなるオーバーレイやコメント表示欄、チャンネル登録を促すテキストをスクロールさせる場所など、さまざまなものがあります。
また、雑談配信では画面に表示させるものがないため、時計を表示させたりコメント欄をいつもより大きく表示させたりと工夫が必要です。
本記事で解説する内容別に構成をデザインする方法を確認して、ぜひ自分の配信画面に活用してみてください。

配信内容別の配信画面のデザイン

ここでは、配信内容の種類として、次の3つに分けて解説します。

  • 雑談配信の画面デザイン
  • ゲーム配信の画面デザイン
  • 歌配信の画面デザイン

配信内容は個々でさまざまですが、上記3つのデザインテクニックを応用すればどのような配信にも活用できます。

雑談配信の画面デザイン

雑談配信は名前のとおり雑談がメインとなるため、視覚的な要素が多くありません。
サムネイルのまま配信している方も少なくありませんが、デザイン性に富んだ配信のほうが視聴者に楽しんでもらえます。
雑談配信の画面デザインとして、次のものを作成して表示させてみましょう。

  • 雑談用のオーバーレイ
  • 背景画像
  • 配信タイトル
  • 大きめのコメント欄
  • 時計
  • テロップ

それぞれどのようなものなのかを画像付きで解説するので、参考にしてみてください。

雑談用のオーバーレイ

オーバーレイは、画面の外枠です。
オーバーレイがあるとメリハリのある配信画面にできる点や、表示させるコメントに枠を設けられる点など、さまざまなメリットが得られます。
雑談配信におけるオーバーレイは複雑である必要はなく、シンプルで見やすさを重視したデザインがおすすめです。
あくまでメインコンテンツは視聴者と配信者による雑談となるため、視聴者が画面を見ていても苦にならないような色合いを心がけてみてください。

1-雑談配信オーバーレイ

オーバーレイだけでは殺風景ですが、ここに背景やアバターなどさまざまなデザインを施すことでよりよい配信画面となります。

配信オーバーレイの作り方

背景画像

雑談配信の場合は表示させる映像がないため、背景画像を用意しましょう。
背景もオーバーレイと同様に見ていても苦にならない色合いや、穏やかな気持ちになれる絵柄を用意してみてください。
今回は、空と雲をテーマにした雑談配信の背景をデザインしています。

2-背景画像①

オーバーレイと重なると次のようになります。

3-背景画像②

配信画面の素材|配信者向けのおすすめフリー素材サイト5選

配信タイトル

画面上に配信のタイトルを表示させておくこともおすすめです。
今回は雑談配信であるため、そのまま「雑談配信」のタイトルを作成しています。
配信タイトルは中央に大きく表示させたり、端に小さく寄せて表示させたり調整してみてください。
テキストのみでもカラーの使い方や、フォントでデザイン性のある配信タイトルが作成できます。

4-配信タイトル①

Vtuberをはじめ、自分のキャラクターがある方はキャラクターを表示させることもおすすめであるため、タイトルはロゴのようなイメージで表示させてみましょう。

5-配信タイトル②

大きめのコメント欄

コメント欄はオーバーレイに含んである場合が多くありますが、独立させる場合でも大きめにデザインしましょう。
とくにYouTubeでは、YouTube上のコメントを投稿してから配信者に見えるまで遅延(ラグ)があります。
視聴者が「自分のコメントが配信者に届いている」と認識するために、画面上にコメントを表示させることを踏まえてデザインしてみてください。
大きさの目安は、画面横幅の1/3以上がコメント欄になるようデザインしましょう。

6-大きめのコメント欄

OBS上でのコメント表示をかわいいデザインにカスタマイズする方法

時計

雑談配信の画面には、時計の表示も欠かせません。
画面上で動くものが少ない雑談配信では、コメントの流れや時計により動きを加えることがおすすめです。
時計はリアルタイムで表示させる必要があるため、ブラウザで動く時計を利用して表示させましょう。
本記事ではNeon Digital Clockを使用しています。
OBSのブラウザソースにURLを貼り付けるのみで簡単に表示できるので、ぜひ実践してみてください。

7-時計

OBSで時計を表示する設定方法

テロップ

雑談配信中にテロップを流すことで、禁止事項をはじめとするルールを視聴者に見せられます。
視聴者が増えるたびにルールを説明することは雑談の妨げになり、スムーズに配信できなくなるため、テロップを活用して常にテキストが流れている画面をデザインしましょう。
シンプルなテロップであればOBS上で簡単に作成できます。
ソース内の「+」ボタンから「テキスト」をクリックして、内容をカスタマイズすれば完了です。

8-テロップ①

画面に表示する範囲やテロップが流れるスピードを調整して、配信画面をデザインしてみてください。
今回は、画面下部にテロップが流れるように設定しています。

9-テロップ②

OBSでテロップを表示させる方法まとめ

ゲーム配信の画面デザイン

ゲーム配信の画面デザインは、ゲーム画面がメインコンテンツとなるため、邪魔にならないよう配慮が必要です。
しかし、デザイン性に富んだ画面にする方法は多くあるため、どのような構成になるのかを次のように解説します。

  • ゲーム画面を表示できる枠(オーバーレイ)
  • ゲーム画面
  • コメント欄
  • コンパクトなテロップ

一つ一つの構成が画面デザインをよりよくするための方法となるので、活用してみてください。

ゲーム画面を表示できる枠(オーバーレイ)

ゲーム配信のオーバーレイは、シンプルなものであれば真四角かL字のもので、外側に枠を付ける程度で問題ありません。

10-配信簡易オーバーレイ

しかし、上記のような枠ではゲーム画面は見やすいものの、デザイン性には欠けてしまいます。
そのため、ゲームタイトルに合わせてオリジナルのデザインを作成したほうが、見映えがよくなり視聴者離れも少なくなるでしょう。

11-配信オーバーレイ

ゲーム画面

ゲーム配信のメインコンテンツとなるゲーム画面は全画面が望ましいですが、デザイン性を重視する場合は、オーバーレイのために少し小さく表示しましょう。
画面サイズをそのままでオーバーレイを被せると、ゲームによっては重要な部分が見えなくなる可能性があるため、注意が必要です。

12-ゲーム画面①

作成したオーバーレイに合わせてゲーム画面のサイズをOBS上で変更してみてください。

13-ゲーム画面②

コメント欄

ゲーム配信におけるコメント欄は、雑談配信と異なり小さい表示がおすすめです。
ゲーム画面を見せることから、コメント欄を表示しない配信者も少なくありません。
コメント欄を表示しておくメリットはそれほど多くありませんが、配信の切り抜きでは非常に役立ちます。
切り抜きではコメントが表示されていないと、配信者がなにに対して反応しているのかが不明確になるため、小さくても表示しておきましょう。

14-コメント欄

コンパクトなテロップ

ゲーム配信では、テロップをお知らせのような形で活用すると良いでしょう。
チャンネル登録を促したり、参加する視聴者を募ったりできます。
今回は、オーバーレイにある逆L字の枠にテキストを入力しました。

15-テロップ

ゲーム配信の画面はゲーム画面を大きくし、コメント欄やオーバーレイは最小限のものにすることを意識して作成しましょう。

CastCraft Screenで縦に動くテロップを簡単に実現する方法

歌配信の画面デザイン

歌配信の画面デザインは、次の内容で構成しましょう。

  • 背景画像
  • 曲のタイトル・セトリ
  • コメント欄
  • ペンライト等のエフェクト
  • 弾幕表示

それぞれのデザイン構成を確認して、歌配信がより盛り上がる画面を作成しましょう。

関連記事:OBSで歌枠の設定|OBSを使った歌配信のやり方を徹底解説

関連記事:歌枠のやり方を解説!音源や機材などもあわせて紹介

背景画像

歌配信には表示する映像がないため、背景画像を用意しましょう。
コンサートホールのような画像やライブ会場の画像など、さまざまなデザインが考えられます。
今回は幻想的なイメージのデザインを背景画像に採用しました。

16-歌枠背景

背景画像は好みや自分のキャラクターに合わせて作成してみましょう。

曲のタイトル・セトリ

歌配信に欠かせないものとして、曲のタイトル表示やセトリと呼ばれている「セットリスト」が挙げられます。
セトリは自分で作成するよりも、OBS用に配布されているツールのほうがおすすめです。
多くの配信者が活用している有名なセトリであるセトリスタを使用してセトリを作成しましょう。

17-セトリスタ

セトリに表示するものは、現在歌っている曲、次に歌った曲、歌い終わった曲の3つです。
視聴者にわかりやすいようにカスタマイズして使用してみてください。

18-セトリ表示画面

コメント欄

歌配信のコメント欄は雑談配信と同様に大きいものが望ましいです。
しかし、雑談配信と異なりコメントを読み上げる機会は少なく、コメント自体もペンライトや弾幕表示のための投稿が多くなります。
そのため、画面の3分の1以上を占めるようなものではなく、スマホで視聴した際に読めるサイズに調整してみてください。

19-歌配信コメント欄

ペンライト等のエフェクト

歌配信では、視聴者がライブの観客として参加できるようなシステムを導入すると、より一層盛り上がります。
画面にペンライトを表示させられるツールとしてCastCraftを活用しましょう。
ペンライト以外にも花火や流れ星など、さまざまなエフェクトを表示させられます。

20-ペンライト演出

おすすめの使い方として「ペンの絵文字をコメントで投稿するとペンライトが画面に表示される」のように、条件を設定してみてください。
視聴者がペンの絵文字をコメントする度に、画面にペンライトが表示され、配信者と視聴者との間で一体感が生まれます。

21-ペンライト演出設定

CastCraft Screenでコメントに反応する演出を作る方法

弾幕表示

CastCraftにはエフェクト演出のみではなく、弾幕表示の機能が含まれています。
歌配信ではサビのタイミングで、視聴者全員で弾幕用のコメントを投稿すれば、画面が埋め尽くされるほどの弾幕で配信画面が盛り上がるでしょう。

22-弾幕表示

弾幕表示もエフェクト演出と同様に、特定のコメントに反応して自動で表示させられます。
配信者におすすめのツールであるCastCraftを活用し、より一層視聴者が盛り上がる配信にしてみてください。

CastCraftで弾幕・コメントに反応する文字エフェクトを発生させる方法

配信画面のオーバーレイ用の画像をデザインする方法

ここまで配信画面のオーバーレイをはじめさまざまなデザインを紹介しました。
ここからは、誰でも簡単に配信画面のオーバーレイ用の画像をデザインする方法について、次のように解説します。

  • フリー素材を使う
  • 自分で作成する
  • プロに依頼する

それぞれのデザインを作成する方法を確認しましょう。

フリー素材を使う

最も簡単な方法として、フリー素材を使ったデザインが挙げられます。
フリー素材をOBSで表示させるのみで、デザインが完了するため誰でも簡単に配信画面をデザインできます。
しかし、配信に合うものを探す必要があるほか、凝ったデザインの作成は難しいでしょう。
また、著作権の関係上フリー素材をカスタマイズしても良い場合と、カスタマイズしてはいけない場合もあります。
ダウンロードして使用する際は、必ず著作権やカスタマイズの有無について確認しましょう。

おすすめフリー素材サイト

フリー素材を使用したい方は、次のサイトがおすすめです。

  • BOOTH
  • OKUMONO

BOOTHは、配信用オーバーレイに活用できるさまざまな素材がダウンロードできるサイトです。
有料の素材が多いですが、無料でも有料に引けを取らないクオリティの素材が溢れています。

23-BOOTH

OKUMONOもBOOTHと同様に配信オーバーレイをデザインできる素材が豊富なサイトです。
そのまま使用できる枠をはじめ、さまざまな素材がダウンロードできるのでぜひ活用してみてください。

24-OKUMONO

自分で作成する

配信オーバーレイは、自分で作成することでオリジナルのデザインで配信できます。
本記事で紹介したデザインの多くがオリジナルとなっており、凝ったデザインも自由自在です。
しかし、画像編集ソフトが必要となるため、自分で作成したい方は編集ソフトを購入しましょう。

おすすめ編集ソフト

配信オーバーレイを作成できるおすすめの編集ソフトとして、本記事に掲載されている画像を作成したソフトAdobe Photoshopが挙げられます。
Adobe Photoshopは、主に写真を加工したり合成したりするソフトとして知られていますが、配信オーバーレイを作成するソフトとしても非常に優秀です。
月額3,000円程度の料金が発生するものの、7日間の無料期間が用意されているため、オーバーレイをすぐに作成すれば料金はかかりません。

25-photoshop

完全無料で初めてのデザイン作成には、編集ソフトよりも簡易的なカスタマイズができるCanvaがおすすめです。
フリー素材サイトとしても有名ですが、Canvaは無料の既存デザインを自由にカスタマイズできる機能が搭載されています。
そのため一からデザインを作成する必要がなく、クオリティの高いデザインに手を加えて自分のオリジナルが作成可能です。
Adobe Photoshopが利用できない方や利用したくない方は、Canvaを利用してみましょう。

26-Canva

プロに依頼する

配信オーバーレイのデザインはオリジナルにしたいけれど、自作は難しいという方はプロに依頼しましょう。
デザインを学んだ多くのクリエイターが配信者向けに配信オーバーレイやアバターの作成依頼を募集しています。
費用が発生するものの、ハイクオリティかつオリジナルのデザインが手に入れられるので、あわせて検討してみてください。

依頼したときの費用相場

デザインの作成はクリエイターによって料金が定められているため、さまざまです。
依頼する際に相場がわからないと、高額な料金で依頼することになりかねないため、ここで把握しましょう。
配信オーバーレイの作成費用の相場は、3,000円~8,000円程度が一般的です。
Vtuber用やすぐに配信をはじめられるセット商品など、多くのクリエイターが工夫して出品しているため、依頼する際はより多くのデザインを見比べて決めましょう。

依頼できるサイト

配信オーバーレイ用の素材やアバターの作成などを依頼できるサイトは、非常に多くあります。
その中でも、おすすめのサイトを紹介するので、参考にしてみてください。

  • ココナラ
  • SKIMA

ココナラは、非常に多くのクリエイターが在籍している日本最大級のスキルマーケットサイトです。
「配信素材」で検索すれば1,000件以上の出品が確認でき、多くの選択肢から自分だけのデザインを依頼できます。

27-ココナラ

ココナラに続くおすすめサイトであるSKIMAは、出品数はココナラに劣るものの、クオリティが非常に高いです。
配信オーバーレイのセットでも安価な料金設定にしているクリエイターも多く、費用をかけたくない方にもおすすめができます。

28-SKIMA

どちらのサイトもおすすめであるため、自分の気に入ったデザインを探してみてください。

動く配信画面をデザインする方法

動く配信画面をデザインする時に、特におすすめしたいのがCastCraftのScreenという機能です。

CastCraft Screen

特定のコメントに反応する演出や、文字エフェクト、テロップ等もリッチにデザインすることができます。

特定のコメントに反応するエフェクト

設定した条件のコメントに反応する画面演出を設定できます。

ペンライト

コメントに反応するエフェクトの設定方法

文字エフェクト

特定のコメントに反応する高度な文字エフェクトが簡単に作れます。

文字スタンプ

文字エフェクトの設定方法

テロップ

設定した複数のテキストを、アニメーション付きのテロップ形式でOBSに映し出せます。

メッセージボードデモ

テロップの設定方法

ポップアップするコメント欄

指定した特定のエリアにコメントがポップアップするような見た目のコメント表示ができます。

チャットポップアップ・イメージ

ポップアップするコメント欄の設定方法

手持ちの画像をエフェクト化

画像やGIFからアニメーション付き配信エフェクトを手軽に作りだせます。

画像スタンプ(GIF)

画像エフェクトの設定方法

配信画面デザインで差をつけよう

今回は、配信画面のデザインについて解説しました。
雑談配信やゲーム配信、歌配信など、配信の内容によって構成も大きく異なります。
配信画面をデザインするにあたり、大切なことは視聴者の目線になって構成することです。
色合いや大きさ、メインコンテンツの確立などのポイントを意識して作成してみてください。

配信をより面白くするために

配信で視聴者のコミュニティ形成をうまく行うことで、日常の配信をより面白いものにすることができます。
そのような観点で最もおすすめな配信ツールがCastCraftです。

大きく分けて、  

  • 視聴者を覚えるYouTube/Twitchコメビュ
  • 配信画面演出のScreen
  • 収益化のための機能

の三つの機能があり、それぞれ下記のような目的があります。

機能 目的
YouTube/Twitchコメビュ 視聴者が配信に馴染めるようなやり取りをサポート
Screen 視聴者とのやり取りを視覚的に楽しくする
収益化 視聴者を大事にする形で収益化する

CastCraftのYouTube/Twitchコメビュで視聴者ごとにコメントを蓄積することで視聴者全員を覚えて、配信中のダッシュボードで分かりやすく情報を表示することで、視聴者が常連化していくためのやり取りをサポートします。
CRM候補1

特定の条件に当てはまった視聴者やコメントに対して、Chatbotやリッチな画面演出で視聴者をインタラクティブに楽しませる仕組みも作ることができます。
ペンライト

さらに、視聴者を大事に定着させながらも配信活動のための収益を上げる仕組みも提供しています。
収益管理

CastCraftは上記のような機能により、配信者(ゲーム配信者やVtuber)が視聴者との関係を深めることを手助けします。

導入している配信者さんの事例としては、

等がいらっしゃいます。

導入されたチャンネルの総登録者数は5,000万人を超えており、これまで70万回以上の配信で使われています。

CastCraftを活用すれば、視聴者との関係をより良いものに進化させ、あなたの配信コミュニティをより濃いものにできます。
日々の配信をより楽しくするために、ぜひ導入を検討されてみてください。

CastCraftのダウンロードページ(利用無料)