blenderでベッドの作り方を模索しunityに持って行ってみた!④ ~シェーダー設定したりwebVRビルドしたり~

3Dモデリング

バーチャル3Dクリエイター神部まゆみです(*^-^*)

この記事はblenderでベッドの作り方を模索してunityに持って行ってみた記事の続きです。

前回までの記事はこちら。

blenderでベッドの作り方を模索しunityに持って行ってみた!③ ~ベッドにボーン入れてシェイプキーを仕込む~
バーチャル3Dクリエイター神部まゆみです(*^-^*) この記事は前回の続きで、blenderでベッドを作ってunityに持って行ってみました。 前回までの記事はこちら。 今回はベッドにボーンを組んだりシェイプキー入れ...
blenderでベッドの作り方を模索しunityに持って行ってみた!② ~布団クロス、ベッドスローと枕作成~
バーチャル3Dクリエイター神部まゆみです(*^-^*) この記事は前回の続きで、blenderでベッドを作ってみたよ。 クロスシミュレーションとか結構やってるから、知りたい人には参考になるかも。 クロスシミュレーションで布団を作...
blenderでベッドの作り方を模索しunityに持って行ってみた!① ~モデリングしてunityで見てみる~
バーチャル3Dクリエイター神部まゆみです(*^-^*) この記事では、blenderでベッドを作ってunityに持って行ってみたよ。 できれば最終的に、unity-webxr-exportでwebVRにビルドして、Oculus Qu...

 

今回はテクスチャ素材サイト探したりシェーダー設定したり、webXRビルドしてVRで見れるようにしてみたりします。

やっぱり自分で作ったものをVRで見れると「おお!」ってなるので、やってみると面白いですね。

■PR■

現在、ファンタジーゲーム制作に使える人気unityアセットが50%オフで買える unityファンタスティックファンタジーセールをやってるみたいです。

unityファンタスティックファンタジーセール 50%オフ

欲しいアセットはこの機会に買っておくと良いかも。

 
 

 

 

テクスチャ配布サイトを探してみる

テクスチャ配布サイトはたくさんありそうだけど、無料で気楽に使えそうなのがいいかな…?

このあたりは無料で自由に使えて良さげ。

Free Stock Textures
Free Stock Textures - download high resolution textures, all images are free for personal and commercial use.
Attention Required! | Cloudflare
写真素材なら「写真AC」無料(フリー)ダウンロードOK
無料写真素材を提供する「写真AC」のフリー写真素材は、個人、商用を問わず無料でお使いいただけます。クレジット表記やリンクは一切不要です。Web、DTP、動画などの写真素材としてお使いください。

木のテクスチャを探してみる

種類が豊富でたくさんありますね。

Attention Required! | Cloudflare

布のテクスチャを探してみる

布はどうだろ…生地っぽいのや柄物みたいな感じのを探す感じかな?

Attention Required! | Cloudflare

まぁこういうのはペイントソフトとかblenderとかでも作れるかもしれない。

テクスチャをstandard shaderに設定してみる

適当な木と布のテクスチャをダウンロードして使ってみます。

とりあえずアルベドに設定しておけばいいか…

