rn.log

備忘録など

【VR】UnityのPrefabをSTYLYへアップロードしてみた

はじめに

Unityエディタ上でPrefabをSTYLYへアップロードする、というのをやってみました。

今回の記事では、Unityのインストール手順やUnityエディタからSTYLYへPrefabをアップロードするまでの手順を簡単にご紹介したいと思います。

STYLYについて

Webブラウザ上でVR空間を簡単に作れるWebサービスです。

VR対応していないPCでもVR空間を作ることができます。

wired.jp

styly.cc

手順1: Unityエディタの準備

UnityHubのDL

UnityエディタのインストールにはUnityHubがおすすめです。
unity3d.com

f:id:r-ngtm:20180531114250p:plain:w450

Unity2017.4をインストール

UnityHub上でUnity2017.4系をインストールします。

f:id:r-ngtm:20180531154536p:plain

STYLYへPrefabをアップロードするためには以下の5種類のプラットフォームをインストールしておく必要があります。
WebGL
iOS
Android
MacOSX
Windowsプレイヤー

必要なものすべてにチェックを入れてインストールしましょう。
f:id:r-ngtm:20180531121441p:plain:w300

プラットフォームが足りていない場合

「Unity2017.4はすでにインストールしてるけど、プラットフォームが足りていなかった」という場合は
UnityHub上でAddComponentを選ぶことでプラットフォームを追加でインストールできます

f:id:r-ngtm:20180531125515p:plain:w400

f:id:r-ngtm:20180531130108p:plain:w400

手順2: Unityプロジェクトの作成

UnityHubからプロジェクトを作成します。 Unity2017.4系を指定しておきます。

f:id:r-ngtm:20180531122320p:plain:w300


手順3: STYLYのUnity用プラグインの導入

STYLY公式サイトからUnity用プラグインをDLします。
styly.cc

ダウンロードしたSTYLY.unitypackageをダブルクリックして、UnityプロジェクトへSTYLYプラグインをインポートします。
f:id:r-ngtm:20180531155214p:plain

f:id:r-ngtm:20180531123812p:plain:w300

インポートが終わるとウィンドウが表示されます。

ウィンドウにメールアドレスとSTYLYのAPI Keyを入力すれば STYLYプラグインのセットアップは完了になります。

f:id:r-ngtm:20180531131655p:plain:w350

No ○○ module installed

Unityエディタにインストールされているプラットフォームが足りていない場合、
No ○○ module installed」という警告が表示されます。

f:id:r-ngtm:20180531124949p:plain:w300

UnityHub上のAdd Componentでプラットフォームを追加インストールしましょう

f:id:r-ngtm:20180531125515p:plain:w400

手順4: PrefabをSTYLYへアップロードする

今回は、以下のPrefab(Sphere.prefab)をアップロードしてみます。
f:id:r-ngtm:20180531160712p:plain:w350

アップロードしたいPrefabを右クリックし、「Upload prefab to STYLY」を選ぶとアップロードを開始します。
f:id:r-ngtm:20180531132440p:plain:w350

アップロードが完了すると以下のようなウィンドウが表示されます。
f:id:r-ngtm:20180531132910p:plain:w350

手順5: アップロードしたPrefabを確認してみる

STYLYを開き、Assets → 3DModel -> My Models を開くとアップロードしたPrefabを確認できます。

f:id:r-ngtm:20180531133602p:plain:w400

モデルの配置もできます。
f:id:r-ngtm:20180531134147p:plain:w300