バーチャル3Dクリエイター神部まゆみです(*^-^*)
今回はSTYLYに登録して、チュートリアルまで終わらせてみた記事です。
STYLYについて調べている人は参考にしてね。
STYLYとは?
自分のVR空間を作れるサービスで、VRChatのコミュニケーションが無い版みたいな感じ?
以前から名前は知っていたけど、詳しく調べたことはなかった。
作った空間はブラウザにも埋め込めるので、VR環境がなくても見れます。
ブラウザだけでVR空間を作ったり、unityでシーンを作成してアップロードしたりできるようです。
VRChatはトラストランク上げないとアップロードできないけど、STYLYはそういう制限はありません。
C#スクリプトは動作しないらしいけどPlayMakerは動くみたい
PlayMakerって名前だけは知ってたけど、結構色々できるみたい。


PlayMakerでゲーム作ってる人は結構多いっぽいね。
Oculus Quest2にSTYLYアプリを入れて見てみた ※動画あり
Side Questを入れて、STYLYアプリを入れて見てみました。

いくつか見てみたので、どんな感じなのかを動画で貼っておく。
音が出るので注意。
おすすめに表示されてたやつ。
製作者のお子さんらしき人物?が出てきて、なんかカオスな部屋に案内してくれます(笑)。

学校みたいな場所で、漫画が表示される空間。
場所を指定して移動する感じみたいだけど、なんか階段が登れずにすり抜けてしまいました( ̄▽ ̄;)

ワードプレス動画でアップしたら何故かエラーが出たのでGIFで。
なんか結構自由に作れるっぽいね。
STYLYに登録してアップロードしてみる
実際に使ってみます。
①STYLYに登録する
STYLYのページにアクセスして、Sign up for freeボタンを押す。
その後、ユーザー名とメールアドレス、パスワードを入れてSIGN UPボタンを押せばOK。
あれ、これだけで登録できて、既にログインしている状態になってるみたい。
一応プロフィールだけは設定しておこうかな。
②STYLY STUDIOを起動する
画面向かって右上の、青い「Studio」ボタンを押すと、STYLY STUDIOが起動できるみたいです。
その後こんな画面が出てくるから、CREATEをクリック。
この画面を見るに、シーンは複数アップロードできるみたい。
既存のシーンを編集して更新したり、非公開にもできる感じかな。
CREATEボタンを押すと、こんなメニューが。
STYLYってARコンテンツも作れるのか( ̄▽ ̄;)
そういえばVR/AR/MRとか書いてあったっけ。
でもとりあえずは、Tutorialを選んでSTYLY STUDIOの使い方を学んでみようと思います。
③STYLY STUDIOのチュートリアルで学ぶ
チュートリアルに入ると、いきなり英語ばかりで戸惑った( ̄▽ ̄;)
follow this line って書いてあるラインの向こうにSTEP1ってのが見えるから、あっちに移動すればいいみたい。
でもこれ操作がちょっと独特なので、慣れるまでちょっときついかも。
マウス中央ボタンでズーム、左クリックで回転はいいとして、右クリックしながら矢印キーで移動はちょっと慣れが必要。上に移動する時は、上向いて移動しないといけないっぽい?
とりあえず右クリックしながら矢印キーで移動すれば、割と自由に動き回れるっぽい。
STEP1 ワニを円内に動かす
STEP1の場所に移動しました。
ワニのオブジェクトをクリックして、円の中に入れろ!っていう感じ?
普通にワニを左クリックして、矢印で移動させたらいけた!
こういう感じでオブジェクトを移動させて配置していく感じかな?
割と手軽に作れそう。
次に行け!と言われてるので、次のステップに進みます。
STEP2 キリンを回転させる
これ最初意味わからなかったけど、白い円に設定されてるGiraffe?とかいうunityのトランスフォームのギズモみたいなのを選択して、向かって右のメニューでRotateを選んで回転させたらOKだった。
あれ、でも白い円が回転しない?
ウェイトが載ってないとか?ちょっとわかんないです。
※後で気付いたけど、本来ここにGiraffe(キリン)のオブジェクトが表示されるはずが、バグってたようですw
STEP3 ゾウを大きくする
ここはSTEP2でRotateでやったのを、Scaleに切り替えてサイズを変えればOK。
……らしいんだけど、なんだこれは。どうやってもクリアできない(-_-;)
検索してみたら、これバグってるっぽい?( ̄▽ ̄;)
STYLYさんの公式解説ページを見ると、ここに本来ゾウのオブジェクトが配置されているらしい。

おかしいなぁ…ブラウザがEdgeだからかな?
推奨ブラウザはchromeみたいだからそれが原因?
ゾウのオブジェクトをアセットから配置して、再起動したらできた
Edgeのままやったけどできました。
進行状況はオートセーブされるっぽいから途中からできた。
STEP4 ライオンを追加して円内に配置する
アセットからライオンを選んで配置して、円内に配置しろ!って感じみたい。
赤丸で囲んだアイコンをクリックすれば、アセットメニューが開けます。
なんか色々配置できるみたい。
ライオンは3D modelにあるので、配置して位置を円に入れればOK。
こうやって読み込んでブラウザで適当に配置するだけでも、割といい感じのVR空間が作れる感じなのかもしれない。
STEP5 Other Tips
自分で用意した3Dモデルや画像、動画などを追加できるよ!って書いてある。
あとは「ギャラリーで公開できるよ!」とかそういう知識を教えてくれます。
全部見ると終わり。
これで私もSTYLYマスターか( *´艸`)ヤッタネ(*^^)v
まだ基本的なとこ覚えただけだけども(笑)。
でもアセット追加して配置するだけでもちょっとしたVR空間が作れるみたいなので、なかなか良さそう。
ブラウザに埋め込んで多くの人に見てもらえる可能性があるのは良いね。
続く!次はテスト的にアップしてみる
チュートリアルが終わって基本的なことが分かってきたから、次回は実際にテスト的なものをアップロードしてみようかな。
次はブラウザで適当にオブジェクト配置したりしてアップロードして、unityからアップロードするまでやりたい。
アバターをアップロードしてアニメーションさせることもできるみたいだから、私のモデルをアップロードして動かしてみたい。
その場合はもっと露出を抑えた服装にしないと消されるリスクがありそうだけども( ̄▽ ̄;)