Twitch(ツイッチ)コメントを流す方法!OBS配信向けの弾幕を映す・消す運用術

Index

「OBSでTwitch(ツイッチ)のコメントを表示する方法がわからない」「コメントを画面に流す形で表示できない」と悩む配信者もいるでしょう。

TwitchのコメントをOBSへ流す方法は、Alive Studio、CastCraft、StreamElements、Streamlabs、ブラウザソースなどがあります。

本記事では、各ツールでコメントを画面に流す手順や、アーカイブにコメントを残す方法、配信中に邪魔なコメントを消す運用、表示されない場合の対処法まで解説します。

最後まで読めば、視聴者との交流を深めながら、配信画面に合うコメントを表示できるようになるでしょう。

TwitchのコメントをOBSへ流す5つの方法

Twitch配信でコメントを画面に表示することは、視聴者とのリアルタイムな交流を深めるために欠かせません。OBSへTwitchのコメントを流す方法は、主に以下の5つがあります。

  • Alive Studio
  • CastCraft
  • StreamElements
  • Streamlabs
  • ブラウザソース

配信スタイルや演出方法によって、コメント表示の見せ方や設定方法は異なります。流れる文字演出を取り入れることで、視聴者との一体感を高め、よりライブ感のある配信を演出できます。

自分に合った配信方法を選ぶことで、視聴者ともっと近い距離感で交流でき、配信をさらに楽しめるでしょう。

なお、OBSの使い方を詳しく解説した記事もあるため、以下の記事も確認してみましょう。

» OBS Studioの使い方超入門ガイド!初心者向けに基本操作から配信・録画方法まで解説!

Twitchのコメントを流すおすすめツールと使い方

TwitchのコメントをOBSへ流す方法は、使うツールによって設定の手軽さや演出の自由度が変わります。本章では、Twitchへコメントを流せる以下のおすすめツールと使い方について解説します。

  • Alive Studio:コメント表示や演出をOBS内で管理
  • CastCraft:横流し表示やポップアップ演出に対応
  • StreamElements:URL追加だけでコメント欄を表示
  • Streamlabs:コメント欄や通知デザインをまとめて設定
  • OBSのブラウザ機能:外部ツールなしでコメント欄を表示

自分に合うコメント表示方法を確認していきましょう。

Alive Studioを使ってOBSへコメントを流す方法

Alive Studioは、配信画面用の素材やコメント表示をまとめて管理できる配信演出ツールです。OBSへコメントを流すには、以下のアカウント登録から連携設定まで順番に進める必要があります。

  1. Alive Studioへ登録する
  2. OBSにスクリプトを追加する
  3. カスタムドックにAlive Studioを追加する
  4. コメント枠などの素材を選んで画面を作成する

手順を詳しく見ていきましょう。

Alive Studioへ登録する

Alive Studioへ登録するには、Alive Studio公式ページからアカウントを作成し、OBS連携に使う専用スクリプトをダウンロードします。Twitchアカウントを使ってアカウント登録ができるため、スムーズに初期設定を進められます。

以下の手順で対応しましょう。

1.Alive Studioの公式ページへアクセスする

ツイッチ コメント 流す Alive Studio公式ページ

2.「無料ではじめる」から、「Twitchアカウントでログイン」をクリックする

ツイッチ コメント 流す Twitchアカウントでログイン

Twitch画面でAlive Authへの許可を行います。

ツイッチ コメント 流す Alive Authへの許可

3.利用規約を確認し、同意したうえで「アカウント登録する」をクリックする

ツイッチ コメント 流す アカウント登録する

4.セットアップ画面からスクリプトをダウンロードする

ツイッチ コメント 流す スクリプトをダウンロード

スクリプトはOBSへAlive Studioを追加するために必要なファイルのため、保存先を確認してから次の設定へ進みましょう。

OBSにスクリプトを追加する

Alive StudioでダウンロードしたスクリプトをOBSへ読み込ませます。追加先のシーンを選ぶ工程まで進めることで、コメント枠や配信素材をOBS上に反映できます。

以下の手順で対応を進めましょう。

1.OBSを起動し、上部メニューの「ツール」をクリックする

