Contents
1. アバターの基本要件と対応フォーマット
STYLY が正しくアバターを認識し、VR 空間内で自然に動作させるためには、ボディ・スケルトン・リギング の３要素が揃っていることが前提です。これらが欠けていると「姿勢が崩れる」「アニメーションが再生されない」などの問題が発生します。
1‑1. 推奨フォーマット概観
STYLY が公式にサポートしているファイル形式は glTF（.glb/.gltf） と FBX の2種類です。以下の表で、両者の特徴と選択基準をまとめました。
| フォーマット | 主な特長 | 向いているケース |
|---|---|---|
| glTF (.glb) | 軽量・ブラウザ上で高速プレビュー可能。テクスチャやマテリアルが埋め込み可能なので、アップロード後の表示崩れが少ない。 | シンプルなリギング、モバイル向け、即時確認が重要なプロジェクト |
| FBX | ボーン数・階層構造・高度なアニメーション情報を完全に保持できる。Unity からのエクスポートが容易。 | 複雑なリギングやカスタムスキンウェイト、外部ツールで加工したデータ |
選び方のポイントは次のとおりです。
- リアルタイム表示・軽量化を優先 → glTF（.glb）
- 高度なボーン構造やモーションが必要 → FBX（ASCII/バイナリどちらでも可）
※公式マニュアルでは「glTF がデフォルト推奨」旨が記載されています（STYLY 公式ヘルプ – アセット形式）。
2. ブラウザ上での簡易カスタマイズ手順
STYLY Studio はブラウザだけでオブジェクト配置やエフェクト調整が完結します。プログラム知識がなくても、ドラッグ＆ドロップと UI 操作だけでアバターに個性を付与できる点が大きな魅力です。
2‑1. 「ADD TO SCENE」からパーティクルやアクセサリを配置する流れ
左側メニューの 「Asset」 タブにある 「ADD TO SCENE」 ボタンは、ライブラリ内のアセットをシーンへ即座に追加できる入口です。以下の手順で基本操作を確認してください。
- STYLY Studio にログインし、対象シーンを開く
- 左メニューの 「Asset」 → 「ADD TO SCENE」 をクリック
- 表示されたリストから目的のパーティクルやアクセサリ（例：ハート型パーティクル）を探す
- アセットをドラッグし、シーン上の配置したい位置でドロップ
この操作だけで、選択したエフェクトがリアルタイムに可視化されます。
2‑2. パーティクル設定の基本項目と推奨値
追加したパーティクルは右側の 「Properties」 パネルから細かく調整できます。公式マニュアルで紹介されている主要パラメータは Max Particles（最大粒子数） と Particle Color（色） です。実務上の目安を下表にまとめました（出典：STYLY 公式「カスタマイズ可能なアセット一覧」）。
| パラメータ | 推奨設定（軽量表示） | 推奨設定（高精細表示） |
|---|---|---|
| Max Particles | 300 未満（モバイル向け） | 800〜1200（デスクトップ向け） |
| Particle Color | #FF69B4（ピンク） | #FFFFFF + アルファ 0.8（半透明白） |
- 粒子数が多いほど表現は豊かになる が、描画負荷が増大するためモバイル端末では 300 未満に抑えると快適です。
- 色指定は HEX または RGBA 形式で入力可能です。透明度を調整すると光の拡散感が自然になります。
参考：STYLY Studio カスタマイズガイド（2024 年版）リンク
3. Unity で作成したアバターを STYLY に持ち込む手順
高度なリギングやカスタムスクリプトは Unity で制作し、完成後に STYLY へエクスポートするフローが一般的です。ここでは エクスポート設定 と コライダーの必須性 に焦点を当てます。
3‑1. エクスポート時のベストプラクティス（glTF / FBX 共通）
Unity の公式エクスポートプラグイン（GLTF Exporter、FBX Exporter）を使用する際に推奨される設定は次のとおりです。
- 形式：可能であれば glTF（.glb）を選択
- テクスチャ埋め込み：
Embeddedに設定すると STYLY で自動的にマテリアルが復元されます - ボーンエクスポート：
Export All Bonesを有効化し、SkinnedMeshRenderer が対象になるようにする - スケール：1.0（メートル単位）を統一。STYLY のデフォルトと同じサイズ感で表示されます
これらの設定で出力したファイルは、アップロード画面で「自動リギング」や「マテリアル保持」のオプションが有効になります。
3‑2. コライダー設定の重要性と Unity 側作業手順
STYLY 上でインタラクティブに利用するには コライダーが必須 です。未設定のままアップロードすると、アバターは「通過可能」オブジェクトとして扱われ、ユーザー体験が損なわれます。
- アバターの主要パーツ（Head, Body, Hands）に BoxCollider または CapsuleCollider を追加
- コライダーサイズと中心位置をメッシュ形状に合わせて調整
- 必要最低限の数に絞り、目安として 10 個以下 に抑える（パフォーマンス向上）
- エクスポート設定で 「Include Colliders」 にチェック → GLTF/FBX に情報が保持される
アップロード後は STYLY Studio のシーンビューで緑色の枠として表示され、正しく機能しているか確認できます。
参考：STYLY コライダー設定ガイド（2024 年版）リンク
4. テクスチャ・マテリアル差し替えとパーツ入れ替えの実務フロー
既存アバターに独自デザインを適用するだけで、印象は大きく変わります。以下では Studio の UI を活用した手順 と 注意点 を解説します。
4‑1. マテリアル差し替えの基本操作
- シーンに配置したアバターを選択し、右側パネルの 「Material」 タブへ移動
- 差し替えたい部位（例：Head）をクリックし、表示されたマテリアル名を選択
- 「Replace Material」 ボタンを押すとローカルまたは URL から新しいテクスチャ画像を指定できる画面が開く
- 推奨サイズは 最大 4 MB、解像度は 2048×2048 ピクセル程度（高精細表示が必要な場合は 4096×4096 まで）
※「テクスチャ容量上限」は公式マニュアルで 「ファイル全体のサイズは 100 MB 未満」 と定められています。最新情報は STYLY のアップロード画面で確認してください。
4‑2. パーツ入れ替え（ヘッド・アクセサリ）の流れ
- 現在使用中の部位ノードを Hierarchy から削除
- 別ファイルに用意した新しいパーツ（例：カスタムヘッド）を 「ADD TO SCENE」 でシーンへ追加
- 追加したオブジェクトを元のスケルトンに バインド（自動リギングが有効な場合はそのままで OK）
- 必要に応じて 「Custom Property Panel」 の
Part IDやVisibilityを設定し、トリガーで表示切替ができるようにする
この手順を踏めば、同一アバターでもシチュエーション別に外観を変える柔軟な演出が実現します。
5. 最近の UI 改修と新機能（2024 年以降）
STYLY Studio は 2024 年度に大規模な UI リニューアルを行い、カスタムプロパティパネル が標準装備されました。これによりオブジェクトごとに任意のキー/バリューを設定でき、外部ツールやスクリプトとの連携が容易になっています。
5‑1. カスタムプロパティパネルの活用例
- アニメーション速度制御：
anim_speed=1.2と設定すれば対象オブジェクトだけ再生速度を変更 - インタラクションフラグ：
clickable=trueにすると VR コントローラーからクリック可能になる - デバッグ情報埋め込み：
debug_id=avatar_001でログ出力時に識別しやすくなる
プロパティは JSON 形式で保存され、STYLY の API 経由でも取得可能です。
5‑2. よくあるエラーと対処チェックリスト
| エラー | 主な原因 | 推奨対策 |
|---|---|---|
| アップロード失敗 | ファイルサイズが公式上限を超えている、またはメタデータ不整合 | glTF の圧縮（glbzip 等）や不要メッシュ削除、エクスポート時に「Remove Unused Nodes」チェック |
| コライダー未認識 | Unity 側で Collider を付与していない、または Export Settings で除外した | 前述のコライダー追加手順を再確認し、「Include Colliders」に必ずチェック |
| テクスチャが表示されない | テクスチャパスが相対/絶対不一致、UV が壊れている | Unity で Embedded に再エクスポート、または Studio の「Replace Material」から手動で再割当て |
作業前にこのチェックリストを実施すれば、トラブル発生率を大幅に低減できます。
6. オリジナルアバター活用事例と次のステップ
公式チップス記事でも紹介されているように、オリジナルアバターはブランド体験やユーザーエンゲージメントの向上に直結します。以下は実際の導入例です。
- VR 空間内案内役：イベント会場でナビゲーションガイドとして配置し、訪問者の離脱率を 15 % 程度削減
- マーケティング素材生成：アバターショットや短編動画を SNS 用に出力し、ハッシュタグキャンペーンで拡散効果が向上
- インタラクティブ広告：製品情報と連動したパーティクルエフェクトで視覚的訴求力を強化
参考：STYLY オリジナルアバター活用ガイド（2024 年）リンク
次のステップ
- 自社プロジェクトで使用したいキャラクターデザインを決定
- Unity でリギング・コライダー付与 → 上記推奨設定でエクスポート
- STYLY Studio にアップロードし、カスタムプロパティやパーティクルで演出を追加
- プレビュー・テスト（デスクトップ／モバイル）を実施し、パフォーマンスと見た目を最適化
以上のフローに沿って作業すれば、初心者でもスムーズにオリジナルアバターを公開できるはずです。ぜひ本ガイドを手元に置き、次回の VR プロジェクトで活用してください。