1.4 - ソケット

Tutorial

Beginner

+10XP

90 mins

(9)

Unity Technologies

1.4 - ソケット

このレッスンでは、VR でオブジェクトをはめ込むためのソケット (Socket) の設定方法を学びます。このレッスンが終わる頃には、ユーザーは帽子をフックに掛けられるようになり、さらにその帽子をかぶることもできるようになります。

このレッスンは「Create with VR」コースの一部です。

1. 掴める帽子をシーンへ追加

帽子用の機能的なフックを作る前に、まずは掴める帽子が必要です。

1. シーンに合わせて、いくつかの帽子を用意している:

  • Course Library > Prefabs > Objects > Hats の順に選択しフォルダーを開きます。
  • あなたが被りたいと思う 2 つの帽子を、鏡の近くの表面にドラッグしてください。
  • 注意:まだシーンにフックがない場合は、Course Library > Prefabs > Hooks フォルダーから追加します。



2. 帽子を物理演算で制御する:

  • Ctrl または Cmd を使用して、Hierarchy 内の両方の帽子を選択します。
  • 選択した帽子オブジェクトに Rigidbody コンポーネントを追加します。
  • Collision Detection プロパティを Continuous Dynamic に設定すると、地面を突き破って落下するのを防ぐことができます。


3. 帽子を掴めるようにする:

  • XR Grab Interactable コンポーネントをそれぞれの帽子に追加します。
  • 必要に応じて、Smooth Position Smooth Rotation のプロパティを有効にして、ジッターを軽減します。


4. テストの準備:

  • XR Rig を鏡の前に置き、フックと帽子に手が届く距離になるように配置し直します。

これで、無事に帽子を拾うことができるはずです。

2. フックをシンプルなソケットに変える

帽子をフックに掛けられるようにするには、フックがソケット (Socket) のように動作する必要があります。

1. ソケットを正しく配置する:

  • Hierarchy で、Hook オブジェクトを右クリックし、Empty の子オブジェクトを作成します。
  • 子オブジェクトの名前を「Socket 1」に変更します。
  • Socket 1 オブジェクトを、帽子が掛けられるフックの先端に再配置します。


2. ソケットのトリガー検出領域を定義する:

  • Sphere Collider コンポーネントを Socket オブジェクトに追加します。
  • Edit Collider ボタンをクリックし、Radius を 0.1 に減らします。
  • 帽子と衝突しないようにするには、Is Trigger のチェックボックスを選択します。


3. Socket 1 オブジェクトをソケットのように動作させる:

  • XR Socket Interactor コンポーネントをオブジェクトに追加します。


4. ソケットにアタッチしたときに、帽子が下向きになるようにする:

  • Socket 1 の空の子オブジェクトを作成し、この子オブジェクトの名前を「Attach」に変更します。
  • Attach オブジェクトを下向きに回転させます。
  • Attach オブジェクトを、Socket Interactor コンポーネントの Attach Transform プロパティに割り当てます。
  • 注意:アタッチポイントのローカル Z 軸は、帽子の望ましい順方向に合わせ、ローカル Y 軸は望ましい上方向へ合わせる必要があります。

これで設定したソケット (Socket) の上に、選んだ帽子を乗せられるようになります。

3. ソケットを複製し、デフォルトで帽子をアタッチする

これで、完全に機能するソケットが 1 つできたので、それをフックの他の場所に複製して、シーンがロードされたときに帽子がフックにかかるようにします。

1. 帽子を 掛ける場所すべてにソケットを作る:

  • Hierarchy で、Socket 1 オブジェクトを 2 回複製します。
  • コピーしたオブジェクトの名前を「Socket 2」と「Socket 3」に変更します。
  • 残りの 2 つの吊り下げフックの位置に、コピーした Socket を再配置します。


2. 帽子はデフォルトでフックからスタートする:

  • Socket オブジェクトの XR Socket Interactor コンポーネントのそれぞれで、Starting Selected Interactable プロパティに帽子の一つを割り当てます。
  • 注意:帽子が 2 つしかない場合は、片方のソケットの interactable プロパティを「None」にします。

これで 3 つのソケット (Socket) がすべて機能するようになり、シーンの開始時には、フックに帽子がかかるようになります。