ツイッチ コメント 流す 「ツール」をクリック

2.「スクリプト」を開き、左下の「+」ボタンを選択する

ツイッチ コメント 流す 「+」ボタンを選択

3.ダウンロードしたAlive Studioのスクリプト(obs_setup.lua)を選択する

4.Alive Studioを追加したいシーンを選び、「追加/更新」ボタンを押す【シーン選択画面】

ツイッチ コメント 流す 「追加/更新」ボタンを押す

シーンを間違えると表示したい配信画面に反映されないため、ゲーム配信や雑談配信など、実際に使うシーン名を確認してから追加しましょう。

カスタムドックにAlive Studioを追加する

カスタムドックにAlive Studioを追加すると、OBS内で素材選びやコメント表示の管理ができます。専用URLをカスタムブラウザドックへ入力すれば、ブラウザを別画面で開かずに配信画面を調整可能です。

以下の手順で対応を進めましょう。

1.OBSの上部メニューから「ドック」をクリックする

ツイッチ コメント 流す 「ドック」をクリック

2.「カスタムブラウザドック」を選択する

ツイッチ コメント 流す 「カスタムブラウザドック」を選択

3.ドック名・URLに以下を入力し、適用をクリックする

ツイッチ コメント 流す 適用をクリック
  • ドック名:Alive Studio
  • URL:https://studio.alive-project.com/

Alive Studioが表示されたら、ログイン状態を確認してからコメント枠や配信素材の設定へ進みましょう。

コメント枠などの素材を選んで画面を作成する

OBS上のAlive Studioドックから配信に使う素材を配置します。コメント表示だけでなく、背景やフレームも組み合わせることで、Twitch配信の雰囲気に合う画面を作れます。

以下の手順で対応しましょう。

1.OBS内のAlive Studioドックを開く

ツイッチ コメント 流す Alive Studioドックを開く

2.素材一覧からコメント枠や背景、フレームを選ぶ

3.配信画面上で素材の位置やサイズを調整する

4.プレビューでコメント表示と画面全体の見え方を確認する

コメント枠はゲーム画面や顔出し枠を邪魔しない位置に置くと、視聴者がコメントを追いやすい配信画面になります。

CastCraftを使ってOBSへコメントを流す方法

CastCraftは、Twitchコメントの表示や配信画面の演出をOBSに追加できる配信者向けツールです。一般的なコメント欄だけでなく、Screen機能を使えば流れる文字やエフェクトも設定できます。OBSへコメントを流す設定は、以下の流れで進めます。

  1. CastCraftをセットアップする
  2. オーバーレイ機能で一般的なコメント欄を作る
  3. Screen機能を使ってコメントを表示する
  4. 流れる文字やエフェクトなどを設定する

手順を確認していきましょう。

CastCraftをセットアップする

CastCraftをセットアップするには、デスクトップアプリの導入とTwitchアカウント連携を先に済ませます。コメント取得にはCastCraft Botの権限設定も関わるため、以下の手順で初期設定を進めましょう。

1.CastCraft公式サイトからデスクトップアプリをダウンロードする

2.ダウンロードしたファイルを開き、画面の案内に沿ってインストールする

3.CastCraftを起動し、Twitch配信で使用するアカウントにログインする

4.Twitchの配信マネージャーを開き、自分のチャットへ「/mod castcraftbot」と入力する

上記手順でモデレータ権限を付与すると、CastCraftがTwitchコメントを取得できます。

オーバーレイ機能で一般的なコメント欄を作る

CastCraftでチャットボックスを作成し、OBSのブラウザソースへURLを設定します。画面右側に縦型のコメント欄を置きたい場合に扱いやすく、配信レイアウトへ自然に組み込めます。以下の手順で初期設定を進めましょう。

1.CastCraftのLive Dashboardでチャットボックスを配信に表示する

2.コメント欄のデザインを選び、フォントや色を調整する

3.オーバーレイのURLをコピーし、OBSのブラウザソースへ貼り付ける

ツイッチ コメント 流す URLをコピーしてOBSに設定する

4.幅や高さ、表示位置を調整し、Live Dashboardで配信へ接続する

