OGLOG

おぐらのぶろぐです。VDRAWのマニュアルを兼ねています。

ウインドウキャプチャでSAIがキャプチャできない時の解決策

こんにちは。マシュマロでSAIがウインドウキャプチャできない報告がありましたので、解決策をこちらに書いておきます。
要約すると↓のツイートの通りですが、一応丁寧に説明していきますね。

追記:SAI2はウインドウキャプチャに対応していません。
SAI2をどうしても使う必要がある場合、デスクトップキャプチャで運用してください。
SAI2自体が現在も開発途中のソフトウェアなのでこういった現象は致し方なし…

SAI2の配布ページにも

ペイントツールSAI Ver.2 の中途版を公開いたします。
製品化前の開発段階のものであり画面や動作は今後も変更される場合があります。
不具合が出る可能性もありますので安定したソフトウェアを必要とされる方は決してこのバージョンを使用なさらないでください。
また、このバージョンはコンピュータの基本的な知識や操作を習得されている方を対象としています。
製品版と同様のユーザーサポートは行っておりませんのであらかじめご了承ください。

とありますので、今後SAI2の開発状況によっては改善される可能性はあります。


SAIのインストールフォルダを開く

SAIは普通のプログラムと違って、Program Filesフォルダには入っていません。
デフォルトのインストール場所は C:\PaintToolSAI です。 f:id:OGOG_Ogura:20200228002732p:plain

sai.exe のプロパティを開いて設定変更

PaintToolSAI内のsai.exeを右クリックし、プロパティを開きます。

f:id:OGOG_Ogura:20200228003144p:plain

「互換性」のタブを開き、赤枠の部分を画像の通りに設定します。
設定したら「OK」でプロパティを閉じます。

VDRAW側でウインドウキャプチャできるか確認

SAIとVDRAWを開き、VDRAWでウインドウキャプチャできることを確認してください。

f:id:OGOG_Ogura:20200228002644p:plain

これでキャプチャできなかった場合、お手数ですがPC環境などの情報を報告していただけると幸いです。

VDRAWでPS4コントローラーを使うとリップシンクが切れる問題の解決策

こんにちはおぐらです。 いつもVDRAWをご利用いただきありがとうございます。

このたびPS4コントローラーの仕様とUnityの相性問題により、
VDRAWのリップシンクがプレイ中に突然反応しなくなるという現象を確認しました。
f:id:OGOG_Ogura:20200125224236p:plain

PS4コントローラーを使ってゲーミングスタイルを利用している方に同様の現象が起こる可能性がありますので、各自対応いただければと思います。

なぜリップシンクが止まるのか

PS4コントローラー(以下PS4コン)には、ゲームパッド以外にもオーディオデバイス(スピーカーとマイク)がついています。
このPS4コン内臓のマイクもPCには認識されますが、PS4コンのマイクデバイスはUnity側ではマイクとして認識できませんでした。

さらに厄介なことに、PS4コンのマイクがPCに認識された瞬間、Unityはほかのマイクも一切認識できない状態に陥ってしまいます。
Unityがマイクを何も認識できない=音声入力が取得できない ので、リップシンクが止まってしまうわけです。

VDRAWを再起動すると直りますが、それでも一定時間経つとまたリップシンクが止まることがあります。 (PS4コンのUSB接続の接触の問題か、PS4コンのオーディオデバイスは少しケーブルがズレただけで認識が外れて再認識されることがあるのでいつ認識されるかわからない)

解決方法:PS4コンのオーディオデバイスを無効化する

PS4コンをPCに有線接続した状態で、PCのコントロールパネルを開いてください。
f:id:OGOG_Ogura:20200125221818p:plain

「ハードウェアとサウンド」から、「デバイスマネージャー」を起動します。
f:id:OGOG_Ogura:20200125221928p:plain

バイスマネージャーの「サウンド、ビデオ、およびゲーム コントローラー」の部分を展開します。
f:id:OGOG_Ogura:20200125222210p:plain

この中に「Wireless Controller」があるので、右クリックして「デバイスを無効にする」をクリック。
確認のダイアログが出ますが、「はい」でOKです。
f:id:OGOG_Ogura:20200125222652p:plain

無効化すると「Wireless Controller」のアイコンが変わります。
f:id:OGOG_Ogura:20200125222807p:plain

これでPS4コンのオーディオデバイスがPCに認識されることはなくなり、VDRAWでリップシンクが止まることもなくなります。
有効化したい場合は同じ手順で有効化できます。

VDRAWとTHE SEED ONLINEを連携させよう

こんにちはおぐらです。
いつもVDRAWをお使いいただきありがとうございます。

VDRAWバージョン1.5.0から、Webサービス「THE SEED ONLINE」との連携ができるようになりました。
THE SEED ONLINEは3DモデルのHubサービスで、このサイト上にモデルを登録しておくと
連携アプリ内で使うことができるようになるというものです。

使うとどんな利点があるのかというと、こんな感じ。

  • ローカルファイルからVRMを読み込む手間が省け、モデル変更が楽になる
  • 他のユーザーが公開しているモデルを自分のアイテム枠に取り込んで簡単に使用することができる
  • 背景の3Dモデルを変更できるようになる
  • スマホアプリカスタムキャストで作成したキャラクターを使える