4. あなたの頭を帽子用のソケットに

これらの帽子や鏡は、実際にあなたの頭に帽子をかぶることができなければ意味がありません。

1. Head Socket オブジェクトを正しく配置する:

  • Hierarchy で、XR Rig > Camera Offset > Main Camera を右クリックして、Empty の子オブジェクトを作成します。
  • この新しい子オブジェクトの名前を「Socket」に変更します。
  • 帽子が目の上に表示されるように、Socket オブジェクトの Y Position を 0.1 に設定します。


2. ソケットのトリガー検出領域を追加:

  • Sphere Collider コンポーネントを Socket オブジェクトに追加します。
  • Edit Collider ボタンをクリックし、Radius プロパティを 0.2 に設定します。
  • Is Trigger チェックボックスを選択します。


3. 帽子をソケットにスナップする:

  • XR Socket Interactor コンポーネントを追加します。

これで、帽子を自分の頭にかぶって、鏡で見てみることができるようになります。

5. 他のオブジェクトが帽子のように動作するのを防ぐ

現在、すべてのオブジェクトを帽子のように頭の上やフックに乗せることができます。インタラクションレイヤーを使って、どのオブジェクトが相互作用できるか、できないかを制御することができます。

1. 「帽子」の新規レイヤーを追加:

  • Hat オブジェクトを選択します。
  • Inspector の右上にある Layer ドロップダウンから、Add Layer をクリックします。
  • 最初に空いているスロットに新しい「Hats」レイヤーを追加します。
  • 注意:また、Unity エディターの右上にある Layers ドロップダウンを選択し、Edit Layers をクリックすると、Layers ウィンドウが表示されます。


2. 新しい Hats layer に帽子を置く:

  • Hierarchy で、Ctrl/Cmd + Click を使って Hat オブジェクトを全て選択します。
  • XR Grab Interactable コンポーネントで、Interaction Layer Mask ドロップダウンから Nothing を選択してレイヤーをクリアします。
  • ドロップダウンから、新しい Hats レイヤーを選択すると、そのレイヤーだけが有効になります。


3. フック/頭のソケットが「帽子」レイヤーのオブジェクトとのみインタラクトできるようにする:

  • フック/頭のソケットの各オブジェクトの Interaction Layer Masks プロパティを Hats レイヤーのみに設定します。


4. 他のオブジェクトが帽子として使えないようにする:

  • 他の掴めるオブジェクトをすべて選択します。
  • Interaction Layer Mask ドロップダウンから、Default レイヤーのみを有効にします。

これで、頭とフックには帽子だけを置くことができるようになり、他の掴めるオブジェクトは置けなくなります。

6. まとめ

注目のフィーチャー

  • 帽子の追加
  • 帽子をフックに掛ける
  • 頭に帽子をかぶる

新しいコンセプト & スキル

  • Socket Interactor
  • インタラクションを検出するためのトリガー
  • Interaction Layer Masks

次のレッスン:

  • オーディオとハプティクス
任意のステップ

7. 追加のアクティビティ(任意)

スキルをさらに向上させたい、新しいコンセプトを探求したい、プロジェクトを改善したいとお考えの方は、下記のオプションの追加アクティビティをチェックしておくと良いでしょう。

それぞれ、[Easy]、[Medium]、[Difficult]、[Expert] のタグが付けられており、コーディングが必要な場合は [Requires Programming] のタグも付けられています。

1. 配置を変更できるアートの追加 [Medium] (難易度:中)

壁にかかっているアートの位置を入れ替えできるようにする:

  • シンプルなフックを作るには、Socket Interactor コンポーネントで空のオブジェクトを作成し、メッシュを表すために、適切にスケールと回転をしたプリミティブなキューブの子オブジェクトを作成します。
  • 絵画を正しい高さで吊るすためには、絵画を吊るすフレームの位置に Attach Transform を追加する必要があります。

2. 配置を変更できる本の追加 [Difficult] (難易度:高)

ユーザーが好きな順番にきれいに並べ替えられる本棚に本を追加する:

  • 希望の向きに本を表示させるには、正しい向きで空のオブジェクトを作成してから、book オブジェクトを子オブジェクトにしてみてください。

Complete this Tutorial