Live Dashboardでコメント取得を開始すると、TwitchコメントがOBS上のコメント欄へ反映されます。

Screen機能を使ってコメントを表示する

Screen機能を使うと、Twitchコメントを動きのある演出としてOBSへ表示できます。デザインを細かく調整したい場合は、以下の流れで設定を進めましょう。

1.CastCraftアプリ内のScreenタブからScreenをインストールする

2.OBSでソースへ「映像キャプチャデバイス」を追加し、デバイスから「CastCraft Screen」を選ぶ

ツイッチ コメント 流す ScreenをOBSに取り込む

3.キャストモードでデモメッセージを表示し、コメントの見え方を確認する

4.クラフトモードで表示位置やサイズ、デザインを調整する

5.Live Dashboardを起動し、配信データとコメントを同期する

Screenを配信前に起動しておくと、TwitchコメントをOBS画面へリアルタイムに反映できます。

流れる文字やエフェクトなどを設定する

Twitchコメントを演出として活用できるポップアップ表示、横流し表示、コメントに反応する画面演出は、以下の流れで設定しましょう。

1.Screenのクラフトモードを開き、チャットポップアップを追加する

2.「流れる文字」ウィジェットを追加し、コメントを横流しで表示する

3.インタラクション設定で、特定コメントに反応するエフェクトを作成する

4.Screenを起動し、Live Dashboardで配信データとコメントを同期する

同期が完了すると、条件に合うTwitchコメントがOBS画面へ反映され、横流し文字やペンライトなどのエフェクトが表示されます。

StreamElementsを使ってOBSへコメントを流す方法

StreamElementsは、Twitchコメントの表示やオーバーレイ作成、アラート設定をまとめて管理できる配信支援ツールです。OBSへコメントを表示する設定は、以下の流れで進めます。

  1. StreamElementsをセットアップする
  2. オーバーレイを作成する
  3. チャットウィジェットを追加・設定する
  4. OBSのブラウザソースにURLを追加する

詳しく見ていきましょう。

StreamElementsをセットアップする

StreamElementsをセットアップするには、公式サイトへアクセスし、Twitchアカウントでログインします。OBSへコメントを表示する前に、配信アカウントとの連携を済ませる必要があります。以下の手順で設定を進めましょう。

1.StreamElements公式サイトへアクセスする

2.ログイン画面でTwitchを選択する

ツイッチ コメント 流す ログイン画面でTwitchを選択

3.Twitchアカウントへのアクセス許可を確認する

4.StreamElementsのダッシュボードを開く

5.配信で使うチャンネルが選択されているか確認する

ダッシュボードを開けたら、次にオーバーレイを作成し、Twitchコメントを表示するための土台を用意します。

オーバーレイを作成する

StreamElementsのダッシュボードから編集画面を開き、Twitchコメントを表示する枠を用意します。既存デザインへ追加する場合と、新規作成する場合で入口が変わるため、以下の流れで進めましょう。

1.メニューから「Streaming tools>Overlays」を開く

2.新規で作る場合は「NEW OVERLAY」を選択する

ツイッチ コメント 流す 「NEW OVERLAY」を選択

既存のオーバーレイを使う場合は「EDIT」を選択します。

3.配信画面に合わせて解像度を選び、編集画面を開く

編集画面を開いたら、次にチャットウィジェットを追加し、コメント欄の見た目を設定します。

チャットウィジェットを追加・設定する

オーバーレイ編集画面でコメント表示用の部品を配置します。表示サイズや文字の見た目を調整するため、以下の手順で設定しましょう。

1.編集画面の「ADD WIDGET」または「+」をクリックする

ツイッチ コメント 流す 「ADD WIDGET」または「+」をクリック

2.「STREAM TOOLS」から「Your stream’s chat」を選択する

ツイッチ コメント 流す 「Your stream’s chat」を選択

3.画面上に表示されたチャットボックスの位置とサイズを調整する

4.背景やフォント、文字サイズなどのスタイルを設定する

5.設定内容を保存し、コメント欄の見え方を確認する

チャットボックスを保存すると、StreamElements上にコメント表示用のオーバーレイが作成されます。