f:id:OGOG_Ogura:20191112222221p:plain

カスタムキャストはこちらからどうぞ! THE SEED ONLINEへのモデルアップロード手順などについては公式の案内を参照してください。 customcast.jp

また、THE SEED ONLINEから取得したモデルはPC上には保存されないので、モデルデータ自体も安全に扱うことができます。

目次

THE SEED ONLINEのアカウントを作成してログインする

まずはTHE SEED ONLINEのアカウントを作成しましょう!
Twitterniconicoなどのアカウントがあれば簡単に作成、ログインすることができます。

seed.online

アカウントを作成し、ログインすると自分のアカウントが持つアイテム枠が表示されます。
f:id:OGOG_Ogura:20191112220643p:plain 「シードさん」という無課金アバターみたいなキャラクターがいますね。
これは初期アイテムです。消せませんが、そのうち消せるようになるという噂。

アイテム枠は初期状態で60枠あり、「自分でアップロードしたアイテム」である投稿枠が30枠、「誰かのアイテムを取り込む」ための取り込み枠が30枠あります。

VRMモデルをアップロードする

VRMモデル自体を持っているならば、自分のモデルをアップロードしてみましょう!
持っていない人はここは読み飛ばして構いません。

右上の「アップロード」ボタンを押してアップロード画面に移動します。
f:id:OGOG_Ogura:20191112222413p:plain

利用規約をよく読んで、チェックボックスにチェックを入れます。
ドロップダウンメニューが「キャラクター(VRM)」になっていることを確認し、VRMファイルをドラッグ&ドロップ!
これでモデルがアップロードできます。

f:id:OGOG_Ogura:20191112222601p:plain

アップロードが終わると、情報登録画面に遷移します。

f:id:OGOG_Ogura:20191112222707p:plain

イコン画像を撮影したり、アイテムの説明文を編集できます。(VRMのライセンス情報は編集できません)
諸々の設定が終わればアップロード完了です!

カスタムキャストの場合のモデルアップロード

カスタムキャストは、スマートフォンアプリから直接THE SEED ONLINEにモデルをアップロードすることができます。
f:id:OGOG_Ogura:20191114140055p:plain

下のメニューにある「VRM出力」からTHE SEED ONLINEの投稿枠にアップロードすることができます。 詳しい手順はアプリの案内を参照してください。(アプリの仕様変更があったら書き換えるのが面倒なので)

他のユーザーが公開しているモデルをアイテム枠に取り込む

THE SEED ONLINEには、他の誰かがアップロードしたモデルを自分のアイテムボックスに取り込む、という機能があります。 自分が使いたいと思った公開アイテムがあれば、それを取り込んで使うことができます。

では、公開アイテムを探してみましょう。
アイテムボックス画面の右上、「公開アイテム一覧を見る」をクリックすると、THE SEED ONLINEで公開されているモデルの一覧が出ます。

f:id:OGOG_Ogura:20191112222903p:plain

ドロップダウンメニューから「キャラクター(VRM)を表示」を選択すると、THE SEED ONLINEにアップされているモデルの中からキャラクターモデルのみを表示できます。(そのほかのカテゴリには小道具、環境があります。)

f:id:OGOG_Ogura:20191112223456p:plain

気に入ったモデルがあればクリックして、「公開アイテム詳細」のページを表示します。

f:id:OGOG_Ogura:20191112223233p:plain

右にある「取り込む」ボタンを押せば、自分のアイテムボックスに公開アイテムが保存されます。
(公開アイテムのアップロード者が非公開にしたり、削除した場合は自分の取り込み枠からも削除されます)

f:id:OGOG_Ogura:20191112223343p:plain

これで連携アプリでモデルを使えるようになりました!

VDRAWでTHE SEED ONLINEのアカウント連携を行う

では、VDRAWでTHE SEED ONLINEと連携してみましょう。
トップ画面の「外部サービスから読み込む」をクリックし、「THE SEED ONLINE」のボタンを押してください。

ブラウザが開き、認証画面が表示されます。

f:id:OGOG_Ogura:20191112230153p:plain

連携許可をすると、「code」と「state」が表示されます。
この文字列をVDRAWに表示された画面に入力し、「連携」ボタンを押してください。
(入力欄の隣にあるペーストボタンを使うと便利です)

f:id:OGOG_Ogura:20191112223954p:plain

連携が完了すると、自分のTHE SEED ONLINEのアイテムボックスに入っているアイテムが表示されていきます。
(THE SEED ONLINE上のカテゴリが「小道具」のものと、VRMのライセンスで利用が許可されていないアイテムは表示されません。)

f:id:OGOG_Ogura:20191112224136p:plain

キャラクターモデルを使う

試しに、前の行程でアイテムボックスに登録したキャラクターモデルを選択してみましょう!

クリックするとダウンロードが始まり、モデルのプレビューが表示されます。
(Auto DownloadのチェックボックスがONの場合) f:id:OGOG_Ogura:20191112224331p:plain

「決定」ボタンを押すと、いつものVRMライセンス画面が表示され、同意するとモデルが使用できるようになります。

背景モデルをTHE SEED ONLINEで取り込む

