VRChatで使えるClothコンポーネントを用いた貫通しないスカート

先日作成したモデルでVRChatに出没しているんですが

スカートだと座ったり走り回るときにガッツリ貫通してアレな感じになります

VRChat上でこういった問題を回避するにはunityアセットのdynamic boneを使う(有料)、Clothコンポーネントを適用させる、スカートを脱がせる等の方法がありますが、

今回はUnity5で新しくなったclothコンポーネントを使ってイイ感じに貫通しないスカートを目指します

というかぶっちゃけdynamicboneでスカートの貫通を防ぐ方法は調節が鬼すぎてメチャクチャ厳しいのでやめたほうがいいです　心が死にます(いい感じに設定する方法あったら教えてください)

〇Clothコンポーネントとは

完全に丸投げですが以下のUnityの中の人の記事が詳しいです

blogs.unity3d.com

要はそのオブジェクトのメッシュに布っぽい挙動をさせることができる機能です

通常だと重力でそのまま下に垂れ下がりますが、メッシュの各点を一定の力で拘束したり足のボーンにコライダー(当たり判定)を仕込むことで物体が貫通するのを防ぐことが可能になります

〇Unityで実装してみる

今回はBlenderで作成したモデルにclothを適用させていきます

clothコンポーネントをアタッチするオブジェクトは体などと分かれている必要があるため、事前にBlender等で分離しておきます(MMDモデル等でもblenderのアドオンでオブジェクトの分離は可能です)

揺らすものを別オブジェクトにしたらfbxで出力してUnityにぶち込みますが

そのままclothコンポーネントをアタッチすると何故かメッシュが伸び切ってメチャクチャに暴れます

どぼぢで

雰囲気でモデリングをしているので理由はよく分かりません(環境Unity5.6.3p,Blender2.79)

BlenderからそのオブジェクトのArmatureモディファイヤーで適用させると上記の問題を回避できました

モディファイヤーが残っている状態です

ここからモディファイヤーを適用させることが出来ます

問題なくUnityに取り込めたらスカートのオブジェクトを探してclothコンポーネントをアタッチします(自分の環境ではお尻ボーンの下にありました)

そのままだとどこにも固定されていない状態でスカートがずり落ちてしまうのでEdit Constraintsからスカートの根本を固定します

根本は完全に固定、前と後ろだけ真ん中の部分もちょっと強めに固定すると激しい動きによるスカートの裏返りを抑えられる感じがします

自分のclothコンポーネントの設定は以下のようになりました

実際に自分でアニメーションを適用した状態で再生しながら調節すると良いと思います

あとは足のボーンの下に3Dオブジェクトのsphereを２つずつ置き

スカートのclothコンポーネントの下の方にあるコライダー設定のところにぶち込みます

FirstとSecondに設定することで球の間にも円錐状のコライダーが生まれます

球の径はちょっと大き目にしておくと暴れまわっても貫通しにくくなります

このとき気を付けなければいけないことに

• 球のメッシュを削除する
• 球のオブジェクトすべてを非アクティブにする

 の2つがあります

1つ目はメッシュを残したままにするとVRChat上でも表示されてめちゃくちゃダサいことになります

丸付けたとこを削除しておきましょう

(追記)

空のオブジェクトに球コライダーを足したものを使うとメッシュ削除などの手間が無くて簡単かもです(アドバイスありがとうございます)

2つ目はアクティブなコライダーが残ったままVRChatに行くと、空中で浮いた状態で回転して動けなくなります(めちゃくちゃ酔う)

アクティブなコライダーどうしがぶつかり合っているのが原因っぽいので、コライダーを持つオブジェクトをすべて非アクティブにしましょう

ここのチェックを外します

以上で足がスカートを貫通しなくなるはずですが、椅子から立ち上がったり激しく動き回るとスカートが足の間に挟まったり裏返って戻らなくなることがある場合は、コライダーを増やして設定するといい感じになりそうです