OBSのブラウザソースにURLを追加する

StreamElementsで作成したオーバーレイURLをコピーし、OBS側のソースへ貼り付けます。コメント欄を配信画面へ表示する最終工程として、以下の手順で設定しましょう。

1.StreamElementsに保存されたオーバーレイのメニューから「Copy URL」をクリックする

ツイッチ コメント 流す 「Copy URL」をクリック

2.OBSを開き、ソース欄の「+」から「ブラウザ」を選択する

3.新しいソース名を入力し、URL欄へコピーしたURLを貼り付ける

4.幅と高さを配信画面に合わせて入力し、「OK」を押す

5.OBSプレビュー上でコメント欄の位置と表示サイズを調整する

設定が完了すると、StreamElementsのチャットウィジェットがOBS画面へ表示されます。

Streamlabsを使ってOBSへコメントを流す方法

Streamlabsは、Twitchのコメント表示だけでなく、フォロワーやサブスクリプション通知の表示もできる多機能なWebサービスです。Streamlabsを使うと、コメント欄のデザインをカスタマイズし、視聴者にとってわかりやすくおしゃれな表示を作れます。

設定は、以下の手順で進めます。

  1. Streamlabsにログインする
  2. チャットボックスを編集する
  3. OBSのブラウザソースで表示する

詳しく見ていきましょう。

Streamlabsにログインする

Streamlabsの公式サイトを開き、Twitch配信で使うアカウントを連携します。コメント欄をOBSへ表示する前に、以下の手順で初期設定を進めましょう。

1.Streamlabs公式サイトへアクセスする

2.ログイン画面を開き、Twitchアカウントを選択する

ツイッチ コメント 流す Twitchアカウントを選択

3.Twitch側のアクセス許可を確認し、連携を承認する

ログインが完了すると、チャットボックスなどのウィジェットを設定する準備が整います。

チャットボックスを編集する

ダッシュボードからチャットボックスを開き、Twitchコメント欄の見た目を整えます。以下の手順で表示内容を調整しましょう。

1.Streamlabsのダッシュボードから「チャットボックス」を選択する

ツイッチ コメント 流す 「チャットボックス」を選択

2.フォントや色、背景、アニメーションを設定する

3.設定を保存し、ウィジェットURLをコピーする

ツイッチ コメント 流す ウィジェットURLをコピー

ウィジェットURLをコピーすると、OBSのブラウザソースへ貼り付ける準備が完了します。

OBSのブラウザソースで表示する

StreamlabsでコピーしたウィジェットURLをOBSへ貼り付けます。Twitchコメントを表示したいシーンを選び、以下の手順で設定しましょう。

1.OBSを起動し、コメント欄を表示するシーンを選択する

2.ソース欄の「+」をクリックする

ツイッチ コメント 流す ソース欄の「+」をクリック

3.「ブラウザ」を追加する

ツイッチ コメント 流す 「ブラウザ」を追加

4.StreamlabsのウィジェットURLを貼り付ける

ツイッチ コメント 流す ウィジェットURLを貼り付け

5.幅や高さを入力し、配信画面に合わせてサイズを調整する

ツイッチ コメント 流す サイズを調整

設定を保存すると、Streamlabsで作成したTwitchコメント欄がOBSの配信画面に表示されます。

OBSのブラウザ機能を使ってコメントを表示する方法

OBSのブラウザ機能を使えば、Twitchのコメント表示を画面に手軽に追加できます。さらに、透過やかわいいデザインにカスタマイズすることで、配信画面をより魅力的に演出可能です。

具体的な手順は、以下のとおりです。

  1. Twitchのチャットをポップアウト表示する
  2. OBSでブラウザソースを設定する
  3. カスタムCSSでデザインを変更する

詳しく見ていきましょう。

Twitchのチャットをポップアウト表示する

Twitchのチャットをポップアウト表示すると、OBSに貼り付ける専用URLを取得できます。外部ツールを使わずにコメント欄を表示する方法は、以下の手順で活用できます。

1.Twitchへログインし、配信チャンネルのチャット欄を開く