THE SEED ONLINEと連携したことで、普段はバーチャルキャストで使える3Dの背景モデルがVDRAWでも使えるようになります。
(一部のギミックや物理挙動、スクリプトは動作しません)

THE SEED ONLINEの公開アイテムから、「環境」に設定されているGLBファイル、またはVCIファイルをアイテムボックスに取り込みましょう。

f:id:OGOG_Ogura:20191112224455p:plain

取り込んだ環境アイテムは、VDRAWのモデル一覧に緑の枠で環境アイテムが表示されるようになります。

f:id:OGOG_Ogura:20191112224724p:plain

クリックすると背景モデルをダウンロードして、現在の背景を置き換えることができます。 アニメーションが設定されているGLBやVCIは、AnimationのチェックボックスをONにしてダウンロードするとアニメーションも再生されます。

f:id:OGOG_Ogura:20191112224945p:plain

3D背景の位置や向きを変える

VDRAWのクイックメニューにある「背景設定」の中に、3D背景の位置や向きを変えられるスライダーがあります。
少し操作しづらいかもしれませんが、一応これで向きなどを好みに設定できるようになっています。

f:id:OGOG_Ogura:20191112225103p:plain

ところで配信ってどうやるの?

カスタムキャストのユーザーの方はスマホから配信していたのでPCでの配信に馴染みがないかもしれません。
ニコ生で放送する場合、「N Air」というソフトを使って、パソコンのアプリの画面を取り込んで配信することができます。

n-air-app.nicovideo.jp

詳しい使い方は偉大な先人の皆様がいろいろ記事を書いてくださいっているのでこのへんを読んでみてください。

w.atwiki.jp

N Airニコニコ生放送に特化しているので何かと便利です。

VDRAWの画面を取り込む方法をざっくり説明します。
まず最初に、PC上でVDRAWを起動しておいてください。 「ソース」の「+」をクリックして、ソース選択画面を表示します。 f:id:OGOG_Ogura:20191114140931p:plain

ソースは、「ウインドウキャプチャ」を選択してください。 f:id:OGOG_Ogura:20191114141106p:plain

少しすすめると、どのウインドウを取り込むかを選択する画面になります。
ここで、あらかじめ起動しておいたVDRAWがあるはずなのでそれを選択します。 f:id:OGOG_Ogura:20191114141704p:plain

すると、VDRAWの画面が放送画面のレイアウトに表示されます。 ウインドウの大きさは四方にある□をドラッグして変えられます。 ちなみに、「ウインドウキャプチャ」は、 VDRAWが他のウインドウの下に隠れてしまってもしっかりキャプチャしてくれるので安心です! f:id:OGOG_Ogura:20191114141819p:plain

あとはニコニコのアカウントでログインした状態で配信開始!です!
そのへんの詳しいことはさっき貼った記事とかで見てください!

VDRAWにNintendo Switchの操作を反映させる方法

こんにちはおぐらです。
いつもVDRAWをご利用いただきありがとうございます。

前回はPS4コントローラーでPS4ゲームの操作を反映させる方法を紹介しました。
今回はその応用編、Switchの操作を反映させる方法を紹介します。
方法を発見してくださったユーザー様に感謝…!
テトリス99とかできるようになりますよ。
f:id:OGOG_Ogura:20191008222210p:plain

簡単にやることを説明すると、
「SwitchをPS4コントローラーで操作して、VDRAWはPS4コントローラーの入力を読み取る」
という形になります。

ただし、今回のこの方法はPS4やSwitchでは公式にサポートされていない製品を使用する、裏技的なものとなります。
くれぐれも自己責任でお願い致します。

必要なもの

  • PS4コントローラー(PS4本体は不要)
  • MicroUSBケーブル(PS4コントローラーとPCを接続する)
  • Nintendo Switch本体(ドックを使用するのでSwitch Liteは不可)
  • HDMI映像キャプチャーデバイス(Switchの映像をPC上に映す)
  • SwitchでPS4コントローラーを使えるようにする変換アダプター

5つ目に見慣れないものがありますね。これが今回のキモです。
これは、Nintendo SwitchのUSB端子に接続するBluetoothレシーバーのようなもので、Nintendo SwitchPS4コントローラーが使えるようになるデバイスです。

Amazonで「Switch PS4コントローラー 変換」など検索すると大きめのUSBメモリみたいなものが2,000円~4,000円くらいの相場で出てきます。
いろいろ種類がありますが、中には怪しげな言語の製品もあるので慎重に選びましょう。 ちなみに私はレンガブロックみたいなやつ(8BitDo)を選びました。

f:id:OGOG_Ogura:20191008213302p:plain

Switchのゲームにはジャイロセンサーを使用して遊ぶものがありますが、PS4コントローラーはジャイロが効かなかったり、精度が悪いなどの情報あります。ジャイロを多用するゲームのプレイには向かないかもしれません。

SwitchとPS4コントローラーを接続する

Nintendo SwitchのドックのUSB端子にコントローラーの変換アダプターを挿します。

変換アダプターの説明書に従って、SwitchにPS4コントローラーを接続してください。
ものによってやり方は異なるかと思いますが、だいたいは

  1. 変換アダプターをペアリングモードにする

  2. PS4コントローラーのPSボタンとSHAREボタンを長押ししてペアリングモードにして接続