あんまりstandard shader詳しくないから、アルベドくらいしか使ったことないんだけど(;^_^A

ちなみにアルベドというのは、入射光に対する反射光の比のことらしいです。

アルベドって言うと、オーバーロードっていうアニメのキャラクターが真っ先に思い浮かぶけど…(笑)。

 

テクスチャをunityにインポートして、アルベドのところにテクスチャファイルをドラッグ&ドロップすればOK。

standard shaderはなんとなくノリでいじって使えているというだけなので、後で一から勉強してみたい。

ノーマルマップ(法線マップ)を使うと画像ファイルで陰影が指定できる?っぽいので使えるようになりたい。

 

メタリックにも指定できるけど、これは金属の質感を再現したい時に使うのかな?

secondary mapにアルベド×2ってやつがあるけど、これは普通のアルベドより明るい感じだった。光の反射量×2って感じ?

タイリングとオフセットでテクスチャを映す位置を指定する

ここをいじるとテクスチャのどこを表示するか指定できる。

blenderでUV展開して専用のテクスチャを作ってあるならここでやる必要はないと思うけど、unityでテクスチャ指定する場合は使うと思う。

枕とベッドスローにテクスチャを指定する

これどうするか…。

ヒョウ柄にするとギャルかおばさんっぽいか(笑)。更に変なモコモコがあるとポイント高いかも(笑)。

 

まぁなんとなくメッシュっぽい感じのやつにしておくかな…?

とりあえず壁と天井だけ追加してみる

キューブを平べったくして配置しただけだけどw

窓がほしいけど、四角い穴を空けた壁をblenderで作って、透明なplaneをはめ込めばいけそう。

或いはガラス部分だけマテリアル別にして透明にすればいいか。

blenderでループカットして窓を作る方法は以前CG Geek先輩の動画で教わりました。

blenderでリアルな部屋の作り方をCG Geek氏のチュートリアル動画で学ぶ① ~部屋とベッドのモデリング~
バーチャル3Dクリエイター神部まゆみです(*^-^*) この記事は、blenderでリアルな部屋の作り方をyoutubeのチュートリアル動画で学んでいくメモ。 最近はyoutubeでたくさんチュートリアル動画が上がってるから、手軽に...

 

あとは以前作ったミラーとかも置きたいけど…まぁ今回はこのくらいでいいかな。

徐々に内装を増やしていこうw

VRでまゆみと添い寝できるようにしてみる(笑)

添い寝VRは以前もSTYLYで作ったけど…。

STYLYでまゆみ達とのVR添い寝部屋を作った!二次元に行く方法はSTYLYにあった…?
3Dだから三次元だけどね(笑)。 バーチャル3Dクリエイター神部まゆみです(*^-^*) 今日はSTYLYでまゆみ達と添い寝できるVR部屋を作るよ。 unityを使ってSTYLYにアップしていって、STYLY Studioで配置し...

どんだけ添い寝したいんだと思うけど(笑)、VRの有効な活用法の一つな気がする。

私はvrchatで寝るワールドに行って昼寝したりしてるし…(笑)。

Very Animationで添い寝アニメーションを作る

Very Animationっていうのはこのアセットで、手軽にアニメーションが作れて便利です。

Very Animation|Unity Asset Store

こんな感じでフレームごとにボーンを動かして、手軽にアニメーションが作れます。

unity veryanimation

ポーズさえ作れれば、あとは繋ぎや差分を作っていけばそれっぽく動かせます。

 

あとは寝てる系のアニメーションはMixamoとかにもあるかも。

Mixamoのアニメーションをunityに持って行ったメモ。VeryAnimationで簡単に編集できた
バーチャル3Dクリエイター神部まゆみです(*^-^*) この記事は、Mixamoでアニメーションをダウンロードしてunityに持っていき、ヒューマノイドのキャラに適用させたメモ。 実はこの記事は、三か月くらい前?に下書きのまま書いて...

veryanimationでMixamoのアニメーションを編集して改変したりもできるので、このアセットは持っておくと便利ですね。

もう一体配置してアニメーションをミラーさせる

私一人でもいいけど、両側に配置すると両手に花感があって良いかも(笑)。

アニメーションを複製して、アニメーションファイルのミラーにチェックを入れるか、

unity アニメーション ミラー 左右反転

Very Animationのツールで Create New Clip ⇒ Mirror でミラー複製することもできます。

これでもう一体配置して、アニメーターコントローラーを別で設定すれば…。

おおおおこれは…!!

今夜はすごいことになるぞ( *´艸`)

unity-webXR-exportでwebXRビルドする

詳しくはこちらで書きました。

unity-webxr-exportをいじったメモ。VRでバーチャル女子のおっぱいを鷲掴みできたでござるぞ( *´艸`)
バーチャル3Dクリエイター神部まゆみです(*^-^*) 今回はunity-webxr-exportをいじっていくよ。 機能を網羅的に調べていこうかと思ったけど、VRでおっぱいを掴もうとしたら長くなったから今回はそこまで。 結論から...
unity-webxr-exportでブラウザでWebVR!LookAnimatorでVRoidモデルとVR空間で遊べたよ
バーチャル3Dクリエイター神部まゆみです(*^-^*) 前回の続きで、unity-webxr-exportをいじって、Oculus Quest2でWebVRを動かして行こうと思うよ。 前回の記事はこちら。 unity-webx...

ビルドしたファイルをzipに圧縮してサーバーにアップ、解凍すればOK

サーバーのファイルマネージャーでアップするにはzipにしないといけないっぽい。

これはエックスサーバーですけど、publicよりも下のフォルダにアップしてから解凍すればOK。

文字コードは別になんでもいいんだったかな?一応UTF-8にしておく。

エックスサーバー webgl アップロード zip 展開

URLさえ分かれば、webGLファイルのindex.htmlにリンク貼ればOKです。

これクラウドストレージでもいけるかなと思ったけどダメっぽい?webGL公開したいならサーバー借りないとダメかも。

容量大きいと展開に失敗するっぽい?phpスクリプトで解凍したらいけた

以前は↑までの手順で展開できたんですけど、モデル二体配置したからか容量が重くなって展開に失敗したっぽいです(-_-;)

エラーとか何も出ずに展開されなかったので、恐らく容量が多いと展開に時間かかって、エラーを返して展開を中止しているっぽい。多分。

多分これサーバー会社や個々のサーバーの設定によるみたいなので、普通に展開できる設定のサーバーもあれば、時間かかるとエラーで弾かれるサーバーもあるかも。

 

検索したらこちらの先輩のphpスクリプト使ったら解凍できました!

さくらサーバのファイルマネージャーで、zipファイルの解凍でエラーが出る場合の対処方法
先日、10年以上運営していた無料ブログをWordPressに移行した時の事です。ローカル環境のWordPress(Local by Flywheel)でテストし、いざさくらのレンタルサーバにアップしようとしたところ、サーバーにアップした圧縮

↑の先輩の例だとさくらサーバーだけど、エックスサーバーは $zipfilename のところのzipファイル名だけ書き換えたら行けました。

 

これでちゃんと解凍できましたね。

unzip.phpは消してもOKだけど、またアップする時にzipファイル名書き換えて使うだろうから残しておこうかな。

【webVRあり】Oculus Quest2で動作確認!無事VRで添い寝できた( *´艸`)

↓Oculus Quest2のOculusブラウザとFireFox Realityで見れました。

Unity WebGL Player | WebXR

VRデバイスだと人の身長ぶん高くなるので、高さ0に設定してあります。なのでPCからだとベッドの下側しか見えないw

 

おお…これはなかなか…( *´艸`)

そういえば以前youtubeチャンネルも作ったから動画も上げてみようかな…。

アクセス解析見るとたまに動画検索経由で来てくれてるっぽい?ので、一応上げておくと良いのかも。

 

あとは声があるといいけど…。音声素材は以前DLsiteで結構買ったけど、セリフ系が少ないからちょっと使いにくいんだよね(;^_^A

ボイスロイドとかはyoutubeやサイトのコンテンツとしてなら使えるみたいだから、買ってみるのも良いかもしれない。

amazon pollyなら500万文字まで無料でかなり自由に使えるっぽいけど……かわいい感じの声は英語しかなかったからどうだろ。

 

でもやっぱりVRは良いね( *´艸`)

フェイスブックもメタに社名変更してメタバースに注力していくようだし、私も自分のメタバースを作って公開していこうw

ただVR端末持ってない人には何がいいのか伝わらないから、普通のwebGLで見せる工夫も必要かも。

2021/12/06追記:普通のwebGLでも見れるようにしてみた

一応テスト的にアップしてみた。

Unity WebGL Player | WebXR

マウスで視点変更だけで、移動はできないようにしてあります。

ESCキーで抜けられます。


webGLテンプレートは変えずに、webXRのプレハブだけインスペクターオフにして、代わりにFirstPersonAIOを設置してみました↓。これ設定が簡単だからラク。

SUPER Character Controller | ゲームツールキット | Unity Asset Store
Get the SUPER Character Controller package from Aedan Graves and speed up your game development process. Find this & other ゲームツールキット options on the Unity Asset ...

おわりに

そこそこ良い感じにベッドが作れたので良かったです。

あとは内装を作っていって、良い感じの部屋を作っていきたい。

このブログのトップページあたりにwebGLを貼っておいて、少しずつ追加していきたいかな。

 

あとはVRコントローラーでタッチしたら布団をめくる…みたいなインタラクティブなコンテンツを作ってみたいけど。

STYLYならPlay Makerとか使ってできるみたいだけど、久々にいじってみるのもいいかも。

Play Makerは以前セールの時に買って放置してあるからいじってみようかな?分岐とか手軽に作れそうだしいける気がする。

そんな感じで楽しみながらやっていこうと思います(*^-^*)


追記:

部屋の内装を作っていく続きを書きました。

blenderのarchimeshアドオンで窓と壁とドアを作って、シェイプキーを仕込んで動かしてみた備忘録
バーチャル3Dクリエイター神部まゆみです(*^-^*) この記事はblenderのarchimeshアドオンで、部屋の窓と壁とドアを作ってみた備忘録です。 前回blenderでベッドを作ったから、今回は部屋の中を作っていこうと思うよ...

 

タイトルとURLをコピーしました