OBS等に配信コメントを表示する
OBS等で配信画面にコメント欄を表示するためには、
- オーバーレイ
- Screen
の2種類の方法をご用意しています。
ScreenはWindows端末でしかご利用いただけないので、Macの方はオーバーレイをご利用ください。
オーバーレイでコメント欄を表示する
チャットボックスオーバーレイの新規作成
左側メニューの「 オーバーレイ 」から「 オーバーレイを作成する 」をクリックし、「 チャットボックス 」を選択して「作成」を押します。
オーバーレイのURLをOBSの「ブラウザ」ソースに貼り付け
作成されたオーバーレイの設定欄の「URLをコピー」というボタンを押し、オーバーレイのURLをコピーします。
OBSでソースから「 ＋ 」をクリックし、「 ブラウザ 」をシーンに追加します。
追加したブラウザの「 URL 」の欄に先ほどコピーしたURLを貼り付けます。
オーバーレイのデザインやアニメーションを設定し、保存
先ほどのCastCraftのチャットボックス設定で、デザインやフォント、アニメーションをカスタマイズした後、一番右上にある「保存する」ボタンを押すことでカスタマイズが反映されます。
CastCraftで配信に接続
CastCraftのLiveDashboardで配信に接続し、コメントを取得することでOBSにコメントが表示されます！
Screenでコメント欄を表示する
以下のパートでは、Screen機能を使ってコメントをOBS等に表示する各種方法をご説明します。
CastCraftのScreenタブでコメント欄を表示する方法は、
- 「チャットボックス」ウィジェット
- 「チャットポップアップ」ウィジェット
- 「流れる文字」「落ちる文字」「文字スタンプ」インタラクション
1の「チャットボックス」では下記のようなコメント表示が可能です。
2の「チャットポップアップ」では下記のようなコメント表示が可能です。
3の「流れる文字」や「落ちる文字」や「文字スタンプ」では、下記のようなスタイルでニコニコ風なコメントが流れる表現や、画面内でコメントが落ちてくる表現などが可能です。
Screen機能のインストール
Screen機能を使うには追加のインストールが必要です。
インストール後、CastCraftのScreenタブにてScreen機能が正常に起動したらインストール成功です。
（※初回の起動には時間がかかります）
ScreenをOBS等に追加
OBS等にて「映像キャプチャデバイス」（もしくは「ビデオキャプチャデバイス」）ソース を追加し、デバイス選択で「CastCraft Screen」を選択してください（下図）
映像キャプチャデバイスに「CastCraft Screen」の表示がされない方は、NDI経由でOBSに出力する方法をお試しください。
1.Screenの「チャットボックス」
1-1.「チャットボックス」ウィジェットを追加
- Screen上部のバーを「クラフトモード」にして、 「ウィジェット設定」にて「チャットボックス」ウィジェットを追加します。
クラフトモードでは、Screen画面内でウィジェットの大きさや位置、デザインのカスタマイズができます。
プレビュー表示の緑色の囲い枠を使って、各ウィジェットの位置と大きさを調整します。
1-2.コメント表示方法のデザイン
クラフトモードにて「ウィジェット設定」タブを選択します。
各ウィジェットの「設定」ボタンを押すとデザインが詳細に設定できます
自分で一からデザインすることもできますし、「プリセット選択」というドロップダウンメニューを押すと既存のいくつかのデザインを選択することも可能です。
「チャットボックス」ウィジェットの「チャットアイテム設定」をカスタマイズするときは、「デモメッセージを流す」をONにしておくとデザインを反映させながら設定を作れます
左側のプレビューを見ながら設定をカスタマイズし、自分なりのデザインが完成したら、新しいプリセットとして保存できます。
配信で使う前に、Screenをキャストモードに戻す必要があります。
1-3.CastCraftで配信に接続
CastCraftのLiveDashboardで配信に接続し、コメントを取得することでOBSにコメントが表示されます。
2.Screenの「チャットポップアップ」
2-1.「チャットポップアップ」ウィジェットを追加
Screenをクラフトモードにした上で、「ウィジェット設定」にて「チャットポップアップ」ウィジェットを追加します。
2-2.デモメッセージをONに
「デモメッセージを流す」と言うトグルをONにしてみてください。配信中のチャットポップアップが画面上にどのように表示されるかが見られます。
表示させたくないウィジェットは「ウィジェット設定」のウィジェット一覧から削除することができます
チャットポップアップとチャットボックスは同時に使うことはないと思いますので、ウィジェット一覧からどちらかを削除するか、画面右上の「＋」ボタンからシーンを追加して、シーンを使い分けることを検討しましょう
2-3.位置と大きさの調整
チャットポップアップ・ウィジェットの緑枠を調整して、コメントが表示される位置と大きさを調整しましょう。
配信で使う前に、Screenをキャストモードに戻す必要があります。
2-4.CastCraftで配信に接続
CastCraftのLiveDashboardで配信に接続し、コメントを取得することでOBSにコメントが表示されます。
3.「流れる文字」でニコニコ風のコメント表示
3-1.インタラクションにて「流れる文字」等を追加
上部のバーを「クラフトモード」にします。
「インタラクション設定」タブを選択します。
「インタラクション設定」から「流れる文字」「落ちる文字」「文字スタンプ」等を追加し、設定画面を開きます。
3-2.チャットに反応する条件を設定
「チャットに反応する条件」を「総チャット回数が1以上のとき」にすると、投稿されたコメントすべてが横流し表示になります。
本機能は既存のコメントの位置を判定部から次のコメントの位置を算出するような仕組みは利用しておらず、株式会社ドワンゴの特許権を侵害するものではありません。
配信で使う前に、Screenをキャストモードに戻す必要があります。
3-3.CastCraftで配信に接続
CastCraftのLiveDashboardで配信に接続し、コメントを取得することでOBSにコメントが表示されます。
Screenでのトラブルシューティング
Screenで問題が生じた場合
Screenで画面動作が重い場合
ウィジェットの光加減を調整したい場合
Screenでチャットボックスを表示させたくない場合
- デフォルトの状態だと、CastCraftでコメントを取得するとScreen画面上でコメントが流れます（参考：「触れるコメビュ」機能）
- 流れるコメント欄をScreenで表示させたなくない場合は、クラフトモード ＞ ウィジェット設定 ＞ 「チャットボックス」右側のメニューをクリック ＞ 「削除」をクリックして、ウィジェットを削除します
- ウィジェット一覧の右側にある「＋」ボタンから、ウィジェットは再び追加できます