2021-07-11
Toybox
Comment : 0
なんと今はUSBカメラひとつで全身トラッキングが出来る時代なのだそうです!!
この驚きの情報は、こちらの凪なぎささんのなぎなぎブログにて拝見させて頂きました。
素敵な情報を惜しみなく書いて下さってありがとうございます……!!
制作して下さっている方はyukihiko Aoyagiさんです。
素晴らしいアプリを制作して下さってありがとうございます!!
ダウンロードですが、yukihiko AoyagiさんのQiita内にリンクがあります。
USBカメラモーションキャプチャーThreeDPoseTrackerの説明 – Qiita
今回はVer.0.3.0をお借りいたしました。
ThreeDPoseTrackerの詳しい使い方は上記の方々が書いて下さっているのですが、配信用の要点を忘れないようメモしておきます。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2021/07/254e819afe8a025dfa56ae65c41b0cb2.jpg)
まず初期状態でUSBカメラを使おうとすると、この赤枠で囲った部分にモーションキャプチャー元の人物が表示されてしまうと思います。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2021/07/dfd617f0183779d807ab1495f51214fe.jpg)
これではVtuberとしての配信が行えませんので、Configurationをクリックします。
ちなみに小窓に映る部分がモーションの入力データとなりますので、後々ここに全身が映るように立つことになります。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2021/07/784c48ff7e1b4a38f9d534000280b9a5.jpg)
「Show Source Image」と「Show Input Image」という部分にチェックがありますので、これらを外します。
背景を透過してOBS等に取り込みたいという方は「Background Image File」のチェックも外します。
この3点のチェックを外して「OK」をクリック致しますと……
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2021/07/2563b59b780e37fb12f5844b3d1b690e.jpg)
背景が緑色になりました。
これでOBSを使ってクロマキーで緑色を抜けば背景が透過された状態で録画や配信を行うことができますね!
が、私のようにVtuberに興味や憧れがおありの方なら、きっとご自分用のVRMで受肉したいですよね。
その場合は「Add Avatar」をクリックします。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2021/07/d5b934644f8a035768bc1ef83af18a1b.jpg)
「File」をクリックして、アプリに追加するVRMを選択、「New Avatar」の部分に任意のお名前を入れます。
ちなみに私はSHiHO(0.01)と入力いたしました。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2021/07/0260f5740a5274729dca28d6e77f9c63.jpg)
無事に画面上にSHiHOが映るようになりました。
実際に動きを確認したい方は「Source Device」にUSBカメラが追加されているはずですので、そちらから選択して「Start Cam」をクリックすると(この時はPCに近い状態だと思いますのでちょっと大変なことになりますが)動きはじめるかと思います。
ここまでで録画・配信の下準備は完了です!
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2021/07/d7960f4ddb611402bd52307c9be5db96.jpg)
クロマキー合成とクロックパッドについては、「OBSでLive2Dをクロマキー合成で表示してみたい」のメモと同じです。
なので詳細は割愛致しますが、そちらを行うと上記の画像のような状態になるかと思います。
実際に動いてみました!
私の環境ではLow Qualityでないと動きませんでしたので、Hight Qualityで動かせる方が羨ましいです……(笑)
こちらのアプリ、いずれは商用化もするかもしれないとのことで、今後の発展が楽しみですね!!
でもこの場合マイクはどうすればいいんでしょう……ピンマイクみたいなやつを使うのでしょうか?
少なくともマイクを身に着けていないと音声入力は難しそうですよね。
改めまして素敵なアプリを開発して頂きありがとうございました!!
2019-04-30
Toybox
Comment : 0
平成最後の夜がやってまいりましたが、皆様いかがお過ごしでしょうか?
この度も秋葉原クリエイティ部の生配信つよつよ部員さんからOBSの使い方を教えて頂きました!
教えて下さった方、記事を書いて下さった方、ありがとうございました!
・OBSにDiscordをオーバーレイ表示する方法
OBSにDiscordのボイスチャットメンバーを表示したい!
そんな時には『Discord StreamKit』というものを使用して表示するようです!
私はてっきりプラグインのようなものをDLするのかと思ったら違いました。
ブラウザのURLを使って表示しているんですね!
『Discord StreamKit』のページに移動して下にスクロールしていくと……
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/1-Discord-Streamkit.jpg)
『OBS Visit: Website』というものがあるので『Connect to Discord』をクリックします!
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/235606244905afcdb058969218175c67.jpg)
そうすると別のページが開くので、Discordを起動しておいて『Install for OBS』を選択します。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/a20e03423466cf7bb53a6d3b5ee6d966.jpg)
まずはSTATUS WIDGETの項目からServerを選択します。
設定する前はとても難しいのかと思っていましたが、どうやら起動したDiscordから勝手にサーバーを読み込んでくれるようです。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/7095fe06d2648eed1c038a95d8c0e612.jpg)
次にVOICE WIDGETの項目をクリックしてVoice Channelを選択します。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/c0c3b37d5b109cb0692461cfeae6642b.jpg)
このままOBSを起動します。
今回はブラウザ上で操作した内容を表示したいので『ブラウザ』を選択します。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/b16eea6c74019786964b71dd593507cf.jpg)
そしてブラウザの下部にあるURLをコピーして、
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/92617ab099fece84b18fb39cd2925efa.jpg)
OBSのURL欄にペーストします。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/7621d32c6ead7fef1d791fc427a76fb0.jpg)
これでチャット参加者のアイコンと名前が表示されるようになりました!
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/2bba53305616edf0f6f569c55e1dbd82.jpg)
2019-04-26
Toybox
Comments : 2
色々あって生配信をお得意とするクリエイティ部の方から『OBS Studio』の使い方を教えて頂きました!
私が試しにやってみたかったのはクロマキー合成によるLive2Dの配信なのですが、そちらについてもサイトを紹介して頂きまして……本当にありがとうございます!
手順等を忘れないようにここにメモしておこうと思います!
・OBS Studio
・新・VIPで初心者がゲーム実況するには
・生放送等のコメント読み上げに合わせてLive2Dモデルに口パクをさせる方法(複数モデル対応)
サイトを教えて下さった方も、記事を書いて下さった方々もありがとうございます!
私の中では上記『OBS Studio』をDLすることとクロマキー合成の方法が繋がらなかったのですよね……。
ところがふとLive2D側で背景色が変更できることに気付き、皆様これでクロマキー合成の準備をしているのだとようやく気が付きました……。
Live2Dのモデルが表示されている部分のウィンドウを消去するとOBSが認識してくれなくなってしまうのですね。
というわけでして、ごく普通にViewerを起動するとこのように背景色が白の状態でLive2Dが表示されます。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/8f2652b251ac45586b9ee4c907ff5d68.jpg)
そうしたら別ウィンドウで『表示』から『背景色の変更』を選びまして、
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/ea41f8fd1750c76b8258ec9106b43b3e.jpg)
更に別のウィンドウで背景色を純色の緑に変更します。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/67b991e2af649742f39118a2e3f868fb.jpg)
これでLive2D側の背景色がクロマキーで抜けるようになりました!
実際にクロマキー合成を行うためにOBS Studioを起動します。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/c5c10f450f466d9170ed3279d859673a.jpg)
OBSでは画面上に配置するウィンドウ等のことをソースと呼ぶようです。
Live2DをOBS上に表示させるために、任意の名前で新しくソースを追加します。
今回はLive2Dモデルが表示されているウィンドウだけを表示したいので、ウィンドウキャプチャを選択します。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/a871877b2ed61d81af4cc3d19188035d.jpg)
まだまだ仕組みがよく分かっていないので今回はこんな感じで選択してみました。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/fd168f82445d4bc7574cf9ef958b48fb.jpg)
これでLive2DをOBS上に表示させることができました!
が、まだクロマキーを行っていないので背景色がそのまま残っています。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/c60b7584ebb37dd5084635c2731c7fba.jpg)
背景色を消すためには、追加したLive2Dのソースを右クリックして『フィルタ』を選択。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/a4b7332cc346e1c28705050b2a4a78e9.jpg)
すると『フィルタ』の中に『クロマキー』という項目があるんですね!
これはとっても便利そうです!!
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/ca95e2fd93eff37a4310b4370161e1b7.jpg)
イラスト上の緑色を含んだ部分もクロマキーに影響されるので、類似性を調整することで表示するイラストからの脱色を阻止します。
うちのエステルの場合は瞳の色が怪しかったので類似性を調節しました。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/5de5b7b3627e60b71390a9f03fca10ed.jpg)
上記でクロマキー合成は完了しましたが、このままではスクロールバー(私の場合は謎の余白も)が表示されてしまいます。
同じく右クリックして『フィルタ』を選択すると『クロップ/パッド』というものがあるので、それを使って不必要な余白を非表示にするようです。
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/c98cd74761f31317f933f16bf6306d04.jpg)
これにてクロマキー合成で背景色を透明にすること成功致しました!
![](http://awashiho.s1003.xrea.com/x/memo/wp-content/uploads/2019/04/da5e2e37cc406af3d869248ae46f779a.jpg)
これでモーション等を操作するためのウィンドウを画面上に表示せずにキャラを動かすことができます。
今回マウスのクリック音が入ってしまっているのはご愛嬌ということで……(笑)
ほんのちょっと試した程度ではありますが、喋りながらモーションを弄るのは難しいかもしれませんね……!
タイミングが掴めないと言いますか、ゲームと違って発言開始時に少し動けばいいわけでもないのでどの程度の長さのモーションが必要なのか、ループを使えばどうにか乗り越えられるのか、分かりづらいところがあります。
音声に合わせて動かしたい場合はGIF画像で書き出してしまった方がしっくりくるケースもあるのかもしれません。
ともあれ色々と教えて頂きましてありがとうございました!
大変お勉強になりました!!