Amabie Labo

「OBSでピコピコを楽に生成ツール」の使い方

2021.11.07

こんびえ〜🧜‍♂️天日江護です🐳
今回は便利ツールを作ってきたのでその使い方の紹介です⛱

制作した「OBSでピコピコを楽に生成ツール」はこちら↓OBSでピコピコを楽に生成ツール

背景

配信者の皆さんは他の配信者とコラボ時、ピコピコ※してますか〜?
僕はしてます!...が、コラボ人数が増えてくると結構手間だな〜と感じています😰

※ピコピコとは、 OBS で Discord のボイチャの反応をキャッチして喋ってる風に表現する手法です。
百聞は一見にしかずなので一度下のサイトや「OBS ピコピコ」などで検索してみてください!

具体的には、コラボ人数が増えたり、コラボの回数が増えるほど準備が大変に感じてきました...
今回はこの事象のほんの一部を解消するツールです。

コラボに伴う地獄のようなピコピコ準備作業

※Among Us などのゲームはピコピコ以外の便利ツールがありますのでそちらもご検討ください。
そのツール群でも納得できずピコピコさせたい人向けの内容になります。

使い方

すでにピコピコを試した前提で説明します。
ピコピコの大変さはブラウザソースの中の幅や高さを調べたりカスタムCSSの一部を書き換えることにあると思います。

ブラウザソースで大変な作業

これを自動生成します。
まずは[新規] の項目に登録したい名前と登録する人のDiscordのIDと登録する人の画像を入力してください。
名前は登録用なので、Discordの名前と違っても構いません。

新規登録自動登録

一度登録した人はリストから選択すると再度表示することができます。

登録済みリスト

カスタムCSSを自分なりに変更している方もいらっしゃると思います。
ルールにある通り、DiscordのIDを入れるところを「##ID##」、画像URLを入れるところを「##URL##」というルールさえ守っていただければ自由に変更可能です。
※一度編集した内容は記録するので次ブラウザを開いた時はあなたの編集したCSSが表示されます。

カスタムCSSの編集

あとは表示された「幅」「高さ」をコピペし、カスタムCSSは「CSSをクリップボードをコピー」のボタンを押せばペーストするだけで貼り付けることができます!

コピペするところ

注意点

「安全性に関する詳細」のボタンでも確認できますが、このサイトに登録したデータは登録したブラウザに保存されます。
そのため、配信用PCを買い替えたり、同じPCだけど違うブラウザで開くと何も登録されていない状態になってしまいます。
その場合は、「データをDLする」のボタンで Json ファイルをダウンロードし、利用したいブラウザで再度このサイトを開き、「データをアップする」のボタンで Json ファイルをアップロードすれば再度利用することができます。
また、一つ一つのデータを消す場合は「削除」ボタンで消せますが、ブラウザにデータを残したくなかったり全消ししたい場合は「データを消去する」ボタンで全て削除できます。

では、よき配信ライフを〜🧜‍♂️