という手順です。

PS4コントローラーをPCに接続する

PS4コントローラーとSwitchが接続できていることを確認したら、次はPCへの接続です。
MicroUSBケーブルでPS4コントローラーとPCを接続します。
必ずSwitchとのペアリングが済んだ後にPCと接続してください。

また、PC側にPS4コントローラー以外のコントローラーが接続されていると、VDRAWで正しく認識されないことがあります。注意してください。

※重要※

PS4コントローラーのオーディオデバイスを無効化していないと、リップシンクアバターの口パク)が動かなくなることがあります。 解決方法はこちらを参照してください。

ogog-ogura.hatenablog.jp

VDRAWで操作が反映されることを確認する

VDRAWを起動し、スタイル変更メニューを開きます。 Gaming Styleのボタンの下にある、「Direct Input Mode」のチェックボックスにチェックを入れてから、Gaming Styleのボタンを押してください。 f:id:OGOG_Ogura:20191008214052p:plain

PCに接続されているPS4コントローラーの操作がVDRAW上のアバターに反映されていれば成功です。
f:id:OGOG_Ogura:20191008214213p:plain

ゲーム画面を映す

アマレコTVやOBSなど、外部入力デバイスの映像を映すソフトでSwitchのゲーム画面をPC上に映せばVDRAWにも映ります。

f:id:OGOG_Ogura:20191008223204g:plain

3Dモデル「リル」説明書

概要

↓こちらで販売されているデータの概要です。

オリジナル3Dモデル「リル」【4992ポリゴン】

内容物

  • VRM出力向け調整済みモデル:Lilou_for_VRM.blend

    • VRMファイルの容量削減のため、頭と身体は別パーツに分かれています。
    • 髪に揺れボーンが入っています。
    • マテリアルやテクスチャは1つです。
    • VRChat向けの裏面ポリゴンはありません。
  • OculusQuest版VRChat向け調整済みモデル:Lilou_for_QuestVRC.blend

    • 1つのオブジェクトのみとなり、一部のポリゴンが削除されています。また、スカートの裏側などに裏面用ポリゴンが追加されています。(Quest版VRCは裏面描画できるシェーダーが使えないため)
    • 揺れボーンは無く、VRChatのアバター要件対応のためUpperChestボーンが削除されています。
    • アイトラッキング対応のため追加のボーンやシェイプキーが存在します。
    • マテリアルやテクスチャは1つです。
  • マスターモデル:Lilou_Master.blend

    • パーツごとにオブジェクトやマテリアル、テクスチャが分かれています。
    • UV情報を2種類持っています(後述)
    • VRChat向けに用意した裏面ポリゴンが一つ一つ別オブジェクトとして存在します。
    • ボーン構造はVRM向けモデル+VRChatのアイトラ用ボーンとなっています。
  • 調整済みVRMモデル:Lilou_VRM.vrm

  • VRM書き出しに使ったunitypackage:Lilou_SetUp_forVRM.unitypackage(UniVRM必須)

  • OculusQuest版VRChat向けunitypackage:Lilou_SetUp_forVRC.unitypackage(VRCSDK必須)

使用するBlenderのバージョンは2.79です。

BlendデータのテクスチャやUVについて

Blenderデータに設定されたテクスチャは相対パスで紐付けられているため、テクスチャやモデルのデータを別のフォルダに移動させると正しくテクスチャが読み込めなくなります。

余談ですが、.blendファイル内には画像データを埋め込むこともできます。 f:id:OGOG_Ogura:20190917154425p:plain
テクスチャの「ソース」の左端にあるボタンを押すと画像をモデルデータに埋め込むことができます。
これはこれで便利だったり不便だったりします。


「マスターモデル」はUV情報を2つ持っています。
これは、パーツごとのテクスチャ編集用UVと、テクスチャを1枚で出力するためのUVです。

f:id:OGOG_Ogura:20190917142501p:plain

テクスチャデータは大まかなパーツごとに用意されていますが、Blender上のベイク機能で1枚のテクスチャに焼き込むことが可能です。こちらについては別記事でその手順を紹介します。

自分ひとりで遊ぶぶんには負荷はあまり考えなくてもいいですが、相手がいる場合は負荷を軽くする努力も怠らないようにしましょう。

FBXをUnityに持っていく際の注意

そのままのボーンマッピングではあごのボーンに揺れものボーンが割り当てられることが多いので必ず確認してください。

Unityプロジェクトに読み込んだFBXファイルを選択し、Animation TypeをHumanoidにしてApply。
その後、InspectorのConfigureからボーンマッピング画面を呼び出します。 f:id:OGOG_Ogura:20190919044102p:plain

「Head」のマッピングを表示し、「Jaw」はカラッポ、つまりNoneにしてください。 f:id:OGOG_Ogura:20190919044304p:plain

ハイポリ化について

マスターデータには、一部のパーツを除いて「Subsurfモディファイア(細分割曲面)」が最初からついています。
が、はじめは非表示になっているのでモデルには適用されていません。
「SubSurf」の目のアイコンをクリックしてモディファイアを表示状態にすると3Dビューのモデルのポリゴンがなめらかに分割されます。
f:id:OGOG_Ogura:20190917154722p:plain

