日報

VR Chat関連の日報です

ロポリこんちゃんを柴犬に乗せたアバターの作り方

小さい生き物が動物に乗っているのって、めちゃくちゃ可愛くないですか?ぜひ乗せましょう。 f:id:hitton74214051:20220309171207p:plain ※この記事を書いているときのUnityのバージョンは2019.4.31.f1です

使用したアバター

改変に使用するアバターはこちらです。柴犬アバターを購入した後、「こんちゃんを乗せたらかわいいのでは?」とひらめいてしまいました。

booth.pm booth.pm

柴犬にロポリこんちゃんを乗せる方法

まずは、PC用アバターの準備をします。

柴犬アバターのセットアップ

普通のアバターセットアップと同じ手順を取れば問題ありません。

つまりはVR ChatのアバターSDK、ダイナミックボーンをUnityにインポートした後、柴犬アバターのUnityPackageをインポート、Scene内に設置するということです。

ロポリこんアバターのセットアップ

アバターデータのインポート

ロポリこんのUnityPackageをインポートします。
自身での改変済みのデータを使いたければ、改変後のfbxファイルやそれに付属するテクスチャ等をインポートしてください。

インポートしたら、こんちゃんをSceneに設置します。
私は改変後データを使用したのでfbxファイルを利用しました。
無改変こんちゃんのprefabを使う場合には、こんちゃんにくっついているVRC Avatar Descriptor(Script)などを削除した方がいいのかもしれません(試してないけれど、消さないと柴犬とダブってエラーが起きそう)

大きさの調整

犬に乗せるのにちょうどよさそうなサイズに変更します。大きさは各々お好みで。
私は柴犬を1.2倍、ロポリこんを0.8倍としています。

ロポリこんアバターのポーズをつける

犬に乗っているような体勢になるよう、腕と足のボーンの角度を調整してポーズをつけます。
ポーズをつける際には、こちらの無料ツールを使いました。

assetstore.unity.com

ポーズをつけた結果はこちら。 足で芝犬の胴体を挟んで、柴犬の後頭部に手を添えるような形にしています。 f:id:hitton74214051:20220309173048p:plain

柴犬にこんちゃんを乗せる

Unity上で柴犬の上にこんちゃんを置いただけではVR Chatで反映されないので、柴犬のボーンの中にこんちゃんを入れ子にします。 f:id:hitton74214051:20220309174611p:plain

その他微調整

こんちゃんの初期表情はデフォルトからいじっています。 Lowpoly_konのInspector内にあるSkinned Mesh RendererのBlendShapesを調整して、ちょっと得意げな感じで犬に乗っている顔にしてみました。

また、犬に合わせてこんちゃんのアウトラインを太めにしています。こちらはShaderの設定にあるOutline_widthからお好みの太さで。

リップシンク先の変更

声を出した時に柴犬の口が動く状態になっているので、犬の上に乗っているこんちゃんの口を動かすように変更しました。

柴犬(Shiba Inu)のInspector内にあるVRC Avatar Descriptor(Script)にあるLipSyncのFace Meshをこんちゃんを指定しています。 f:id:hitton74214051:20220309173913p:plain

表情アニメーションの作成

ハンドサインで柴犬とこんちゃんの表情が変わるよう、表情アニメーションを作成します。 私の環境ではツールでの表情アニメーション作成がうまくいかなかったため、Unityのアニメーションウィンドウ(Ctrl+6)でぽちぽちと設定しました。f:id:hitton74214051:20220309182922p:plain 柴犬の表情(Shiba_FX)に設定されているハンドサインのアニメーションと作成したアニメーションを置き換えます。

こんな風に犬とこんちゃんの表情が連動するようになりました。 f:id:hitton74214051:20220309185229p:plain

アバターをアップロードする

普通にやれば問題なし。
こんちゃんを乗せた芝犬アバターのできあがりです。VR Chat内を犬に乗って爆走しましょう。

Quest対応

こちらのツールを使って、PC用アバターを変換しました。 booth.pm

(ちゃんとするなら、Quest用こんちゃんを使ってポーズつけたりした方がいいのかもしれないけど面倒で……。)

いろんな動物に乗ってみよう

Boothにはたくさんの動物アバターが販売されています。 お好みの動物の背中に乗せてみましょう。
お兄さん、お姉さんアバターに肩車してもらうのもいいかもしれませんね……!

おまけ

