OBS Studioでココフォリアを録画する際のおすすめの設定を解説

最終更新 2025-04-19
OBSでココフォリアを画面録画

目次

ココフォリアを最適化して録画する

TRPGやマーダーミステリーを遊ぶ際、リプレイ動画を作るためにココフォリアの画面をOBS Studioなどで録画しようとするキーパーの方は多いのではないでしょうか。

しかし、OBS Studioでただココフォリアの画面をそのまま録画すると「広告や不要な情報が映る」「音声が二重に聴こえてしまう」などユーザーにとって視聴しづらい動画になることがあります。

本記事ではそんな問題を解消するため、カスタムCSSを使用してココフォリアの画面を配信用に最適化する方法や、音声の取り込み方などを順序立てて解説していきます。

OBS Studioのココフォリアの録画設定手順

1.ブラウザソースでココフォリアを表示する

録画を始める前に、まずはOBS Studioでソースを追加してココフォリアの画面を表示させます。

その際ウィンドウキャプチャを使用してしまうと画質の劣化やツールバーなどの映り込みが発生する可能性があるため、必ずブラウザソースを使用してください。

それでは、実際の手順をスクリーンショット付きで解説していきます。

手順1:OBS Studioにブラウザソースを追加する

まずは任意のシーンを選び、ソースから「+」→「ブラウザ」を選択し、わかりやすい名前を入力して追加します。

画像1:ブラウザソースの追加

手順2:ココフォリアのルームURLを入力する

続いて、先ほど追加したブラウザソースのプロパティを開き、録画したいココフォリアルームのURLを「URL」欄に貼り付けます。

画像2:ココフォリアルームのURLを添付

その際、幅と高さは配信解像度に合わせて入力した上で「OBSで音声を制御する」にチェックを入れてから「OK」をクリックしてください。

手順3:操作パネルで表示を整える

ココフォリアルームのURLをOBS Studioに貼り付けると、ココフォリア上では広告を削除していても配信画面には広告が表示されている状態になります。

その際は画面下部にある「対話(操作)」ボタンをクリックすることでOBS上のココフォリア画面を直接操作できるようになるので、ここから広告を閉じたり、盤面の表示を調整してください。

画像3:対話

2.アプリケーション音声キャプチャで音声設定する

続いてはOBS Studioで音声の設定をおこないます。

ココフォリアの音声をOBS Studioにのせる場合はデスクトップ音声のままでもいいのですが、ディスコ―ドを使用してオンラインセッションをする場合や、カスタムCSSでパーツを分けて表示する場合は音声の重複などの不具合が発生する可能性があるのでアプリケーション音声キャプチャを使用します。

こちらも実際の設定画面の画像を添付しながら解説します。

手順1:アプリケーション音声キャプチャを追加する

OBSのソースで「+」→「アプリケーション音声キャプチャ(ベータ)」を選び、任意の名前を付けて追加します。

画像4:アプリケーション音声キャプチャ(ベータ)の追加

手順2:ココフォリアとディスコ―ドの音声をそれぞれ追加する

「アプリケーション音声キャプチャ(ベータ)のプロパティ」を開き、表示されたウィンドウで録音したいアプリケーション(例:Google ChromeやDiscord)を選択し「OK」をクリックします。
画像5:ディスコード音声のプロパティ ウィンドウ
TRPGやマーダーミステリーの場合は、ココフォリアの音声とディスコ―ドの音声の2つをアプリケーション音声キャプチャ(ベータ)のソースで追加すれば、余計な音が録画に入る心配がありません。

3.カスタムCSSでさまざまなパーツを取り入れる

事前準備はこれで完了なので、ここではカスタムCSSを使用して盤面やチャットログ、ステータスや吹き出しなどを個別に表示させる方法を解説します。

カスタムCSSでココフォリアのパーツをバラバラに表示させることで、リプレイ動画として見やすい配置に変更することが可能になります。

有名なTRPG配信者のほとんどはこの機能を使っているので、ぜひこの機会に扱えるようになりましょう。

※基本的な設定は以下の記事内ですべて解説しているので、そちらを参考にしてください。

OBS Studioでココフォリアをきれいに表示させる方法を解説

番外編:立ち絵とDiscordを連携して光らせる

TRPGのリプレイ動画や配信を見ていて、発言者のキャラクターが声にあわせて光っているのを目にしたことはありませんか?

実はあの仕組みも、OBS StudioとカスタムCSS、そしてDiscord STREAMKIT Overlayを組み合わせることで実装することが可能です。

本項目では、番外編として立ち絵とディスコ―ドを連携させて光らせる手順を解説します。

手順1:Discordで開発者モードをONにする

まずはディスコ―ドを立ち上げて設定(歯車マーク)をクリック→「詳細設定」→開発者モードをオンにします。
画像5:開発者モードオン

手順2:TRPGで使用する立ち絵をチャンネルに貼り付ける

続いて、立ち絵をTRPGで使用するサーバーの立ち絵チャンネルに貼り付けます。
画像6:立ち絵の追加

手順3:Discord STREAMKITをインストールする

ディスコ―ドの事前準備が完了したら、こちらのDiscor STREAMKITから「OBSのインストール」をクリックします。
画像7:Discord STREAMKIT
※その後のポップアップは「認証」で問題ありません。

手順4:音声ウィジェットをクリックして設定をおこないURLをコピー

Discord STREAMKITが開いたら音声ウィジェットをクリックします。