↓こんな感じにポリゴン数が増えてなめらかになります。(わかり易さ重視でワイヤーフレーム表示にしています) f:id:OGOG_Ogura:20190917180629p:plain

モディファイアの設定で「細分化」の「ビュー」の数値を増やすとさらにポリゴンが分割されてなめらかになります。
f:id:OGOG_Ogura:20190917154936p:plain

出力する時に「モディファイアーのレンダー設定を使用」にチェックが入っていると、モディファイアの「ビュー」ではなく「レンダー」の数値でポリゴンが分割されます。注意してください。
3Dビューと同じ見た目を出力したい場合はチェックを外すことをおすすめします。 f:id:OGOG_Ogura:20190917141757p:plain

マスターデータは既に各辺にクリース情報が設定してあり、SubSurfを使用しても見た目に違和感がないように調整してあります。辺のクリースを変更すると見た目が崩れる場合がありますのでご注意ください。

※辺のクリースとは、細分割時になめらかな曲線にするか、尖ったエッジを維持するかの割合のことです。辺のクリースを+1.0にした場合、細分割されてもその辺は丸まらずにシャープな辺となります。


VRMについて

同梱VRMファイルの編集や軽量化についての情報です。

VRMを編集したい

VRMを編集したい場合、モデルのメッシュを直接編集する作業が発生しない改変であれば、UnityEditor上で可能です。

まず、UniVRMのunitypackageを入れたプロジェクトを用意してください。

方法1

Assetsフォルダ以下にVRMファイルをドラッグ&ドロップすると、Prefabが生成されます。
Prefabをシーン上に配置して、インスペクタから設定が行えます。

方法2

VRM/Lilou_SetUp_forVRM.unitypackageをインポートすると、付属VRMモデルを書き出すのに使ったアセットが読み込まれます。
Assets/OguLabo/Lilou/Scene/VRMSetUp.unityのシーンを読み込むと、モデルの情報を編集できるようになります。


Unity上でできるのは

  • テクスチャやマテリアルの差し替え
  • 表情キーに登録するBlendShapeの組み合わせ
  • 目の可動範囲設定
  • 一人称視点・三人称視点でのメッシュの表示設定
  • メタデータの書き換え(規約の範囲内で設定すること)

このあたりです。メッシュ形状の変更などはBlender/Lilou_for_VRM.blendBlenderで編集してください。
VRMで使用できるシェーダーはStandardMToonUnlitなどと限られています。

中でもMToonはアウトライン、リムライト、MatCap、ノーマルマップ、UVスクロールアニメーション、Emissionなど設定が豊富なトゥーンシェーダーです。

VRMモデルの軽量化のコツ

BlendShape(シェイプキー)が含まれるメッシュは、なるべく別オブジェクトとして分離しておき、分割後、BlendShapeで頂点が移動しない方のオブジェクトのシェイプキーは削除しておくとVRMの容量が削減できてロードに時間がかからなくなります。
具体的には、顔(頭)と体のメッシュは別々のオブジェクトに分けておくといい感じです。

Lilou_for_VRM.blendVRM向けの構成になっています。
BlendShape(シェイプキー)が存在するのは「Head」オブジェクトのみなので、Headが独立しています。
f:id:OGOG_Ogura:20190917183712p:plain


VRChat向けデータについて

VRChat向けのデータの改変や出力方法、注意点などの情報です。

OculusQuest版VRChatで使用する

OculusQuest版VRChatでは、アバターの要件に一部制限があり、アバターの仕様によってアバターパフォーマンスランクが決められます。
付属しているUnitypackageのモデルはその中でも最も軽量なランクであるExellent判定となっています。

が、結構ギリギリなラインでの判定ですので、これ以上頂点数を増やしたり、アクセサリを追加するなどするとアバターパフォーマンスランクが下がってしまいます。
一定ラインの重さを超えてしまうと、自分のアバターが相手から見えなくなることもあります。

テクスチャの色変更や頂点数を変えないメッシュ形状の変更であれば大丈夫です。
ボーンや頂点数を追加したり、オブジェクトやマテリアル数が増えるとアバターパフォーマンスランクが下がります。

テクスチャを改変する

本モデルは、マスターデータは複数のパーツ別テクスチャに分かれていますが、Quest版VRChat向けモデルはマテリアルやテクスチャが1つにまとめられています。

テクスチャの改変を行いたい場合

  • A: パーツ別テクスチャを編集し、パーツやマテリアルが分かれたままexportする
    (画像編集難易度:低 Blender操作難易度:低 モデルの負荷:高)
  • B: 1枚にまとまった画像を直接改変する
    (画像編集難易度:高 Blender操作難易度:低 モデルの負荷:低)
  • C: パーツ別テクスチャを1枚の画像にまとめて出力する
    (画像編集難易度:低 Blender操作難易度:高 モデルの負荷:低)

という主に3種類の改変方法があります。
Aの場合はQuest版VRChatを利用する場合はおすすめしません。 Skinned Mesh Renderer の数が7程度に増え、アバターパフォーマンスランクが Very Poor になってしまいアップロード不可になります。(PC版は Medium ランク程度となり、アップロードは可能)

Cの場合は小さい画像を編集する必要がないため、理想的な見た目を作りやすいです。
その分手順が複雑になるため、こちらは別途記事を用意しました。
https://ogog-ogura.hatenablog.jp/entry/2019/09/17/190406

