ディスコで誰が話しているかわかんないよ～ォ
Discord strem Kit Overlayを使うんだな
はじめに
多人数配信の問題点
筆者はFPS廃人であるが、同じく廃人たち数人と夜な夜なAPEXをプレイする日々である。
固定メンツらも配信をはじめ、コラボ配信もいいよねって流れになってきた。
ただ、現状では誰が話をしているかわけがわからず、困っている。なんとかOBSの配信に、誰が話しているかを表示させたいのだが・・・。
そこで使うのが「 discord streamkit overlay」だ！
第一段階：誰が会話しているか明確に
これならば、誰が話しているか明確だぞ！
上の動画のように、左上にディスコのボイチャルームと同じ表示ができるのがこのツールの特徴だ。色々と発展型もあるのだが、それは下の方で更に紹介するぞ。
とりあえず、上の動画の状態に持っていくのが第一段階なので、設定していこう。
の順でクリックする。
そうすると、（インストールされている前提の）ディスコードで、勝手にボイチャ状態になるはずだ。
試しにこの状態で話をして、水色枠内のあなたのキャラが通話状態になっていればOK
あとは緑枠のURLをコピーしておこう。これは後で使用する。
ソース＞＋アイコン＞ブラウザの順でクリック
やったね！
第二段階：お好みの画像を跳ね回らせる
第一段階まで設定すれば「誰が話しているか」は明確になるので、実用上はこれで十分ということになる。
ただ、コラボ配信などでは相手のVTUBERの画像などを動かしたり、点滅させたりした方が、より好感度が上がるだろう。
筆者の場合、よく一緒に遊ぶ友人らのキャラクターをゆっくり化し、右下に配置している。これらのキャラが、ボイチャと同時にぴょんぴょんと跳ねるのだ。見ていて楽しい。
第二段階、ゴーッ！
やり方は上のサイトを参考にさせてもらったぞ。
そして右クリック＞リンクをコピーだ。これで画像のURLがクリップボードにコピペされた
IDの所にディスコの個人ID
画像URLのところにディスコに貼り付けた画像のURLを入力する
li.voice-state:not([data-reactid*=”ID”]) { display:none; }
.avatar {
content:url(画像URL);
height:auto !important;
width:auto !important;
border-radius:0% !important;
}
.speaking {
border-color:rgba(0,0,0,0) !important;
position:relative;
animation-name: speak-now;
animation-duration: 1s;
animation-fill-mode:forwards;
}
@keyframes speak-now {
0% { bottom:0px; }
15% { bottom:10px; }
30% { bottom:0px; }
}
li.voice-state{ position: static; }
div.user{ position: absolute; left:40%; bottom:5%; }
body { background-color: rgba(0, 0, 0, 0); margin: 0px auto; overflow: hidden; }
更に会話中のキャラクターを動かそう
上の方法だと、会話していないとき、会話しているときのキャラ絵に違いはない。
が、.speaking {の部分に別の画像ＵＲＬを入れると、話している時のみ画像を差し替えることができる。これを利用して、「話しているときはゆっくりの口が開閉する」というアニメーションgifに置き換えることで、更に可愛らしく、わかりやすく動くぞ！
かわいい！
終わりに
さて、今回はディスコードで誰が話しているかをわかりやすくする手法を紹介した。
今回の内容は実は結構手間で、
・対象者分のキャラ絵を用意する
・対象者分のソースを用意する
といった面倒さもある。ただコラボ配信するときはこの手法を使うと、絵的にも面白くなるし、誰が話しているかわかりやすいしで、とてもおすすめの方法だ。
ゆっくりが跳ね回るのはかわいいね！
ゆっくりしていってね！
コメント