UnityからSTYLYにプレハブとシーンをアップロードする方法

本記事では、Unityで作成した「プレハブ」と「シーン」をSTYLY上で使用するための方法をご紹介します。

STYLYでは、3DModel、Particle System(Shuriken)、Light、UI要素、Shader(Amplifed Shaderを使ったものなど)、PlayMaker、インタラクションSDKなどを用いて作成したプレハブ・シーンをアップロードできます。

Unity上でアニメーションやインタラクティブな機能を付与したアセットや、色を付けたLightのアセットなどをSTYLYで使用できます。
シーンのクオリティ向上や、自分だけの新しい表現方法を追求したい方は、ぜひチャレンジしてみてください。

必要要件

STYLYは「Unity 2019.3.6f1」に対応しています。
さらに、以下のモジュールがインストールされているか確認してください。

Unity Hubを使用

  • Windows Build Support (Windowsをお使いの場合、デフォルトでインストールされます。)
  • Mac Build Support (Macをお使いの場合、デフォルトでインストールされます。)
  • Android Build Support
  • WebGL Build Support
  • iOS Build Support

もし、こちらのモジュールがインストールされていない場合は以下の記事をご参照ください。

 

アップロード可能なアセットの種類

「STYLY Plugin for Unity」を使えば、STYLYに次の種類のアセットをアップロードできます。

STYLY Studio

  • 3DModel(Mecanimでアニメーションを付けたものも可能)
  • Particle System(Shuriken)
  • Light
  • UI要素
  • Shader(Amplifed Shaderを使ったものなど)
  • PlayMakerやインタラクションSDKを用いたアセット

これら異なる種類のアセットでも、アップロードのプロセスは同じです。
使用したいアセットをプレハブ化し、STYLYへアップロードするだけです。 

※注意:
もし、PlayMakerで付けたアクションがSTYLY上でうまく作動しない場合は、一度ブラウザ上のキャッシュを取り除いてみてください。
また、STYLYはC#で記述されたスクリプトは対応しておりません。

 

STYLYへアップロードするための準備

UnityからSTYLYへアップロードするための準備として、STYLY Plugin for UnityをUnityにインポートします。

 

STYLY Plugin for Unityのダウンロードとインポート

STYLY Plugin for Unityを使えば、Unity上で作ったプレハブ・シーンをSTYLYにアップロード可能です。
STYLY Plugin for Unityのダウンロード手順を紹介します。

まずは以下のリンクか、もしくはSTYLYのトップ画面のメニューから[DOWNLOAD]メニューからダウンロードページにアクセスしてください 。

STYLYトップページ

DOWNLOADページに移動したら、ページ下部の[STYLY Plugin for Unity DOWNLOAD]ボタンをクリックして、ダウンロードします。

STYLY Plugin for Unity DOWNLOADをクリック

ダウンロードが完了したら、UnityのプロジェクトにSTYLY Plugin for Unityをインポートします。
Unityプロジェクトを開きます。
[Assets]メニュー > [Import Package]メニュー に進んで、[Custom Package…]メニューをクリックしてください。

Custom Package…

先ほどダウンロードした「STYLYPlugin」を選択して、[開く]ボタンをクリックします。

STYLY Pluginを開く

すべてのチェックボックスにチェックしたまま、[Import]ボタンをクリックします。

Importをクリック

インポート後、メニューに[STYLY]が追加され、Assetsに[STYLY_Plugin]フォルダが作成されていれば完了です。

STYLY_Pluginフォルダが作成

 

STYLYアカウントとSTYLY_Pluginを接続する方法

自身のSTYLYアカウントのAPIキーを取得する必要があります。
APIキーの取得方法を紹介します。

アカウントのアイコンをクリック

STYLY Studioへログインし、アカウントのアイコンをクリックしてください。

「Account」をクリック

ポップアップが表示されたら、「Account」をクリックしてください。