Quest版VRChat向けにモデルを書き出す時の注意

Quest版VRChatはモデルの制限が厳しく、特にオブジェクトやマテリアル数の制限が厳しいです。
モデルを書き出す時は、必ず一つのオブジェクトに統合してFBXを書き出してください。オブジェクトをShiftキーなどで複数選択してからCtrl+Jで統合できます。

ここは VRMの軽量化と相反する概念 になるので覚えておくとちょっと便利です。

  • Quest版VRChat:オブジェクトを一つに統合しないとアバター制限に引っかかる
  • VRM:シェイプキーを持ったオブジェクトとそうでないオブジェクトを分けておくとファイルが軽くなる

Lilou_for_QuestVRC.blendがQuest版VRChat向けの構成になっています。
こちらはVRM向けのデータとは異なり、すべてのメッシュが「Body」に集約されています。 f:id:OGOG_Ogura:20190917183831p:plain

VRChatにアップロードする際は、Quest用ならBuild TargetをAndroidにSwitch platformするのをお忘れなく。


疑問・質問

疑問・質問などはTwitterマシュマロにどうぞ。

リルで学ぶテクスチャベイク(複数枚→1枚)のやり方

この記事では3Dモデル「リル」を使って
複数枚のテクスチャを1枚にまとめる方法を書いていきます。

想定する状況としては、パーツ別にわかれたテクスチャデータを編集したけど、アバター制限の対応や負荷軽減のためにテクスチャを他のテクスチャとまとめて1枚にしたい というものです。

モデルはこちら↓

データ内容おさらい

マスターデータBlender/Lilou_Master.blendはふたつのUVを持っています。
f:id:OGOG_Ogura:20190917142501p:plain

  • UV1(UVMap):テクスチャ編集用ファイル向けのUV
  • UV2(UVMap_Bake):テクスチャを1枚にまとめるためのUV

UV1で設定したテクスチャをUV2の配置で新たに書き出すことを「ベイク」と言います。
ここではそのベイクのやり方を説明します。

UV1はパーツ別に分かれたUV配置です。これ↓は服のUVです。顔や髪、アクセサリのUVはありませんね。
f:id:OGOG_Ogura:20190918194948p:plain

一方のUV2は、顔、髪、身体、アクセサリなどのすべてのパーツのUVが1枚画像にまとまるように配置されています。
f:id:OGOG_Ogura:20190918195216p:plain

0. 概要

再びになりますが、ここでは「パーツの一部のテクスチャを編集したあとで、複数のテクスチャを1024px*1024pxのテクスチャ1枚にまとめる」という作業を説明します。
解像度については別に1024*1024でなくてもなんでもいいですが…
使用するのはBlender2.79です。2.80は私が使ったこと無いのでフローがわかりません。同じことはできるはず。

1. テクスチャを編集する

ここでは例として、リルの服の色を変えてみます。
まず、upperbody_edit.psdを編集した画像を用意します。
今回は一部の色調を変更し、青っぽい服に変えた画像を用意しました。
f:id:OGOG_Ogura:20190904204151p:plain
このテクスチャはTexture/SampleTexture01.pngに用意してあります。
まずはこのテクスチャで試してみましょう。

2. Blenderファイルを複製して開く

マスターデータを複製してBlenderで開きます。
※このデータは書き換えるので、必ずファイルを複製してから開いてください! f:id:OGOG_Ogura:20190904204253p:plain もし原本を編集して保存してしまった場合はBOOTHから再度ダウンロードしてください。

画面を↑の画像と同じようにするには、シェーディングを「マテリアル」にし、プロパティにある「ワールド」の環境照明の「エネルギー」を1.0に設定してください。
(多分最初から設定されているのでやらなくてヨシ)
f:id:OGOG_Ogura:20190904204704p:plain

3. 上半身のモデルを選択して、マテリアルのテクスチャを変更する

リルの上半身オブジェクトを選択して、「マテリアル」のタブを開き、UpperBodyマテリアルを選択します。
選択したら、マテリアルタブの隣、「テクスチャ」のタブを開きます。
ちなみにこの「マテリアル」や「テクスチャ」のタブがあるエリアは「プロパティ」と言います。覚えておきましょう。
UpperBodyマテリアルの画像が表示されているので、「画像」の「ソース」にあるファイルを変更します。
f:id:OGOG_Ogura:20190904205701p:plainf:id:OGOG_Ogura:20190904205911p:plain 変更したら、3Dビューのモデルのテクスチャが変わっていることを確認してください。
f:id:OGOG_Ogura:20190904205748p:plain 

4. すべてのオブジェクトのUVマップを変更する