こちらは生き物を重ねまくってみた結果。このこんちゃんには表情などは設定してないので、代表して犬の表情と口が動きます。

f:id:hitton74214051:20220309184029p:plain

使用したアバターはこちらです。

booth.pm booth.pm

「Enjoy squats! - スクワットを頑張る部屋」作成の振り返り

「しばらくこのブログも使ってなかったなー」と思い出したので、先日作成したワールドについて振り返ってみようと思います。

作成したワールドの名前は「Enjoy squats! - スクワットを頑張る部屋」です。 f:id:hitton74214051:20220117225228p:plain

ワールドを作ったきっかけ

ある日話をしてた時に思い付いた「幼女に煽られながらスクワットをするワールドがあったら面白いなー」という気持ちだけで作りました。
12/25に着手して、1/8にラボにアップ。そして1/15にラボ抜けしました。訪問者さんたちありがとう。

「Enjoy squats! - スクワットを頑張る部屋」の概要

ワールドにインすると、UdonChipsを一定額以上持っていないと出られない小部屋に放り込まれる。
※UdonChipsとは、VRChatで使える「ワールド内通貨」の共通規格

Udonchipsはワールドギミック「スクワットマシーン」を使って稼ぎ、部屋から脱出する。

スクワットマシーンがある部屋はガラス張りになっているので、先に脱出した人は中に残っている人を眺めることができる。

UdonChipsを稼いでスクワット部屋から脱出した後は、CashBlasterなどUdonChipsのギミック類でお金を増やしたり減らしたり。
手持ちのUdonchipsが一定額以下になると、スクワット部屋にワープさせられる。そして、またスクワットでお金を稼ぐ……。

f:id:hitton74214051:20220117231703p:plain

ワールド作成について

内装

ガラス張りの部屋でスクワットをしている人と、それを眺める人という作りがいいなーと思って、仮でCC0の画像を使って壁と床を作っていたころ。

ワールドにインした時・スクワット時などに幼女の声が流れるのに、これではちぐはぐな感じがする。内装も声に合わせた方がよさそう。

……と思って、保育園・幼稚園のインテリアを参考に壁飾りや棚、テーブルなどをBlenderで作ってみた。

初めてやったこと

U#ソースの改変

