OBSでブラウザをキャプチャする方法|ブラウザソースの使い方も解説

最終更新 2024-08-10
OBSでブラウザをキャプチャ

目次

OBSでブラウザをキャプチャして配信する方法は?

OBSでブラウザをキャプチャするにはどのソースを使えばいいでしょうか?答えはウィンドウキャプチャあるいは画面キャプチャです。ウィンドウキャプチャを使えばブラウザだけをキャプチャすることができ、画面キャプチャを使えばブラウザを映したPCの画面全体をキャプチャすることができます。
ブラウザソースというソースもありますが、Youtubeの画面やブラウザゲームなどをキャプチャするのには適していません。ブラウザソースはコメント欄などの配信画面を装飾するオブジェクトを表示するときに使われています。
本記事ではOBSでブラウザをキャプチャする方法とブラウザソースの使い方について解説します。

OBSでブラウザをキャプチャする方法

ウィンドウキャプチャ

ウィンドウキャプチャは特定のウィンドウのみをキャプチャするソースです。ブラウザだけでなく、ゲームやその他のアプリもキャプチャすることができるばんOBSの基本的なソースです。

手順1:ソースを作成

OBSを開き、ソースの「+」から「ウィンドウキャプチャ」を選択します。

1 ウィンドウキャプチャ作成

手順2:名前をつける

わかりやすい名前を入力して「OK」をクリックしてください。

2 ウィンドウキャプチャ 名前をつけて保存

手順3:プロパティの設定

プロパティが表示されたら「ウィンドウ」で映したいウィンドウを、「キャプチャ方法」で「Windows10(1093以降)」を選択して「OK」をクリックしてください。

3 ウィンドウキャプチャ プロパティ

手順4:サイズを調整

プレビューが表示されたら赤枠をドラッグしてサイズを好みに調整して設定完了です。

4 ウィンドウキャプチャ サイズ変更

OBSのウィンドウキャプチャの使い方|うまく映らないときの解決策も解説

画面キャプチャ

画面キャプチャはPCの画面全体をキャプチャするソースです。ウィンドウキャプチャとは異なり、タスクバーや通知なども同時にキャプチャしてしまいます。個人情報の扱いには注意してください。

手順1:ソースを作成

OBSを開き、ソースの「+」から「画面キャプチャ」を選択します。

5 画面キャプチャ作成

手順2:名前をつける

わかりやすい名前を入力して「OK」をクリックしてください。

6 画面キャプチャ 名前をつけて保存

手順3:プロパティの設定

プロパティで「キャプチャ方法」で「Windows10(1093以降)」を、「ディスプレイ」でキャプチャするディスプレイを選択して「OK」をクリックしてください。

7 画面キャプチャ プロパティ

手順4:サイズを調整

プレビューが表示されたら赤枠をドラッグしてサイズを好みに調整して設定完了です。

番外編:ブラウザソースでキャプチャするのは難しい

ブラウザソースではブラウザをキャプチャすることは一応可能ですが、先述した2つのキャプチャと比較して使い勝手が悪いです。ブラウザソースでは画面をスクロールすることができないため、ブラウザ全体を閲覧することができません。また、Youtubeなどのログイン状態は解除されているため、再度ログインする手間がかかります。ブラウザはウィンドウキャプチャや画面キャプチャでキャプチャすることをおすすめします。
ブラウザソースは配信画面を装飾する目的で頻繁に使われます。次項ではブラウザソースを上手く活用する方法について紹介します。

ブラウザソースとは

指定したURLを表示するソース

ブラウザソースは指定したURLやhtmlファイルをOBS内で表示できるソースです。Youtubeなどのリンクを入力することで表示することはできますが、先述した通り使い勝手が悪くおすすめできません。ブラウザソースが活躍するのは配信画面を装飾するときです。配信画面を飾るオブジェクトはブラウザソースで表示することを前提にリンクを配布しているものが多いです。また、ストップウォッチのように動きのあるオブジェクトは基本的にhtmlファイルで作られています。
このあとはブラウザソースの具体的な使用用途について解説します。

ブラウザソースの具体的な使用用途

コメント欄

YoutubeやTwitchのコメント欄のURLを取得することで、ブラウザソースを使ってコメント欄を配信画面に表示することができます。コメント欄をポップアウトするとURLが表示されるので、URLをブラウザソースのプロパティにコピペするだけで設定完了です。