プロパティの「マテリアル」タブの左隣に「データ」のタブがあるので開いてください。
このタブを下までスクロールすると、「UVマップ」という項目があるので、「UVMap」と「UVMap_Bake」があることを確認してください。
f:id:OGOG_Ogura:20190904210022p:plain
通常だと「UVMap」が選択されていますが、「UVMap_Bake」をクリックしてみてください。
UpperBodyオブジェクトのUVマッピングがベイク用の配置になったため、3Dビューでの見た目が変わります。(もう一度「UVMap」を選択すると元に戻ります)
f:id:OGOG_Ogura:20190904210056p:plain
これをすべてのオブジェクトに対して行います。
「UpperBody」のほか、「Body」「BookHolder」「Hair」「LowerBody」「Pin」「Zipper」の7つのオブジェクトすべてのUVを「UVMap_Bake」に切り替えてください。
「~_Ura01」とついているオブジェクトはVRChat向けの裏面描画用オブジェクトですが、ベイクする上では不必要なのでそのまま無視してください。削除しても大丈夫です。
すべてのUVを変更すると、こんな見た目になります。怖いですね。
f:id:OGOG_Ogura:20190904210223p:plain

5. オブジェクトをすべて結合する

3Dビューの中にマウスカーソルを置いた状態でAキーを押して、オブジェクトをすべて選択します。Aキーは「全選択/解除」のショートカットキーです。
すべてのオブジェクトを選択した状態で、Ctrl+Jを押してひとつのオブジェクトにまとめます。
f:id:OGOG_Ogura:20190904210414p:plain
この画像では「Body」になっていますが、最後に選択したオブジェクトによってここの名前は変わります。別にどんな名前でも大丈夫です。

6. オブジェクトモードから編集モードにする

現在3Dビューは「オブジェクトモード」になっていますが、これを「編集モード」にしてください。(Tabキーで切り替え可能)
f:id:OGOG_Ogura:20190904210549p:plain

7. すべての頂点を選択する

編集モードの状態でAキーを押し、すべての頂点(ポリゴン)を選択した状態にしてください。
f:id:OGOG_Ogura:20190904210612p:plain

8. UV/画像エディターを開く

UV/画像エディターを開きます。3Dビューの左下にある三角をドラッグして3Dビューを2つに増やします。
f:id:OGOG_Ogura:20190904210956p:plain
増えたビューは、同じ三角を逆方向にドラッグすることで閉じることができます。
増やした方のビューを「UV/画像エディター」に切り替えます。
f:id:OGOG_Ogura:20190904211402p:plain
f:id:OGOG_Ogura:20190904212451p:plain
こういう画面になればOKです。

9. ベイクする画像を新たに作成する

UV/画像エディターの下部にある「+」をクリックし、新規画像を作成します。
名前はなんでもいいですが、今回は「BakeSample」としておきます。
f:id:OGOG_Ogura:20190904212712p:plain
幅、高さは1024にします。もっと高解像度でベイクした場合はもっと大きい数値でも大丈夫です。
できればサイズは2のべき乗(1024,2048,4096...)にしておきましょう。
「OK」をクリックすると真っ黒な画像が生成されます。

10. 作成した画像にテクスチャを焼き込む準備をする

プロパティに戻り、今度は左端のカメラアイコンの「レンダー」をクリックします。
ここを下までずっとスクロールしていくと、「ベイク」という項目があります。
「ベイクモード」を「テクスチャ」にしてください。
f:id:OGOG_Ogura:20190904212850p:plain

11. テクスチャを焼き込む(ベイク)

では、「ベイク」のボタンを押してみましょう!
UV/画像エディターの方の画像にテクスチャが書き込まれているはずです。
f:id:OGOG_Ogura:20190904212929p:plain
UVの配置から少しはみ出してテクスチャが書き込まれているのが分かるでしょうか?
このはみ出し量は、先程操作したプロパティにある「余白」の数値を調整することで変化します。
はみ出しすぎて他のパーツに違う色が書き込まれてしまうこともまれにあるので、ここで調整できることを覚えておきましょう。
はみ出させたくないからといって、0pxにすると今度は必要な部分に色が乗らないことがあるので、自分で何度かベイクを試していい感じの数値を見つけましょう。

12. ベイクした画像を保存する

今の状態では、画像はBlender上に一時的に存在するだけで、画像ファイルにはなっていません。
UV/画像エディターの下部にある「画像*」をクリックし、「画像を別名保存」してあげましょう。
f:id:OGOG_Ogura:20190904213019p:plain
これで画像ファイルの書き出しができました。

13. 重なったUVでおかしくなったベイク箇所を確認する

ベイクして保存した画像をよく見ると、右下の髪の毛のテクスチャの部分がなんだかおかしく見えませんか?
f:id:OGOG_Ogura:20190904213209p:plain これは、ベイク用のUV配置が重なってしまっていたため、複数のポリゴンのテクスチャが重なって書き込まれてしまったからです。
本来ベイクをする時は、UVはなるべく重ねない方がいいのですが…髪の毛でたくさんUVの面積を占めるわけにもいかないので、UVを重ねています。

14. 正しいテクスチャに直して書き出す

画像編集ソフトでちゃちゃっと直します。CLIP STUDIOやPhotoshopを持っていない人はGIMPでも使いましょう。
今回はGIMPでBakedTexture_edit.psdを開きます。
f:id:OGOG_Ogura:20190904213314p:plain
開いたら、「ファイル」→「レイヤーとして開く」から、BakeSample.pngを選択して開きます。
すると、一番上のレイヤーとして追加されるので、「BakeSample.png」のレイヤーを「Hair」レイヤーの下にドラッグして移動させます。
f:id:OGOG_Ogura:20190904213510p:plain
(ちなみに、髪のテクスチャを編集してしまった場合は、ガイドに合わせて編集後の髪のテクスチャ画像を配置することで対応可能です。)
この状態の画像を別名保存します。GIMPなら「ファイル」→「名前をつけてエクスポート」です。
「ファイル形式の選択」をクリックして、拡張子はPNG画像を選んで、好きな名前で保存してください。
ちなみにこの書き出し後の画像サンプルがTexture/BakeSample_Tutorial.png にあります。
見比べてみるといいかも。