2.チャット欄の設定メニューから「チャットをポップアウト」を選択する

ツイッチ コメント 流す 「チャットをポップアウト」を選択

3.新しく開いたチャット画面のURLをコピーする

コピーしたURLは、次の手順でOBSのブラウザソースへ貼り付けます。

OBSでブラウザソースを設定する

TwitchのポップアウトチャットURLをOBSへ貼り付けます。コメントを表示したいシーンを選び、以下の手順で設定しましょう。

1.OBSを起動し、コメントを表示するシーンを選択する

2.ソース欄の「+」をクリックする

ツイッチ コメント 流す ソース欄の「+」をクリック

3.「ブラウザ」を選ぶ

ツイッチ コメント 流す 「ブラウザ」を選ぶ

4.新しいソース名を入力し、URL欄へポップアウトチャットURLを貼り付ける

ツイッチ コメント 流す URL欄へポップアウトチャットURLを貼り付け

5.幅や高さを入力し、プレビュー画面で位置と大きさを調整する

ツイッチ コメント 流す プレビュー画面で位置と大きさを調整

設定を保存すると、Twitchのコメント欄がOBSの配信画面に表示されます。

カスタムCSSでデザインを変更する

カスタムCSSを活用すれば、Twitchコメント欄の背景透過や文字色、余白などを調整できます。OBSのブラウザソース設定を開き、以下の手順でCSSを追加しましょう。

1.OBSでTwitchチャット用のブラウザソースを開く

2.プロパティ画面のカスタムCSS欄を確認する

ツイッチ コメント 流す カスタムCSS欄を確認

3.背景透過や吹き出し型などのCSSを貼り付ける

4.「OK」を押し、プレビュー画面で表示を確認する

CSSを反映すると、配信画面の雰囲気に合わせたコメント欄へ変更されます。

OBSのカスタムCSSでコメント欄・チャット表示できるサイトなどは、以下の記事で解説しています。

» OBSのカスタムCSSでコメント欄・チャット表示できるサイト3選

なお、当サイトでは、配信画面におけるデザインの基本や視聴者を惹きつける魅力的な画面作りのコツを紹介しています。

視聴者の満足度を高め、配信を盛り上げたい方は、参考にしてみましょう。

» VTuberの配信画面の作り方|デザインの基本と魅力的に設定するコツ

Twitchのアーカイブでもコメントを流す方法

Twitchのアーカイブでもコメントを流したい場合は、「過去の配信を保存する」機能を有効にしましょう。VODを残しておけば、過去の配信を視聴するときにチャット履歴もあわせて確認できます。

「過去の配信を保存する」機能を有効にするには、クリエイターダッシュボードの配信設定から機能をオンにします。Twitchの保存期間はアカウント条件によって異なるため、必要な配信は早めに確認すると安心です。

なお、OBS画面内へ弾幕のようにコメントを流したい場合はコメント表示ツールを使い、配信中に画面へ表示した状態で録画するのがおすすめです。

Twitchのアーカイブについて詳しく解説した記事もあるため、あわせて確認してみましょう。

» Twitchの過去の配信(アーカイブ)を見る方法!保存期間や見れない原因を解説

OBSへ流すTwitchのコメントが邪魔にならないための回避方法

TwitchのコメントをOBSへ流す際は、視聴者との交流だけでなく、ゲーム画面の見やすさへの意識も必要です。本章では、プレイ画面を妨げない運用について解説します。

  • ミニマップと被らない配置と透明度のコツ
  • OBSのショートカットキーでコメントを消す設定

詳しく見ていきましょう。

ミニマップと被らない配置と透明度のコツ

ミニマップと被らない配置にするには、ゲーム内UIの位置を確認し、コメント欄を余白のある場所へ置くことが重要です。FPSやMOBAでは、ミニマップ、体力ゲージ、弾数表示を避けて配置しましょう。

OBSカスタムCSSで背景を透過すると、ゲーム画面を隠さずにTwitchコメントを表示できます。文字色は背景と同化しない色を選び、透明度はプレイ情報を読める範囲での調整が重要です。

配信前にOBSのプレビューで確認すれば、ゲーム内UIとコメント欄が重なっていない状態で本番が開始できます。

