Contents
STYLY XRコンテンツ制作の基礎と目的
STYLYは、AR/VR両対応のXRコンテンツを誰でも簡単に作成できるプラットフォームとして注目されています。特に中小企業のマーケティング担当者や初心者は、コストをかけずに店舗紹介や商品展示など、新しい顧客体験を構築できます。本記事では、STYLY Studioでの制作プロセスをステップバイステップで解説し、実務で必要な注意点も含めてご案内します。
STYLY Studioの基本操作フロー
STYLY Studioは直感的なインターフェースで構成されており、新規ユーザーでも迷わず作業が進められます。プロジェクト作成から公開までの流れを理解することで、効率的にコンテンツ制作が可能です。
プロジェクト作成から公開までの流れ
STYLY Studioでは、プロジェクト作成から公開まで以下の手順で進みます。
- アカウント登録とログイン後に「新しいプロジェクト」を作成します。
- シーンタイプ（AR/VR）を選択し、プロジェクトタイトルを入力。
- シーン編集画面で3Dモデルやインタラクティブ要素を配置。
- プレビュー確認後、右上の「公開」ボタンでURL生成が完了します。
インターフェースの主要機能紹介
STYLY Studioの画面左側にはツールバーがあり、モデルインポートやイベント設定を手軽に行えます。右上にある「プレビュー」ボタンで、実際の再生環境を確認できます。また、中央のワークスペースではドラッグ＆ドロップでオブジェクトを配置できるため、操作性が高く評価されています。
ARシーンテンプレート選択とカスタマイズ
STYLYには「ARシーンテンプレート」が豊富に用意されており、目的に応じた初期設定が可能です。初心者でもスムーズな制作を進めるために、テンプレートの選び方とカスタマイズのポイントを確認しましょう。
目的に応じたテンプレートの選び方
ARシーンテンプレートは目的ごとに最適な選択肢があります。以下の表に具体的な案を示します。
| シーン目的 | 推奨テンプレート | 特徴 |
|---|---|---|
| 店舗紹介 | 「ポップアップカタログ」 | カメラに合わせて表示されるデザインが適している |
| 商品展示 | 「3Dモデルホルダー」 | 複数の商品を並べて展示可能 |
| 企業プレゼン | 「スライド型アーキテクチャ」 | スライド形式で説明を進めやすい |
テンプレートを選んだ後は、背景画像や文字レイアウトのカスタマイズが可能です。ただし、既存デザインとの整合性を保つためにも、変更前にはデフォルト設定を把握しておくことが重要です。
3Dモデルのインポート手順とポイント
AR/VRコンテンツに使用する3Dモデルは、STYLY Studio内で直接インポートできます。ファイル形式やスケール調整に関する注意点を確認することで、表示不良や操作ミスを防ぎましょう。
ファイル形式の確認と変換方法
サポートされているファイル形式には以下のものがあります。対応していない場合、変換が必要です。
- サポートされているフォーマット:
.glb,.gltf,.fbx（※.objは変換が必要） - 対応していない形式の場合は、BlenderやMayaなどを使って
.glbに変換します。
シーン内の位置調整ガイド
モデルが表示されない場合、主な原因として「スケール」「ポジション」が挙げられます。以下のチェックリストを参考に設定してください：
- ✅ モデルのサイズがシーン内に収まるようスケール調整
- ✅ カメラの視点とモデル位置を確認
- ✅ シーン全体の照明や背景とのバランスを調整
注意: 大きなモデルは、AR表示時にユーザーに見づらくなる場合があります。適切なサイズ感を意識しましょう。
インタラクティブ要素の設定方法
STYLYでは、クリックやホバーなどによるインタラクティブ操作を追加できます。ユーザー体験を向上させるためにも、イベント設定の手順と実務例を確認してください。
基本イベントの追加手順
インタラクティブ要素を追加する際は、以下のステップに従ってください。
- 「ツールバー」→「イベント」をクリックし、目的のオブジェクトを選択。
- 「イベントタイプ」から「クリック」「ホバーアニメーション」などを選択。
- イベントが発生した際の動作（例: モデル回転・音声再生）を設定。
ユーザー操作への対応策
ユーザーの操作に応じたイベント設定を行うことが重要です。以下は具体的な実務例です。
| ユーザーの操作 | 対応するイベント設定 | 実務でのポイント |
|---|---|---|
| カーソルでオブジェクトに触れること | 「カーソルトリガー」を追加 | モバイル端末でも反応するように注意 |
| スライド操作 | 「スライダーイベント」を使用 | 連続動作が不安定にならないよう調整 |
パフォーマンス面では、シンプルなイベント構成を推奨します。複雑なアニメーションは、ユーザーの端末に負荷を与える可能性があるためです。
SNS共有用URL生成と公開設定
STYLYで作成したXRコンテンツをSNSなどで共有する際には、専用のURLが必要です。ここではURL生成オプションやアクセス制限の設定について解説します。
URL作成オプションの使い分け
URLは目的に応じて選択することで、効率的な運用が可能です。
- テスト用リンク: 「公開」→「プレビューURL」を選択（編集中の確認に最適）
- 本番用リンク: 「公開」→「共有URL」を選択（SNS投稿や広告などに使用）
注意: テスト用リンクは、外部からのアクセス制限がかけられており、本番用と混同しないように確認してください。
アクセス制限設定の基本
共有設定では、以下のように柔軟な制御が可能です。
- 「共有設定」画面で「埋め込み許可」「閲覧権限」を調整可能です。
- 個別ユーザーへのアクセスを制限する場合は、「URLキー」を活用します（※有料機能）。
SNS投稿時の場合、URLにリンクを貼り付けるだけで自動プレビューが表示されるため、集客効果が期待できます。
まとめ
STYLY Studioの基本操作フローを理解し、プロジェクト作成から公開までスムーズに進めましょう。ARシーンテンプレートは目的に応じて選び、カスタマイズで個性を加えることが重要です。3Dモデルインポートではファイル形式とスケールの確認が不可欠。インタラクティブ要素はユーザー体験を高めるキーポイントであり、イベント設定に注意してください。SNS共有用URL生成時は、テスト用と本番用リンクの区別を明確にし、アクセス制限を適切に設定しましょう。
無料アカウント登録後、記事で紹介する「AR/VR両対応テンプレート」を試してみましょう。