ご相談はこちらから▶︎ お問い合わせ

こどもの描いた絵をアバターとして動かしたい!Vチューバーみたいなことをしたい!Switchゲーム実況の実現の環境を整えるまでの記録

  • URLをコピーしました!
手書きお絵かきのはるです。 情報を整理して、分かりやすく「可視化」して伝えることが得意です♫ グラレコ・動画・広告etc…グラフィックの力で”想い”や”魅力”を届けます。

こどもの描いた絵をアバターとして動かしたい!(私)

Vチューバーでゲーム実況みたいなことをしたい!(小2息子)

と言うことで、試行錯誤した結果、やっとゲーム実況できる環境が整いましたー!!!

ゲーム画面の上にアバターが出て、息子の動きに合わせて動くようになった

この状態にするまでが(私的に)けっこう大変だったので、記録しておきます。

目次

キャラクターアニメーションの制作

環境と使ったツール

キャラクターアニメーションの制作に使ったツールや環境はこちらです

<環境>

  • MacBook Pro(2022)
  • ipad Pro(2022)

<ツール>

  • プロクリエイト(お絵かきアプリprocreate)
  • フォトショップ(Adobe Photoshop)
  • キャラクターアニメーター(Adobe Character Animator)キャラクターを描いて動かす

まずはVチューバーのように動くキャラクターが必要ということで、キャラを描いて動かします。

YouTubeにも一通りの流れと作業動画アップしました。動画は順番にこの記事の中でも紹介していきます。

①ベースの絵を用意して、小学生に絵を描いてもらう

自由に描いてもらうとキャラクターアニメーターの設定などで困るので、イラストレーターをしている母(私)がベースのシルエットを用意しました。

小学生の息子には、そのベースシルエットの上にどんどんレイヤーを重ねて塗り絵をするような形で、キャラクターを作ってもらいました。

YouTubeでも解説しています

②プロクリエイトのバグ?の対応でフォトショップでデータを修正する

原因不明ですがプロクリエイトのデータをPSDにしてそのままキャラクターアニメーターに持っていくとうまくいかないので、フォトショップでその対応をします。
これは私だけ発生しているものなのか、他の方も同様なのか、謎です・・・。

③キャラクターアニメーターでリグの設定

リグの設定をします。

④キャラクターアニメーターでビヘイビアーの設定

ビヘイビアーの設定をします

これで一旦、キャラクターを動かせるようになりました!

一部まだおかしいけど、こんな感じに動きます〜!

ニンテンドーSwitchの画面をPCに出力してキャラクターアニメーターと連動させる

まずセッティングです!PCにスイッチの画面が映るようにします

<出力に使ったもの/購入>

  • キャプチャボード(お値段が高いほどキレイらしいけど、一旦3000円くらいのを買ってみた)

配線はSwitch-HDMI→(IN)キャプチャボード←USBかTypeCでPCとつなぐ。
配線については、検索すると親切な解説ページが複数出てきたのでそれらを参考にセッティングしました。
ちなみにスイッチは電源につないでないとPCに画面が映りませんでした。ご注意を。

<インストールしたもの>

  1. OBSをインストール(ニンテンドースイッチの画面をPCに出力して録画したり配信するため)
  2. NDI Toolsをインストール(Character AnimatorとOBSを連動させるため)
  3. OBSのプラグインをGitHubのページからインストール(OSに合わせたファイルをダウンロード)

このインストールや設定に関しては、すけこむさんの記事(Adobe Character AnimatorとOBSでライブ配信する方法)をご覧ください!とても親切な記事で解説してくださっていて、分かりやすかったです。

キャラクターアニメーターと連動させてSwitchのゲーム実況ができる環境が整った・・・!

これで、環境が整いましたー!長かった〜。

ちょっと時間はかかりますが、順番にひとつづつやっていくと、なんとかできました!

やってみたい!と言う方はぜひチャレンジしてみてくださいね。
PCはハイスペックなものをおすすめします😂(古いPCでしたら、何度も止まったり落ちたりで作業になりませんでした〜)

キャラクターは手が変な方向に曲がったりと、まだまだ調整が必要な感じですが。。。

クヲリティよりまず1回やってみる!と言うことで、ゲーム画面に載せるところまでは実現できました!

目的に合わせた可視化をご提案します。イラスト、グラレコ、図解、似顔絵、動画・アニメなど、手書きを使ったご提案ならお任せください!

ご相談・お見積もりはメールフォームまたはLINEから

サービス・料金はこちら

この記事が気に入ったら
いいね または フォローしてね!

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!
目次