自分は腰ボーンの下に縦長のカプセルコライダーを置きました

上手くいきました！

ワールドの読み込み時にも浮いたり回ったりしないので大丈夫そうです

歩き回るたびにスカートから足が見えるとせっかくのモデルが勿体ないので　ぜひおためしください

ついき：

記事ちょっと伸びたのにVRChatのフレンドが増えません！！！！！！！

現在2人しかいないので気軽にフレンド飛ばしてくれるとうれしいです～～～～～～～～～～

ID：trike1236

よろしくおねがいします

仮想世界のぼく可愛すぎワロタ

ブログの更新頻度の目標は週一以上なんですが普通に3週間経ってました

次から更新しないで1週間過ぎるごとに責任を感じることにします

前回はVRChat内をプロの人たち(?)に案内してもらいましたが、そのときに無性に自分のヴァーチャル肉体が欲しくなったので色々調べてみました

例えばVRChatでアバターを使いたい場合、ざっくりと

1. 最初からVRChat内に準備されているアバター
2. (VRChatで使用しても問題ない)配布されているモデル
3. 改造可で配布されているモデルに手を加えたもの(テクスチャ変更・小物追加等)
4. maya、blender等の3DCGモデリングソフトを使って自分で製作したモデル

上の4つの方法で使用することが出来ます

(配布されている各モデルのライセンスは下のwikiで纏められています)

vrchatjp.playing.wiki

他のユーザーと違うモデルを使いたい場合は必然的に３か４になり、3DCGソフトを使用する必要が生まれてきます

バーチャルじゃない空間ではメチャクチャ没個性の自分ですが、バーチャルである空間ではアイデンティティーを示したかったので

自分で3Dモデルを作りました！ｲｴ~~ｲ

めちゃくちゃ可愛くないですか？僕は可愛いと思います

使用したソフトはBlender、製作期間は1か月くらいです(最初の数週間はほぼソフトに慣れる時間でした)

参考にしたサイトはたくさんありましたが、最初の顔のモデリングで1番分かりやすく参考になった zenさん(twitter)  のyoutubeのチャンネルが超おススメです

www.youtube.com

承認欲求の塊なので逐一twitterに載せてふぁぼりつを貰っていました

はじめてのblenderモデリング！めっちゃむずかしい pic.twitter.com/d4Q6SmcmZ2

— とらいく (@trike_1236) 2018年4月19日

後頭部作ってないけどなんとかなるんじゃね！？がんばれ！！！ pic.twitter.com/nukJeBRk1T

— とらいく (@trike_1236) 2018年4月21日

イラスト的な描き方をテクスチャでもやってみたけどちょっとケバくなっちゃうなあ　うーんもっとくっきり描いた方がよさそう pic.twitter.com/2MOdHYk9lw

— とらいく (@trike_1236) 2018年5月15日

ログ見てると後半にかけて進捗が急加速してるように感じます

Blender自体が複雑で習得が難しいソフトなのもありますが、純粋に完成が見えてきて作業モチベが上がったのが大きかったです

色やテクスチャを付けない状態で細部を詰めていくのはなかなかしんどかったので、ある程度奥の工程までなめてから細部に移るほうが良いと思いました

blenderでの作業が終わったらUnityでゴニョゴニョやるとVRChatにモデルのアップロードが可能になります

VRChatへのアップロードにはポリゴン数2万以内の制限がありますが

Blenderの上の方に表示されているここの三角面というところがポリゴン数に当たります

初めは”面”のほうだと思っていて最終的にポリゴン数を5000ほど削る羽目になりました(切ない)

とりあえずだけどVRChatに自分のアバターアップロードできたぞ！怪しいところもうちょっと詰めよう pic.twitter.com/XdGd2MYOD4

— とらいく (@trike_1236) 2018年5月17日

 腕のボーンの設定を適当にやるとこんな感じで捩じったときに腕がズレます

ちゃんとボーン設定は曲げ・捩じりをして確認しながら行いましょう....