その後「先ほど立ち絵を添付したサーバーが選ばれていることを確認」「音声チャンネルを指定」「自分の名前とアイコンが画面に載っているかを確認」をおこない、問題なければURLをコピーしてきましょう。
画像8:音声ウィジェット .

手順5:OBS Studioでブラウザソースに先ほどのURLを添付する

URLのコピーが完了したら、OBS Studioに戻りブラウザソースを追加し、分かりやすい名前に変更します。
画像9:ブラウザソースの追加
その後プロパティを開き、URLの欄に先ほどコピーしたURLを貼り付けます。
画像10:URLの挿入

手順6:「Discord STREAMKIT:立ち絵変換」で設定をおこないカスタムCSSをコピー

続いて、OBS Studioの画面はそのままにした状態でDiscord STREAMKIT:立ち絵変換を開きます。

ディスコ―ドの立ち絵を添付したチャンネルで右クリックをおこない「リンクのコピー」をクリックし、Discord STREAMKIT:立ち絵変換の「画像URL」の欄にURLを貼り付けましょう。

あわせて「設定」→「マイアカウント」のユーザー名の横にある「…」をクリックし、ディスコ―ドのユーザーIDもコピーして上側に貼り付けます。
画像11:Discord STREAMKIT:立ち絵変換
あとは発話時のアクションなどを自由に設定してから「生成」ボタンをクリックし、表示されたカスタムCSSを先ほど開いたOBS Studioのブラウザソース内の「カスタムCSS」に貼り付けます。
画像12:生成

画像13:カスタムCSSを貼り付け

手順7:光るかどうか最終チェックをおこなう

ここまでの設定があっていれば、音声にあわせて立ち絵が光る設定が完了します。

設定が反映されているか、実際に声をいれて確認してみましょう。
画像14:反映されているかの確認
※上記画像では、発話時以外は明度50%になる設定が反映されています。

OBS Studioにおけるココフォリアの録画設定のコツ

アプリケーション音声キャプチャを使う

音声入力をおこなう際は、前述の通り必ずアプリケーション音声キャプチャを使用するようにしてください。

これを疎かにしてデスクトップ音声を反映させてしまうと、音の重複や通知音の混入が起こってしまい、せっかく没入感が高いTRPGを台無しにしてしまうことがあります。

アプリケーション音声キャプチャを使用すれば指定した箇所の音声だけがOBSに反映されるので、それ以外の音(パソコンの操作音、通知音、デスクトップ上で流れている音楽など)録画に入ってしまうことはありません。

手間ではありますが、音声は必ずアプリケーション音声キャプチャで取り込んでください。

見た目を重視する

OBS Studio上のココフォリアの配置は視聴者が見やすい配置になるようにおこなわれるので、ほとんどの配信者は似たような配置の画面になってしまいます。

なので、より注目されたい場合は画面配置にこだわり、オリジナリティのある配置にすることをおすすめします。

たとえば立ち絵をシーンの右側にまとめて配置する、ログの表示箇所を背景素材と親和性の高い箇所に配置するなどの工夫をおこなうことで、より視聴者にTRPGのリプレイ動画を楽しんでもらえるようになります。

特にTRPGやマーダーミステリーの動画は動きが少なくなる傾向にあるので、1画面の完成度にはしっかりとこだわっていきましょう。

OBS Studioでココフォリアを録画してみよう

ココフォリアの画面はそのままOBS Studioに反映させても十分に使えますが、今回紹介したカスタムCSSや音声設定をおこなうことでより視聴者にとって見やすい画面を作成することができます。せっかく録画してまで視聴者に見てもらえるようにするのであれば、盤面や吹き出し、チャットログなどの配置には十分にこだわりましょう。特に番外編として紹介した「立ち絵を光らせる」はリプレイ動画の見やすさを大きく左右するので、全ての設定を反映させた上で録画をおこないましょう。

OBSでのYouTube/Twitch配信におすすめのツール

配信内ので視聴者のコミュニティと向き合うことで、配信をより良いものにできます。
視聴者と向き合うために最もおすすめな配信ツールがCastCraftです。

CastCraftの機能を一部ご紹介します。

配信中のコメント管理ダッシュボード

  • 視聴者ごとの情報をためて、視聴者全員を覚えられる
  • 初見や常連を一目で判断できる
  • スパチャ・ビッツ等を読み上げたかどうか管理できる

CRM候補1

画面演出の「Screen」

  • 視聴者の特定のコメント・投げ銭に応じたエフェクトを画面に出せる
  • コメントを画面に横流しできる
  • 設定した画像やGIFで自由に画面演出が作れる

文字スタンプ

このような機能により、配信者が視聴者との関係を深めることができます。

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

CastCraftを利用する配信者さんの声

ぺこPさん

『こんなに便利なツールは他に無いので、配信者のみんなは1回騙されたと思って使ってみてほしい!!!』

MeeChanneLさん

『導入していたおかげでアンチの対策に非常に役立ちました。いつも本当に色々と助けられている機能があり、感謝しております。』

九条林檎さん

『知り合いの配信者が遊びに来てくれた時も見逃しにくいので、大変助かっています。』

ゆっきん【博多弁猫Vtuber】さん

『CastCraft様にはどれだけお世話になっているかわかりません!配信生活をもっと楽しいものにしてくださってありがとうございます。』

日々の配信をより良く

CastCraftが導入されているチャンネルの総登録者数は1.6億人を超えており、これまで164万回以上の配信で使われています。
日々の配信にCastCraftを導入して、より楽しい配信コミュニティを作っていきましょう。

視聴者ダイアログを開く

CastCraftを試してみる(利用無料)