AccountタブでAPIキーをコピー

AccountタブにAPIキーがあるので、右のコピーボタンをクリックしてください。

 

[STYLY]メニュー

Unityプロジェクトの[STYLY]メニューに進み、[Asset Uploader Settings]をクリックします。

Asset Uploader Settings

Emailフォームには、アカウントのメールアドレスを入力します。
API Keyには、先ほどコピーしたキーを張り付けてください。
これでSTYLYアカウントとSTYLY_Pluginの接続が完了しました。

 

UnityからSTYLYへのアップロード

プラグインの準備ができたら、次の手順でSTYLYへアップロードできます。

 

アップロード対象のファイルサイズの確認方法

プレハブ・シーンのファイルサイズを確認する方法を紹介します。
アップロードには、特にサイズが大きい場合、数分〜それ以上の時間を要しますので、STYLYにアップロードする前にプレハブ・シーンのファイルサイズを確認しましょう。

アップロードファイルサイズ確認画面

ファイルサイズを確認するには、確認したいプレハブを右クリックし、[STYLY] > [Check File Size]ボタンをクリックしてください。
アップロードするプレハブは20MB以下を推奨しています。

 

UnityからSTYLYにプレハブをアップロードする方法

ファイルサイズ確認したら、Unityで作成したプレハブをSTYLYにアップロードしましょう。

プレハブアップロード画面

アップロードしたいプレハブを右クリックします。
[STYLY] > [Upload prefab or scene to STYLY]をクリックします。
アップロード処理が実行されます。

アップロード完了画面

アップロードの処理が成功すると、ポップアップメッセージ[Upload succeeded.]が表示されますので、[Close]ボタンをクリックしてください。
アップロードエラーが表示された場合、エラーが起こった詳しい状況(動作手順やスクリーンキャプチャ)を以下、問い合わせまでお願いします。

エラー問い合わせ先:

  • 日本語:https://www.facebook.com/groups/stylyusers/
  • 英語:https://www.facebook.com/groups/STYLY.VR/
  • メール:info@styly.cc

複数プレハブのアップロード

プレハブを同時に複数アップロードすることもできます。
Projectシーン内のアップロードしたいプレハブを複数選択してから、右クリックしてください。
「STYLY」→「Upload prefab or scene to STYLY」を選択するのは前章と同じです。

プレハブ複数選択

これで複数プレハブを一度にアップロードすることができました。

UnityからSTYLYにシーンをアップロードする方法

Unityからのシーンアップロード方法はプレハブをアップロードする時と同様、シーンファイルを右クリック→「Upload prefab or scene to STYLY」を選択するのみです。

「Upload prefab or scene to STYLY」をクリック

制限事項

  • シーン内のカメラは自動的に無効化してアップロードします。ただし、以下の設定のカメラは無効化対象外です。
    • TargetTextureにRenderTextureが設定されている。
    • Camera Target EyeがNone(Main Display)
  • スクリプトは反映されません。
    • その他、動的なコンテンツが正常に動作しない可能性があります。
  • STYLY Studio上でもシーンは表示されますが移動、回転、拡大などの操作はできません。
    • Your Positionを移動して調整してください
  • サイズが大きすぎるとアップロードできない可能性があります。
  • シーンアセットのサムネイルは、シーン内にMainCameraにタグ付けされたカメラがある場合は、そのカメラから見た画像になります。
  • MainCameraが存在しない場合は、DUMMY表示となります。

アップロードしたプレハブ・シーンをSTYLYで使用する

アップロードしたプレハブ・シーンの確認方法を紹介します。

アップロードしたプレハブ・シーンをSTYLYで使用する

STYLY Studioを開きます。
次に[Assets]ボタンをクリックして、[3D Model]ボタンをクリックします。
最後に[My Models & Upload]メニューをクリックします。
My Modelsにアップロードしたプレハブ・シーンがあれば完了です。