Udon Sharp(U#)のソースを改修して、スクワットマシンに下記機能を追加。

  • スクワットスタート時にランダム音声再生
  • スクワット中にランダム音声再生
  • スクワット終了時にランダム音声再生

そのほか、UdonChips StarterSetにあるギミック類を改修して、任意のタイミングで音声が再生されるようにもした。

U#をいじるのって、正直ハードル高くないですか?

C#の書き方でUdonをいじれるとはいえ、そもそもC#の経験はない。ソースをいじるのだるいなーというのが正直な気持ちだった。

ワールド作成中にemuさん主催の制作弱者の鍛錬場のイベントがあって、そこでU#を触ってみたら……あれ?意外と何とかなるのでは……?という気持ちに。

何かしらのプログラミング言語経験があれば、ちょっとしたU#の改修はそれほど難しくはなさそう。私は遥か昔にCとC++をちょろっとやって(今は忘れた)、近年Excel VBAしか触ってない程度の経験です。

ボイスの発注

ワールド内で流れる幼女の声はiikoeというサイト経由でフリー声優の柊まどかさんに発注しました。 iikoe.org

用意されていたボイスサンプルからイメージに近いものを選び、「生意気な幼女がプレイヤーを煽る感じで」と依頼しました。

ボイス台本は1行ずつセリフを分けて書いたものを渡して、1行ごとに無音の部分を入れてもらいました。無音の部分を入れることで、ソフトを使って分割できるようにという考え。

サイト自体がチケット制のため支払額によっては微妙に残額が出てしまうのがちょっとね~~~~って感じなので、次にフリー声優さんに頼むなら必要な分だけ払うサイトがいいな~~~。(サイトを介さない発注は、揉めた時に困るので✕)

スクワット中のセリフのバリエーションを増やしたく、なめさんに協力いただきました。とても助かりました。

初めて知ったこと

PickUpアイテムでの衝突設定

「ワールドに置いてあるさすまたは、壁を通り抜けずに押さえつけられるようにした方がよいのでは?」という声があったので、壁への当たり判定をつけた。
設定方法を教えてくれたアナゴさんありがとうございます。

設定方法はこちら。
Unityの上部メニューEdit→Project Settings→Physicsと進んで、Layer collision Matrixで当たり判定をつけるLayerが交わるところにチェックをつける。

デフォルトで設定されているLayerのチェックをいじるとワールドアップロード時にエラーになることがあるので、壁やアイテムは新しいLayerを作って設定しておいた方がよさそう? 壁にぶつける方のアイテムは、Rigid BodyのIs Kinematicのチェックを外す。

Quest単体だとカメラが真っ黒になる件

Quest単体でワールドに入ったときに、ある方向にカメラレンズを向けるとカメラ画面が真っ黒になる事象が発生した。

ワールドに置いてあるアイテム全てをQuestで使えるシェーダーにしても、カメラ画面は真っ黒のまま。

色々探した結果、見た目をU#で操作していると思われるアイテムをワールドから除外したら解消した。

他のワールドでも同様にカメラ画面が真っ黒になることがあったので、再現性がある事象っぽい。

Quest向けワールドにちょっと変わったことをするアイテムを置くときは、カメラが使えるか実機で確認したほうがよさそう。

大変だったこと

ワールドのデバッグのために延々とスクワットしたこと。

U#をいじって追加した音声周りの確認のほか、スクワットマシーン自体の設定調整のたびにスクワットが必要になるのがきつかった。
デバッグ中は回数減らしておけばいいんじゃないの?っていう声もあったけど、本番と同じ状態にしないと確認できないこともたくさんあるんだ。

公開後に手を入れたところ

スクワットマシンの説明書

ワールド入室時に流れる音声を聞きつつ、スクワットマシンの使い方を読んでくれれば……という狙いだったのだけど、意外とスクワットマシンの使い方に気が付かない人が多かったこと。
分かりやすいように、現在はスクワットマシンの左隣に使い方の説明を移動した。

UdonChipsの稼ぎ方

スクワットルーム外に置いたCashBlasterで、大量のUdonChipsを稼ぐ人が続出。

ネタバレになるので詳細は記載しませんが、面白かったのでヨイコノさんの案をいただくなどして調整しました。
それでもヌルいようなら、更なる調整をします。スクワットを頑張る部屋なので……。

ワールド訪問はこちらからどうぞ

VR Chatのページ

vrchat.com

紹介動画


www.youtube.com

日報 20211111

無事、第二会場追加版を公開版の環境にアップ……!

vrchat.com

VR ChatのワールドのページにYoutubeのリンクを貼れることに気が付いたので、ワールド紹介動画も作成しました。


www.youtube.com DaVinci Resolve使って編集しようかと思ったけど、多機能でよく分からん……。Windows標準のソフトで作りました。

VR ChatのワールドのページにYoutubeの動画を設定する方法はこちら。

  1. ワールドのページにある「Edit」ボタンを押す
    f:id:hitton74214051:20211111181352p:plain
  2. Youtube Preview Id」欄に、動画のID(URLの"v="以下の文字列)を入れる
    f:id:hitton74214051:20211111181357p:plain
  3. 動画がワールドのページに現れる f:id:hitton74214051:20211111181713p:plain

一旦、画像展示用のワールド「どこか遠くへ行きたいな -Hitton Photo Gallery-」はひと段落。もしかしたら将来展示替えとかやるかもしれませんが。

f:id:hitton74214051:20211111182047p:plain

完成したとなると、また何か新しいワールド作りたくなりますね。
ほらちょうどUnityアセットストアのセールもやってることですし……。

日報 20211110

写真展示ワールドの第二会場はほぼできあがったので、PCとQuestから最終確認を行った。

すると、気がついてしまった。
カメラ越しに見ると、写真と説明文が無くなっていることに……!

f:id:hitton74214051:20211110224134p:plain

PCとQuest両方でこの事象が起きていた。

Unity内の作りとしては、第一会場と第二会場でCanvasを分けて、その下に画像と文字をぶら下げるようにしていた。

第一会場では問題なく写真に写るので、第二会場固有の問題っぽい。

第二会場用のCanvasを見てみたら、カメラの設定忘れがあったのを見つけた。あーこれか、これのせいで真っ白だったのか。

カメラの設定をした後に確認したが、残念ながら相変わらず真っ白な板しか写らなかった。

もう面倒だからいいやーと、第一会場のCanvasをみょーんと伸ばして第二会場も覆うようにして解決とした。第二会場用のCanvasにぶら下がってた面々は、第一会場のものと統合された。まあ、適当だけど趣味のものだからいいかなって……。

雑な対応のお陰で写真は無事にカメラに写るようになった。

f:id:hitton74214051:20211110224153p:plain

ついでにジンジャーエールも常識的な大きさにしておいた。

f:id:hitton74214051:20211110224209p:plain

テスト環境でここまでできていれば大丈夫そうかな。明日反映させよう。

日報 20211108

どこかでVketの存在を家族が知ったため、デスクトップモードで案内をしていた。「こりゃすごい」と言いながら、本人は秋葉原に行く機運が高まったようであった。もし本格的に家族がVR Chatを始めるとしたら、互いのIDは教えない不可侵条約を結びたい。

そういうわけで時間が取れず、大した進捗がない本日なのであった。

カニ歩きが面倒という理由で写真を突っ切るスタイルの展示会場だったが、殺風景な壁に耐え切れずそちらにも写真を貼ることとした。

これで第二会場に展示した旅行の写真は、都合29枚となった。中途半端だからどこかにあと1枚置けないものか。

逆側の壁には、PNGミュージアムで出展した画像を貼る。
PNGミュージアムで出展した画像は、私としては旅行を意識して作ったものだったので関連は無くはないかなと……?(ちょっと苦しいか)
同じシリーズの画像をあと3つ作ってセットで展示したい。

それらの作成が終わったら一通りワールド内をチェックして、問題なければ本番環境に反映できる。

展示できそうな旅行の写真はまだまだあるのだけど、ダウンロード時間をなるべく短くしたい。

そのため、第二会場まででこのワールドはおしまい。他の写真を展示するとしたら、また別のワールドを作ってポータルを置こうと思う。

日報 20211107

写真展示ワールドの終点は、色々オブジェクトを置いて遊べる仕組みにしてみた。

座れる椅子を作ろうと思ったのだけど、参考になる詳しい情報がなかなか見つからない。
サンプルの椅子を置けば座れるのかと思ったのだけど、見事に埋まった。

色々探した結果、解説動画をやっと見つけた。基本的なことすぎて、解説している人が少ないんだろうか……? youtu.be

座れる椅子の作り方は下記の通り。

  1. Cubeを作成して、椅子の高さ・幅に合わせて置く
  2. CubeにはBox Colliderを設定する
  3. Create EmptyからGameObjectを二つ作って、それぞれEntry、Exitと名前を付ける
  4. 作成したCubeにAdd Componentから、VRC Stationを追加する
  5. VRC Stationを下記のように設定する
    • Player Enter Location:Entryを設定
    • Player Exit Location:Exitを設定
  6. EntryのPostionを椅子に座る位置に設定
    • 椅子の半分より前くらいがちょうどいい
  7. ExitのPostionを椅子から降りた位置に設定
  8. CubeのMesh Rendererのチェックを外す
    • Cubeは見えなくなるが、Sitの判定に利用できる

結果↓

その後色々置いてこんな感じ。 f:id:hitton74214051:20211107201721p:plain

壁が殺風景なので、何か飾ろうかなと考え中。

日報 20211106

昨日はインフルエンザ予防接種の副反応で熱が出た。そのため何もできなかったので、今日は多少進捗を出したいところ。

というわけで、写真展示ワールドの追加改修に着手した。 今のワールドから敷地を拡張するのはやりにくいので、第二会場をつくってそこへワープするようにしよう。

ワープの仕組みはこちらのアセットを使った。
[無料版あり] VRchat向け 基本的でシンプルなUDONギミック - 南緯74度 - BOOTH

扉を置くのも唐突すぎるので、置物の石にぶつかったら第二会場へのワープするという仕組み。石はコライダーを外して、中にワープする仕組みを入れてある。
第二会場からはお土産屋さん(第一会場の最後の場所)、入口に戻れるようにした。 f:id:hitton74214051:20211106123833p:plain
上空からの様子

その後、第一会場と同じようにアイテムをセットしていった。 f:id:hitton74214051:20211106231214p:plain
最初、第一会場と雰囲気を変えようと思って木の代わりに巨大キノコを置いてみた。VRで確認してみたらさすがにノイズすぎたので、巨大キノコは却下。結局普通の木にした。

テスト用のワールドにアップして、VR Chatで入って確認。ワールド内を歩いてみた結果、もうちょっと写真置いてもいいかなーと思ったので、第二会場は写真23枚くらいになる予定。