15. 完成したテクスチャを使う

VRChatならばアバターをアップロードするUnityプロジェクト、VRMならばエクスポート用のUnityプロジェクトに読み込ませて
マテリアルのテクスチャ設定を新しい画像に変更してください。
なお、Quest版VRChatでは使用できるシェーダーが限られており、VRChat→Mobile の中にあるものしか使えませんのでご注意ください。

これで終了です!

VDRAWでPS4ゲームのプレイ動画を撮ってみよう

追記:PS5のコントローラー入力については未検証です


お久しぶりです。いつもVDRAWをお使いいただきありがとうございます。

VDRAWがバージョン1.4.2にアップデートされ、DirectInputコントローラーに対応しました。
これで何ができるかというと、ゲーミングスタイルでPS4ゲームの動画を撮ることができるようになります。

↓こんな感じ

これは、PS4に搭載されている「リモートプレイ」機能を利用しています。
ちなみにコントローラー入力の反映はリモートプレイを使わなくても、コントローラーをUSBケーブルでPCと接続するだけでできます。
リモートプレイを使うとHDMIのキャプチャーボードを持っていなくてもVDRAWにゲーム映像を映せるので、このためにわざわざキャプボを買わなくても大丈夫です。

PS4リモートプレイは、PS4のゲームをPCやスマートフォンで離れた場所から遊ぶことができるというものです。
(上の動画では、PC版リモートプレイアプリを使っています)

※重要※

PS4コントローラーのオーディオデバイスを無効化していないと、リップシンクアバターの口パク)が動かなくなることがあります。 解決方法はこちらを参照してください。

ogog-ogura.hatenablog.jp

HDMIのキャプチャーボードを持っている場合

リモートプレイを使う必要はありません。
PS4とコントローラーを無線で接続してから、MicroUSBケーブルでPCとPS4コントローラーを接続しましょう。
手順が逆だとPS4の本体側が認識してくれません。

PS4HDMIケーブルはキャプチャーボードにつないでください。
HDMIのスプリッターもあると、別のモニターでもゲームを表示できるので遅延なくゲームができて便利です。雑な図でごめんなさい。

f:id:OGOG_Ogura:20200125230025p:plain
図の青い部分は必須ではありません。

あとはアマレコTVやOBSなどでキャプチャーボードの映像を取り込み、VDRAWに表示します。
バージョン1.6以降ではウインドウキャプチャが使えるのでVDRAW上に表示するのも簡単です。

VDRAW側では、「スタイル変更」から「ゲーミングスタイル」を選択します。が…
丸いボタンを押す前に、ボタンの下にあるチェックボックスを「Direct Input Mode」にしましょう。

f:id:OGOG_Ogura:20190817133332p:plain

これでPS4コントローラーでゲームを操作しつつ、VDRAWの指も入力に合わせて動くはずです。
他のコントローラーなどが接続されていると、指が反応しないことがあります。

キャプチャーボードを持っていない人はリモートプレイでやってみよう

まず、PC版のPS4リモートプレイアプリをダウンロードします。

上のリンクのページに沿って、リモートプレイができるようになるまで進めてください。頑張って。

あとはUSBケーブルでPS4コントローラーとPCを接続し、リモートプレイを始めます。
(ワイヤレス接続での検証はしていません)

リモートプレイを開始したら、VDRAWを起動します。

リモートプレイのウインドウの右下にある全画面表示アイコンをクリックすると、VDRAW側でもフルスクリーンで表示されるので便利です。(デュアルモニター環境向けの話ですが…) f:id:OGOG_Ogura:20190817132859p:plain f:id:OGOG_Ogura:20190817133138p:plain

VDRAW側で、「スタイル変更」から「ゲーミングスタイル」を選択します。が…
丸いボタンを押す前に、ボタンの下にあるチェックボックスを「Direct Input Mode」にしましょう。

f:id:OGOG_Ogura:20190817133332p:plain

これでPS4コントローラーでゲームを操作しつつ、VDRAWの指も入力に合わせて動くはずです。
他のコントローラーなどが接続されていると、指が反応しないことがあります。

別にバーチャルモニターに映さなくてもよくない?という人は

VDRAWのクロマキー用設定などを使って、OBSでゲームの映像と合成すれば下のような画面を作ることができます。 f:id:OGOG_Ogura:20190817134300p:plain

ゲーム画面はHDMIキャプチャで取り込んでいます。
映像キャプチャデバイスを持っていなければ、ウインドウキャプチャでリモートプレイの画面を取り込むとよいでしょう。

クロマキー用設定は、VDRAWの右クリックメニュー内、「アングルプリセット」から選択できます。
グリーンバックの正面絵になるので、OBSのフィルタ機能でクロマキーフィルタをかけて合成してください。