スカートの貫通問題等もありますが、とりあえず上のモデルを完成としてVRChat等で遊んでいこうと思います

VRChat内ではtrike1236という名前でログインしているので、気軽にフレンド等飛ばしてくれると嬉しいです！！！！！

次からのブログ更新はblenderの投稿も増えると思います

よろしくおねがいします

VRChatにおじゃましてきました

更新するする詐欺して全然やってませんでした　ワハハ

近頃はoculusriftやHTC Viveなどの被るやつで仮想世界の住人になるのが流行ってるらしいですね

中でも仮想空間上でコミュニケーション等が出来る

””VR版SNS””

みたいなのが最近増えているらしく、メジャーなものにVtuberのバーチャルのじゃロリ狐娘youtuberおじさん(ねこますさん)や、ミライアカリさんが紹介しているVRChatというものがあります。

【速報】次元の壁を越えた！in VRChat【MiraiAkariProject#010】

【簡単解説】これでアカリに会いに来て？in VRChat#3

www.moguravr.com

ねこますさんが解説してた動画消しちゃったんですね(見つからなかった)

〇VRChatとは

VRChatとは、仮想空間上で他者とコミュニケーションを取ることができる、VRネットワークサービスである。

SNSのVR版というか、身もふたもない言い方をすれば、SecondLifeみたいなものである。

VRChatとは (ブイアールチャットとは) [単語記事] - ニコニコ大百科

 ほかのVtuberさんの動画もたくさんアップされているので、そちら見てもらえればなんとなくの雰囲気は分かる気がします

自分のアバターを通して主にボイスチャットでフレンドや知らない人と交流をするのが主な目的になると思います

アバターは3Dモデルをサーバーにアップロードして使用するのが一般的ですが、最初からすぐに使えるものや他のユーザーが置いているものも存在するので最初はなんとかなります(すぐ自分のアバター欲しくなると思いますが....)

ところでボイスチャットってちょっと敷居が高いですよね　喋らないプレイングも可能ですが、現状ボイチャ以外にサクサク意思疎通できるものがほぼ無い予感がします