なお、OBSでコメントを透過表示させる方法を解説した記事もあるため、あわせて確認してみましょう。

» OBSでコメントを透過表示させる方法!おすすめツールや注意点も解説

OBSのショートカットキーでコメントを消す設定

OBSのショートカットキーを設定すると、荒らしコメントが流れた場面でTwitchコメント欄を即座に非表示へ切り替えられます。ブラウザソース単位で表示・非表示を割り当てるため、以下の手順で設定しましょう。

  1. OBSの「設定」から「ホットキー」を開く
  2. Twitchコメント用のブラウザソース名を探す
  3. 「非表示」に任意のキーを割り当てる
  4. 必要に応じて「表示」に戻すキーも設定する
  5. 配信前にキー操作で表示が切り替わるか確認する

誤操作を防ぐため、1キーではなくCtrlやShiftを組み合わせたキー設定にしましょう。

OBSでTwitchコメントが表示できない場合の対処法

OBSでTwitchコメントが表示されない場合は、以下のポイントを見直す必要があります。

  • 連携アプリのアップデートや再ログインを試す
  • OBSのブラウザソース設定(URLやCSS)を見直す
  • ブラウザソースのハードウェアアクセラレーションを無効化する

原因を切り分けながら、コメント欄が表示される状態へ戻しましょう。

連携アプリのアップデートや再ログインを試す

Twitchコメントが表示されない場合の基本的な対処法は、連携アプリのアップデートや再ログインです。アカウント連携が切れていると、OBS側の設定が正しくてもコメントは取得されません。まずは、以下の項目を確認しましょう。

  • 連携アプリを最新版へ更新する
  • Twitchアカウントから一度ログアウトし、再ログインする
  • 配信用アカウントでログインしているか確認する

アップデートや再ログイン、再接続が完了したら、実際に配信を開始してコメントが表示されるか確認してみましょう。

OBSのブラウザソース設定(URLやCSS)を見直す

URLのコピー漏れやCSSの記述ミスがあると、Twitchコメント欄は表示されません。OBS側で原因を切り分けるため、以下の項目を順番に確認してみましょう。

  1. 最新のURLを貼り付けているか確認する
  2. URLの前後に空白や改行がないか確認する
  3. カスタムCSSを一度外して表示を確認する

修正後はOBSプレビューを開き、コメント欄の表示状態を確認しましょう。

ブラウザソースのハードウェアアクセラレーションを無効化する

PCやグラフィックボードとの相性により、Twitchコメント用のブラウザソースが正しく描画されない場合があります。URLやCSSを見直しても改善しない場合は、以下の手順で設定を変更してみましょう。

  1. OBSの「設定」を開き、「詳細設定」を選択する
  2. 「ブラウザソースのハードウェアアクセラレーションを有効にする」をオフにする
  3. 設定を保存し、OBSを再起動する

再起動後に配信画面を確認し、Twitchのコメント欄が表示されるか確認しましょう。

まとめ

OBSでTwitchコメントを表示する方法には、Alive Studio、CastCraft、StreamElements、Streamlabs、ブラウザソースなどがあります。なかでもAlive Studioは、コメント枠や配信素材をOBS内で管理できるため、Twitchコメント表示と画面作りをまとめて進めたい配信者に適しています。

コメントを画面に流すことで視聴者との一体感を高められますが、ミニマップやUIと重なる配置、荒らしコメントへの対応、表示されない場合の確認も欠かせません。

アーカイブでチャット履歴を残す方法や、OBSのショートカットキーでコメント欄を消す運用も押さえておけば、配信中のトラブルにも対応できます。

本記事を参考に、自分の配信画面に合うコメント表示を設定し、視聴者と交流しやすいTwitchの配信環境を整えましょう。

この記事を書いた人

ストマガ編集部

「ストリーマーマガジン」は、VTuberや配信クリエイターに興味がある方、ご自身でも活動されている方、そしてこれから配信をはじめてみたい方を応援するWebメディアです。 配信初心者さんからベテランさんまで、幅広く楽しめる情報をお届けします。

Share

Elgato:PC