Contents
1. STYLY アカウント作成とダッシュボード概要
| 手順 | 内容 |
|---|---|
| ① アカウント登録 | https://styly.cc/ の右上「Sign Up」からメールまたは SNS（Twitter・Google）で新規登録。 |
| ② メール認証 | 送信された認証リンクをクリックし、アカウントを有効化。 |
| ③ ダッシュボード表示 | ログイン後に表示される「マイギャラリー」「アップロード」「設定」の3 パネルが作業の拠点になります。 |
主要パネルのポイント
- マイギャラリー：公開済みシーンと閲覧統計（ビュー数・デバイス別）を一目で確認できる。
- アップロード：GLTF／GLB ファイルをドラッグ＆ドロップで追加可能。サイズ上限は無料プランで 50 MB（※2026 年 3 月の ARLab ガイドに基づく）。 |
- 設定：プロフィール、API キー、プラン変更（Free ⇢ Pro/Enterprise）を管理できる。
公式情報：最新のプラン上限は STYLY 公式サイトの「Pricing」ページで随時更新されています → STYLY Pricing。
2. Unity でアセットを制作・エクスポートする手順
2‑1. 推奨フォーマットと必須プラグイン
- 推奨形式：
glTF 2.0（.gltf / .glb）。軽量かつ WebXR に最適化されているため、STYLY のロードが高速です。 - エクスポートに必要なプラグイン：Unity 標準メニューには glTF エクスポート機能が無いため、以下のいずれかを導入してください。
| プラグイン | 入手先 | 主な特徴 |
|---|---|---|
| UnityGLTF | https://github.com/KhronosGroup/UnityGLTF | オープンソース、カスタムシェーダ対応可。 |
| GLTFUtility | https://github.com/Siccity/GLTFUtility | シンプルな UI、ライト情報のエクスポートに対応。 |
※プラグイン導入手順は各リポジトリの README を参照してください。
2‑2. モデルとテクスチャの最適化
| 項目 | 推奨値 / 設定例 |
|---|---|
| ポリゴン数 | 単体オブジェクト ≤ 10,000、シーン全体 ≤ 50,000 |
| テクスチャサイズ | 1,024 × 1,024 ピクセル以下（必要に応じて 512 × 512） |
| 圧縮形式 | ASTC 6x6（モバイル向け）または BC7（PC 向け） |
| Mipmap | 有効（Generate Mip Maps チェック） |
| アルファ処理 | 必要なマテリアルは Alpha Mode = Blend、それ以外は Opaque に設定 |
2‑3. エクスポート手順（UnityGLTF を例に）
- プラグインをインポート →
Assets/Plugins/UnityGLTF配下へ配置。 - シーン内のエクスポート対象オブジェクトだけを残し、不要なライトやカメラは削除。
- メニューから File > Export > glTF 2.0 (GLB) を選択。
-
Export Settingsダイアログで以下を確認 -
Materials →
Base Color only（PBR の金属度・粗さは除外） - Lights → 必要なら
Export Lightsにチェック（透明床やカスタムライトが必要な場合） -
Extras → 透過フロア用に
transparentFloor: trueを JSON extras に追加（プラグインがサポートしている場合） -
Exportボタンで.glbファイルを出力し、STYLY の「アップロード」パネルへドラッグ＆ドロップ。
3. 透明床（Transparent Floor）の作り方
- Plane オブジェクト をシーンに追加。
Material→Shaderを Unlit/Transparent に変更し、Albedoの Alpha 値を 0 に設定。Render Queueを 3000（透明）に設定し、ZWrite をオフにする（プラグインのエクスポート設定でExport Transparent Objectsが有効か確認）。- エクスポートした GLB にこの Plane が含まれていれば、STYLY 側で自動的に Transparent Floor と認識されます。
透明床は VR ギャラリーの没入感を高めるだけでなく、作品が床面と干渉しないようにする実用的な手法です。
4. STYLY Studio でシーン構築
4‑1. テンプレート選択
| テンプレート | 主な用途 |
|---|---|
| VR Gallery | デスクトップ/スタンドアロン VR（Meta Quest・Vive）向けの広いフロアとデフォルトライト付き。 |
| AR Marker | スマホブラウザで画像マーカーや QR コードを認識させる AR 体験用。 |
テンプレートは Studio > Create Scene の左サイドバーからプレビュー確認後に選択してください。
4‑2. ライト配置と Skybox 設定
| 項目 | 推奨設定 |
|---|---|
| Directional Light | Intensity 1.3、Color Temperature 5600 K、方向は左上斜め45°。 |
| Ambient Light | Environment Lighting → Skybox を有効にし、HDRI（例：studio_4k.hdr）を設定。推奨解像度 2,048 × 1,024 ピクセル。 |
| Shadow | Soft Shadows 有効化でリアリティ向上。ただしモバイルではパフォーマンスに注意。 |
設定手順（Studio UI）
- Environment > Skybox →
Uploadボタンで HDRI を追加、またはテンプレートの「Default Skybox」を適用。 - Lighting パネルで Directional Light の数値を調整し、リアルタイムにプレビューを確認。
5. 公開と共有
5‑1. メタ情報（Title・Description・タグ）と SEO 対策
| フィールド | 書き方例 |
|---|---|
| Title (≤ 60 文字) | STYLYでVRアートを展示する手順 – Unityから公開までの完全ガイド |
| Description (120‑160 文字) | Unity で制作した VR アート作品を STYLY にアップロードし、シーン構築・最適化・公開・SNS シェアまでをステップバイステップで解説します。初心者でも安心の具体手順をご紹介。 |
| Tags | STYLY,VRアート,Unity,GLTF,WebXR,MetaQuest（5〜8 個） |
SEO のポイントは「主要キーワードを自然に含め、メタタグと同様の語句をタグにも設定」することです。検索エンジンはこれらをインデックス対象にします。
5‑2. Publish ボタン操作
- Studio エディタ の右下にある 🌐（地球）アイコン →
Publishをクリック。 - ダイアログで Title・Description・Thumbnail（推奨サイズ 1,200 × 630 px）を入力。
- Visibility：
Public（全員公開）またはUnlisted（URL 知っている人だけ）を選択。必要に応じて Password や Expiration Date を設定。 - 「Confirm」 → 数秒で作品 URL が生成され、ポップアップに表示されます。
5‑3. ページカスタマイズと SNS シェア
| カスタマイズ項目 | 手順 |
|---|---|
| ロゴ・背景色 | ページ右上の Edit → Header でロゴ画像をアップロード、Background Color に HEX（例：#202020）入力。 |
| SNS シェアボタン | 同じ Edit 画面の Social タブで Twitter・Facebook・LinkedIn のスイッチをオンにすると、ページ下部にアイコンが自動配置されます。 |
| シェア文例 | 🖼️ 新作 VR アートを STYLY に公開しました！ぜひ体験してください 👉 [作品URL] #VRArt #STYLY |
6. トラブルシューティングとプラン比較
6‑1. アップロードエラー対策
| エラーコード | 主因 | 解決策 |
|---|---|---|
ERR_SIZE |
ファイルサイズ > 50 MB（無料プラン） | Unity の Mesh Compression とテクスチャ圧縮で容量削減、または有料プランへアップグレード。 |
ERR_FORMAT |
.fbx・.obj など非対応形式 | glTF/GLB に再エクスポート（プラグインの Export Settings を確認）。 |
ERR_TIMEOUT |
ネットワーク遅延／サーバ負荷 | ファイルを分割して複数シーンに配置、または混雑時間帯を避けて再試行。 |
公式エラー一覧：STYLY ヘルプセンター → Upload Errors（随時更新）。
6‑2. ライトが表示されないときのチェックリスト
- ☐ Unity の Light オブジェクトが Enabled。
- ☐ エクスポート設定で Export Lights がオン。
- ☐ Directional Light の Intensity が 0 になっていないか確認。
- ☐ Skybox が暗すぎる場合は明るめの HDRI に差し替え。
- ☐ STYLY Studio のシーン設定で Environment Lighting を
Customに変更。
6‑3. デバイス別閲覧テスト手順
| デバイス | ブラウザ例 | 確認ポイント |
|---|---|---|
| Meta Quest | Oculus Browser | 「Enter VR」ボタンが表示され、コントローラ操作でオブジェクトを掴めるか。 |
| HTC Vive | Firefox Reality | トリガーとタッチパッドの入力感度、視点切替がスムーズか。 |
| PC (SteamVR) | Chrome/Edge（WebXR 対応） | SteamVR が自動起動し、シーンが正しくロードされるか。 |
テストは QR コード で簡易的に実施可能です。QR ジェネレータは
https://www.qr-code-generator.com/等をご利用ください。
6‑4. 無料プランと有料プランの比較（2026 年3月時点）
| 項目 | Free (ARLab ガイド) | Pro / Enterprise |
|---|---|---|
| アップロード上限 | 50 MB／ファイル | 無制限 |
| 月間ビュー数 | 最大 5,000 ビュー | 無制限 |
| カスタムドメイン | 非対応 | 対応（独自 URL） |
| 詳細アナリティクス | 基本的な閲覧数のみ | リアルタイムレポート・イベントトラッキング |
| 優先サポート | なし | メール／チャットで優先対応 |
| 組織管理 | 1 アカウント | ロールベースのユーザー管理可能 |
最新プラン情報は STYLY の公式サイト「Pricing」ページをご確認ください → STYLY Pricing。
7. まとめ：一連のフローを俯瞰すると
- アカウント作成 → ダッシュボード把握
- Unity でモデリング → 推奨プラグイン導入 → GLTF/GLB エクスポート
- ポリゴン・テクスチャ最適化 + 必要なら Transparent Floor
- STYLY Studio でテンプレート選択 → ライト＆Skybox 設定
- アップロード → メタ情報入力 → Publish
- SNS シェア & デバイス別テスト
この流れを順に実行すれば、Unity から STYLY への VR アート公開が 数時間以内 に完了します。まずは無料プランで小規模作品を試し、ビュー数やファイル容量の上限に達したら有料プランへ移行するのがコスト効率の良い方法です。
参考リンク集
- STYLY 公式サイト：https://styly.cc/
- UnityGLTF（GitHub）：https://github.com/KhronosGroup/UnityGLTF
- ARLab ガイド（2026/03/17）：https://arlab.jp/2026/03/17/styly-guide/
- STYLY ヘルプセンター：https://styly.cc/help/
ぜひ本ガイドを手元に置き、あなたのオリジナル VR ギャラリーを世界へ発信してください！