配信画面にコメント表示をする方法を徹底解説!

ストップウォッチ

ストップウォッチもブラウザソースで表示することが多いです。クリエイターさんが作成したストップウォッチのhtmlファイルを読み込むことで、ストップウォッチを配信画面に表示できます。おすすめのストップウォッチや配信での活用方法は下記記事で解説しています。

OBSにストップウォッチ配信画面に映す方法|おすすめのストップウォッチも解説

Discordのアイコン

Discord StreamKit Overlayというサービスを使うことでDiscordのアイコンのリンクを取得することができ、ブラウザソースでDiscordのアイコンをOBS上に表示することができます。Discordで通話しながらのコラボ配信ではアイコンを画面に表示することで誰が参加しているのか視聴者にわかりやすくなります。

OBSとDiscordを連携する方法!画面共有・アイコン表示徹底解説

ブラウザソースを設定する方法

今回は例として、こまにん氏が作成した【フリー素材】OBS用ストップウォッチを表示する方法を解説します。

手順1:ストップウォッチをダウンロード

BOOTHの販売ページからストップウォッチを無料でダウンロードします。これで、ストップウォッチのhtmlファイルを取得することができます。

8 ストップウォッチ ダウンロード

手順2:ソースを作成

OBSを開き、ソースの「+」から「ブラウザ」を選択します。

9 ブラウザソース作成

手順3:htmlファイルを選択

「ローカルファイル」にチェックを入れ、「参照」からhtmlファイルを選択して「OK」をクリックします。

10 ブラウザソース プロパティ

手順4:サイズを調整

プレビューが表示されたら赤枠をドラッグしてサイズを好みに調整します。

手順5:対話からストップウォッチを開始

ストップウォッチのソースを選択後、プレビュー下にある「対話」をクリックすることで、ストップウォッチの操作を行うことができます。

11 ブラウザソース 対話

画面をキャプチャするその他のソース

OBSではブラウザ以外にもPCの画面をキャプチャするソースがあります。その中でも頻繁に使うソースを2つ紹介します。

ゲームキャプチャ

ゲームキャプチャはPCゲームやハイパフォーマンスのアプリをキャプチャするためのソースです。「ゲームキャプチャ」という名前ですが、Nintendo Switchなどの家庭用ゲームやスマホゲームはキャプチャすることができません。また、ブラウザゲームもゲームキャプチャではキャプチャできず、先述したウィンドウキャプチャや画面キャプチャでキャプチャする必要があります。ゲームキャプチャはあくまでもPCゲームをキャプチャするためのソースであることを覚えておきましょう。

12 ゲームキャプチャ

OBSのウィンドウキャプチャとゲームキャプチャの違いを解説

映像キャプチャデバイス

映像キャプチャデバイスはWebカメラやキャプチャーボードなどの映像をキャプチャしたいときに使うソースです。Webカメラの映像を映像キャプチャデバイスでキャプチャすることで顔出し配信を実現できます。また、Nintendo Switchなどの家庭用ゲームやスマホゲームを配信したいときも映像キャプチャデバイスを使います。ゲーム機とPCをキャプチャーボード経由で接続することで、PCにゲーム映像を表示させることが可能です。顔出し配信やPC以外でプレイするゲームを配信したいときには映像キャプチャデバイスを使うことを覚えておきましょう。

13 映像キャプチャデバイス

OBSの映像キャプチャデバイスが映らないときの対処法7選!原因を突き止めて解決しよう

OBSでブラウザをキャプチャして配信してみよう

OBSでブラウザをキャプチャする方法について解説しました。ウィンドウキャプチャもしくは画面キャプチャを使うことで、ブラウザをOBS上に映して配信することができます。画面キャプチャは通知が映り込むことによる個人情報漏洩のリスクが高いため、ウィンドウキャプチャのほうがおすすめです。また、ブラウザソースやその他の画面をキャプチャするソースについても解説しました。OBSで配信では、自分が配信に映したいものに応じてソースを使い分ける必要があります。ブラウザを表示させたソースと他のソースを組み合わせて、自分好みの配信画面を作ってみてください。

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

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

大きく分けて、  

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

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

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

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

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

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

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

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

等がいらっしゃいます。

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

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

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