【OBS】配信画面に半透明の時計・コメントを表示する

当サイトの運営する「はいしんツールキット」の中にある「デジタル時計」「コメント欄」のカスタマイズ例を紹介します。

活用するのはOBSプラグインの「StreamFX」です。

【完成例】半透明の時計を表示する

例として、ゲーム画面と時計を組み合わせてみました。ただし、時計の背景は半透明。

半透明だと時計の裏で何が起こっているのかうっすら見えるので、ゲームの視聴を邪魔しづらい設計です。

これは、YouTubeやTwitchのコメント欄を画面に表示させたい場合でも同じような見た目にできます。

これから説明する方法でぜひ試してみてくださいね。

①StreamFXを準備する

今回は、OBSの外部プラグインである「StreamFX」を活用します。

「StreamFXってなに？」という方は、以下の記事でインストール方法も含めて紹介しているのでぜひご覧ください。

②ゲーム画面を用意し、複製する

まずはゲーム画面をOBS上に表示させます。もちろんゲームでなくとも配信のメイン要素を表示するという意味です。

ゲームキャプチャ等を使い表示出させます。一般的な操作ですね。

ここからはStreamFXの「ソースミラー」を使った作業です。

ソースに「ソースミラー」を追加し、先ほどのゲーム画面を複製します。

追加出来たらOBSのプレビュー画面上でサイズを合わせます。

③複製したゲーム画面にぼかしを入れる

②で複製した「ソースミラー」にフィルタを追加します。

ソースにある「ソースミラー」の項目を右クリック→フィルタを選択します。

エフェクトフィルタに「ぼかし」を追加し、任意の設定を行います。

ぼかしタイプ・サイズをお好みの設定で問題ありません。

あまり時計やコメントの背景をぼかしたくない方は、サイズを小さめにすればよいかと思います。

設定を完了出来たら、「ソースミラー」をトリミングします。

Altキーを押しながらサイズ変更をすればトリミングができるので、お好みのサイズに変更します。

④はいしんツールキットで時計を用意し、配置する

「はいしんツールキット」にアクセスし、「シンプル時計」を準備します。もちろんコメント欄でもOKです。

フォントやフォントカラーなどの設定は何でもかまいません。

リンクをコピーしてOBS上にブラウザソースを使って表示させます。

微調整を行い、うまく表示出来れば完成です。

はいしんツールキットは便利なツールがたくさん

当サイトが提供している「はいしんツールキット」では、デジタル時計のカスタマイズのほかに、discordオーバレイやYouTubeコメント欄のデザインカスタマイズなど、オリジナルのツールを用意しています。

無料で使えるのでぜひ使ってみてくださいね！