Viveなどを被った状態でプレイするVRモードの他にも、PCのモニター上でプレイできるデスクトップモードというものがあるので被るものが無くても普通に遊べます(どちらもそれなりのPCスペックが必要ですが）

〇じっさいに入ってみました

もう先週の話になりますが、Twitterよりすずめい子さん(@suzumeiko_as)、びもゆさん(＠Bimoyu)方に招待して頂いて有名なワールドをいくつか案内してもらいました！(以下写真ギャラリー)

まず日本の神社っぽいワールド(うつってるのはすずめい子さん)

めちゃくちゃ綺麗なのにそんなに重くない　すごい

ねこますさんもここでバーチャルお花見してたらしいです

神社にうんこが落ちてました(右方にいるのがびもゆさん)

アバターの可能性は無限大です

空間に落書きできるワールドです(デスクトップ版だと操作がめちゃくちゃ厳しいので　コントローラーを買いましょう)

めちゃくちゃ楽しそうじゃないですか！？！？たのしい.... 

SAOの世界を再現したワールドもありました　キリトかなーやっぱりww

専用の武器を持って敵を倒したりできる本格的なところでした（ネタワールドだと思ってた）

Viveのコントローラがあれば二刀流操作もできるっぽいので　買いましょう(にかいめ)

ネプテューヌ？のワールド

すでに置いてあるアバターに着替えて撮影会をしたりしました

アバターは人型である必要はないのでパンツにもなれます！！！ﾄﾞﾕｺﾄ

(多分)デスクトップ版だと視点の高さが変えられないので人のパンツを覗いたりするのは難しい予感がします

ほかにもゼルダの伝説のフックショット(立体機動装置みたいなの)を使って木々を渡るワールドや、弓と矢を持ってﾋﾟｭﾝﾋﾟｭﾝするワールドなども案内してもらいました

実は以前こっそりひとりでVRChatを始めてひとりで世界を散策したことがあるのですが、

・ワールドが多すぎてどこに行けばいいかわからない

・急に外人に話しかけられてビビる(日本人もいっぱいいます)

・SNSなのに孤独感がヤバい

なので正直よっぽどのコミュ力強者じゃないとフェードアウトしちゃうような気がします(ぼくはしました)

ある程度プレイされてる方に案内をしてもらうだけでも、かなり体感するものは違うと思います。今回声かけてもらって案内して頂けてほんとによかったです！！(ありがとうございました！)

知り合いがプレイしてるなら積極的にお願いして案内してもらうのがほんとにいいと思います

もちろん僕にも声かけてもらえれば案内しますので！一緒に仮想空間の住人になりましょう.......！！

最近は自分の3Dモデル作りのためにずっとblenderを触っていますが、完成したらVive購入してVRChatに入り浸る予定です

〇おまけ

ガチ恋距離はヤバい

やっていきます

 「バーチャルのじゃロリ狐娘Youtuberおじさん」から

めちゃくちゃ更新サボってました

改めていろいろ進めていく元気が出てきたのでブログ更新も再開していこうと思います

前回の更新から1年以上経ってますが、ぶっちゃけほぼ何もしてなかったです

Unityはバージョン5.5.0のまま放置、Viveもすぐ購入するつもりでしたが常に金欠で入手できず、そのために買ったGTX1070のグラボにもカビが生えていました

この一年ちょっとでやったのは

・アルバイトとして受けていたwebサービス構築(PHP、MySQL等)

・ディープラーニングの勉強としてよく噂になってるオライリーのアレ(pythonもちょっとやりました)

・大乱闘スマッシュブラザーズ for WiiU(フォックスがつよい)

って感じでした

普通の人だったら1か月で勉強できる内容を薄～～く1年でやってました(反省してます)

 とにかくほぼ良い感じのアウトプットがゼロだったので、意識を改めこれから少しずつ見せられるものを公開できれば。と思っています(今日からブログも更新していきたいです)

今日の更新は決意表明みたいなものなので他に内容はないです。あとは適当に最近あったこと書いていきます

〇kindle unlimitedに登録しました

いままでamazonは結構頻繁に利用し、amazon student(プライムの学生版)に登録していて恩恵も最大限に受けていましたが、無限kindleは二の足を踏み続けている状態でした。そこに

CGWORLD (シージーワールド) 2018年 05月号 vol.237 (特集:わいわいバーチャルYouTuber、デジタル作画最前線)

ずっと探していた雑誌がunlimited入りしてました　Vtuber特集が読みたかったんです

やっとkindle unlimitedに登録する決心がつきました。

が、

それから何冊かザクザクと色んな雑誌をナナメに読んでいましたが、正直あんまり読みたい本は見つからなかったです。。。

図書館などで読み放題だ！って意識でいっぱい本を持ってきても半分も読まずに返しちゃうタイプの人間なので、しっかり吟味して買った本を所有するほうが真面目に読みますし習得率が高いような気がしました。

まだ登録したばかりで無料期間中なので、もう少ししたら解約すると思います。

〇英語の勉強を始めました

英語上達完全マップの内容をもとに英語の勉強を始めることにしました。

半分くらいは大学の単位要件で必要になったこと、もう半分はプログラミングの学習などで日本語のドキュメントしか読めないことに不自由を感じたからです

特に後者は機械学習の勉強などをしていると顕著になる感じがします

教材もいくつか揃えましたが、中でも瞬間英作文の教材↓はメチャクチャ良い感じがありました

どんどん話すための瞬間英作文トレーニング (CD BOOK)

高校英語やってきて単語、文法や発音はある程度分かるけど会話ができる気がしない。。。みたいな人にとってはクリティカルな勉強法なんじゃないでしょうか(個人の感想です)

目標はTOEIC700点くらいですが、他にやることあったりすればやる気はそっちに回したい程度の優先度になると思います。

〇VIVEが購入できませんでした

ヘッドマウントディスプレイのHTC Vive(70,000円)をいい加減買いたくなったのでドスパラでローン組んで買おうとしたらローンの審査が通りませんでした

あれって落ちるものなんですね(ほぼ通るものだと思ってた)

誰か買ってください

〇ﾈｺﾁｬﾝ拾ったので家の猫が2人から3人になりました

トイレでうんこできるマンだった えらい pic.twitter.com/Clr1utl9FD

— とらいく (@trike_1236) 2018年1月28日

 めっちゃ夜泣きする

〇NEMが暴落しました

暴落って言っていいのか分からないですが、1月に180円で買った仮想通貨のNEMが一時20円近くまで下がりました。

世知辛いのじゃ～！

 ～～おわり～～

現状は大学4年生で就活をダラダラ進めていますが、サクっと決めて社会人になる前にVR・Unity周りでポートフォリオにも出来る程度のものを製作するのが暫くの目標になります(多分

 たのしい1年になるように がんばります

Wallpaper Engineでデスクトップにミクさんを召喚した

お久しぶりです　4年近くぶりでしょうか

しばらく更新していませんでしたが、ダラダラとUnityを触っていました

 Photonというサービスを使ってオンラインゲームを作ったりしていましたが、UIもダサいし爽快感もないクソゲーが出来上がりそうなのでしばらく中断してます(そのうち公開します)

最近ツイッターでWallpaper Engineというのが流行ってるみたいですね

store.steampowered.com

(steamで400円くらいで購入できます)

TLに流れてきたミクさんのデモが割と衝撃的だったので購入してみました

ついったでオススメが流れてきて衝動買いしたWallpaper Engineいいぞ！
壁紙が動くだけで謎の未来感に感動している！steamで買えるぞ！ pic.twitter.com/hHRSTRAuFg

— にゃいぼん aka へらぶな (@nyaibon) 2017年1月4日

すごい！！かわいい！！！(動いてます)(デスクトップの汚さには触れないでください)

この壁紙はビデオ形式のものらしいですが、HTMLやUnityも埋め込めるみたいなのでちょっと試してみます

MMD4Mecanimを使用してアペミクさんをunityに取り込みました

このままでもカワイイですけど動かないのでUnityちゃんのアセットからanimatorファイルを借りて流し込みます

待機モーションになりました　かわいい

あとはスクリーン上のマウスの場所からRayを飛ばしていい感じに座標を取得して、Animator.SetAtLookPositionを使用して渡した座標の方向にモデルを向かせます

アセットストアから借りてきた建物の中に移動してもらいます

ビデオの撮影みたいですね

あとはめり込み等確認したあとでPC用にビルドしてそのままWallpaper Engineに突っ込むだけです。メッチャ簡単

デスクトップ女神のミクさん

やったーーーー！！！完成です！！！

クリック時のイベントなどは何も設定してないのでコードは30行も描いてません

表情の変化や瞬き、ﾊﾟｲﾀｯﾁなど実装するといい感じになるんじゃないでしょうか

Update関数の中でマウスずっと追いかけてる割には動作も軽い気がするのでつけっぱなしでも大丈夫そうでした

壁紙にunity埋め込みだとキー入力などは受け付けない？みたいですがマウスポジションやクリックなどは検知できるみたいなので頑張れば面白いものが作れるかもしれないですね

追記)

Wallpaper EngineでUnityのファイルが開けると聞いたので、狐っ娘がカーソルを視線で追いかけてくれる壁紙を作りました！後半はカメラも追従するバージョン（アイコンで隠せないのでフォルダで隠蔽） pic.twitter.com/OwxmdUb2Wi

— 榊原圭介＠3D同人エロゲ制作アカ二代目 (@flashsky05) 2017年1月6日

 二番煎じでした！！！！！！！！！！！！！！！！！！！！！！！！！

Photonネットワークに接続できない？

Unityでマルチプレイができるゲームを試作したい！と思って色々調べてみると、Photonというものを使えば簡単に実現できるとかで

photonengine.jp

数行のコードを書くだけで無料で使えるみたいです。ﾍﾞﾝﾘ～～

実際に現在製作を進めているゲームに適用する前に仕組みに慣れるためにテストとして

Photon運営事務局さんの PUNを使ってネットワーク同期を行う -Vol.1- | Photon運営事務局Blog を参考にしながらネットワーク接続を試してみました。

直感的にも使えるわかりやすいコールバック関数などもたくさんあるっぽいので「バカにも優しいな～！」と考えながらチュートリアルを写経していました

繋がらねえ！！！！！！！

SwitchToProtocol: Udp PhotonNetwork.connected: False というメッセージが出て処理が止まってしまいました

コードはほぼコピペでチュートリアルの通りに進めていましたがなぜか出てくるはずのブロックが生成されません

色々試してみるとOnJoinedLobby()メソッドから呼ばれていないようで...

調べてもピンと来なかったので他の動いたコードと見比べていると、他のものにはOnConnectedToMaster()というメソッドも加えられていました。

【Unity、PUN】Photon Unity Networkingのコールバックメソッド一覧 | naichilab - Android iOSアプリ開発メモ

こちらのOnJoinedLobby()の詳細を読んでみると

/// マスターサーバー上のロビーに入った際に呼び出されます。
/// 部屋のリストが更新されるとOnReceivedRoomListUpdate()が呼び出されます。
/// </summary>
/// <remarks>
/// 注意：PhotonNetwork.autoJoinLobby が false の場合、
/// OnConnectedToMaster() が呼び出され、部屋のリストが利用可能になることはありません。

 設定でautoJoinLobbyがOFF(false)になっているとOnConnectedToMaster()メソッドが呼び出されて処理が進まなくなっていたようでした。

修正するにはProjectにあるAssets/Photon Unity Networking/Resources/PhotonServerSettingsからautoJoinLobbyをtrueにするか、スクリプトに

void OnConnectedToMaster(){

PhotonNetwork.JoinRandomRoom();

}

 を追加するだけで解決しそうです。

とりあえず自分は解決しましたがプログラミング初心者なので間違ってたら教えてください(  ;∀;)

教本を買うオタク

しばらくブログの更新が空きましたがまだやめてはないです

Unityに関する教本を2冊購入しました 

Unity5の教科書 2D&3Dスマートフォンゲーム入門講座 (Entertainment&IDEA)

Unity5 3D/2Dゲーム開発実践入門　作りながら覚えるスマートフォンゲーム開発

開発をする際に使用するC＃に関しては本当に素人だったので基本文法やUnity内でのスクリプティングから教えてくれた猫の表紙の本はとても勉強になりました

ゲームを開発するにあたっての設計の基本やスクリプトを作る流れなど、他の教本ではあまり触れられていない部分の解説も充実しているため、入門書にありがちな

「書いてある通りに進めたらいつの間にかゲームが完成していた」

という状況になりにくいのではないでしょうか。

もう一冊の教本については製作するサンプルゲームの質がかなり高く、ちょっとパクればビジュアルもリッチな雰囲気のゲームを作ることが出来るんじゃないでしょうか。内容は他の入門書と比べると少し難しいらしいので、他の教本や独学などで基礎の基礎を学んでから読むと理解しやすいと思います。

こんな感じのゲームが作れます

どちらの本もC#でプログラムが書かれていて写真も多めで読みやすくそこまで読み切るのに時間がかからないため非常におススメです。初めてならとりあえず猫のやつ買うといいと思いますよ、ねこかわいいし

一通り本は読み終えたのでこれから実際に遊べるゲームを作っていきたいと思います(多分)

恐らく他で記事として纏めますが今はこんなものを作っています

某ねこ戦車っぽいですがリスペクトってことで････