【MagicLeap入門】ハンドトラッキングの使い方を学ぶ!
MagicLeap入門の第1弾はハンドトラッキングの使い方をご紹介します。
ハンドトラッキングを利用すれば、コントローラーを使用せずにオブジェクトの操作などをすることができます。
今回はUnityを利用して簡単なサンプルアプリを作成しながらハンドトラッキングを学んでいきます。
※本記事ではMagicLeapの環境構築方法などは省略しています。Unityのセットアップは下記の記事をご参考ください。
参考記事)【MagicLeap入門】Unityのセットアップ手順を1から解説!
※本記事はUnityを触ったことがある方向けの記事となっております。
※Unityの使用方法については以下記事をご参考ください。
参考記事)【Unity入門】ゲーム開発ができるようになる基礎知識まとめ
※MagicLeapの開発環境構築については以下をご参考ください。
参考記事)【MagicLeap公式】Install the Tools
参考記事)【MagicLeap公式】Get Started Unity
ハンドトラッキングとは
ハンドトラッキングとは、リアルタイムで手の動きや形を読み取る技術です。
MagicLeapではジェスチャーを読み取るだけでなく、手のキーポイント(掌の位置や親指の位置など)を追跡することができます。
現時点で読み取ることがジェスチャーは以下の8つです。

ハンドトラッキングのサンプルプログラムを動かしてイメージを掴んでみましょう。
インポートしてきたMagicLeapのフォルダ内のサンプルを実行して確認します。(MagicLeapをUnityで使用するための準備は改めてご紹介いたします。)
(任意フォルダ)→MagicLeap→Examples→HandTrackingを選択して実行してみます。

GIFの通り、今現在のジェスチャーとキーポイントの位置をリアルタイムに認識することができます。
ハンドトラッキングを使用したサンプルプログラム作成
それでは実際にハンドトラッキングを利用したサンプルプログラムを作成していきましょう。
まずはじめに適当なシーンを作成してください。
次にデフォルトのMainCameraを(任意フォルダ)→MagicLeap→Core→Prefabs→MainCameraに置き換えてください。
たったこれだけでも動かすことができますが、これでは何も表示されないので何が起きているのかわかりません。
まずはキューブを自分の目の前に設置してみましょう。
大きさや位置は任意ですが、例では以下のように設定して設置します。
- Position : (x,y,z) = (0,0,0.75)
- Rotation : (x,y,z) = (0,0,0)
- Scale : (x,y,z) = (0.1,0.1,0.1)
これで実行すると白いキューブが目の前に出現します。

次にジェスチャーによってキューブの色を変化させるスクリプトを作成します。
以下のスクリプト「ColorChanger.cs」を作成してください。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 |
using System.Collections; using System.Collections.Generic; using UnityEngine; using UnityEngine.XR.MagicLeap; using UnityEngine.UI; public class ColorChanger : MonoBehaviour { // 使用するジェスチャーをEnumで準備 public enum HandPoses { Ok, Finger, Thumb, OpenHand, Fist, NoPose, Pinch }; // 現在のジェスチャーを保存 private HandPoses pose = HandPoses.NoPose; // 色を変更するオブジェクト [SerializeField] private GameObject cube; // 使用するジェスチャーの配列 private MLHandKeyPose[] _gestures; private void Start() { // ハンドトラッキングをスタート MLHands.Start(); // 使用するジェスチャーを配列に格納 _gestures = new MLHandKeyPose[5]; _gestures[0] = MLHandKeyPose.Ok; _gestures[1] = MLHandKeyPose.Finger; _gestures[2] = MLHandKeyPose.OpenHand; _gestures[3] = MLHandKeyPose.Fist; _gestures[4] = MLHandKeyPose.Thumb; _gestures[5] = MLHandKeyPose.Pinch; // ジェスチャーを登録 MLHands.KeyPoseManager.EnableKeyPoses(_gestures, true, false); } private void OnDestroy() { // オブジェクトが削除されたタイミングでハンドジェスチャーを終了 MLHands.Stop(); } private void Update() { // ジェスチャーごとに色を変更する // GetGestureで左手のジェスチャーを判定 if (IsGesture(MLHands.Left, MLHandKeyPose.Pinch)) { // 各ジェスチャーごとの処理を実装 pose = HandPoses.Pinch; cube.GetComponent<Renderer>().material.color = Color.yellow; } else if (IsGesture(MLHands.Left, MLHandKeyPose.Finger)) { pose = HandPoses.Finger; cube.GetComponent<Renderer>().material.color = Color.white; } else if (IsGesture(MLHands.Left, MLHandKeyPose.OpenHand)) { pose = HandPoses.OpenHand; cube.GetComponent<Renderer>().material.color = Color.black; } else if (IsGesture(MLHands.Left, MLHandKeyPose.Fist)) { pose = HandPoses.Fist; cube.GetComponent<Renderer>().material.color = Color.blue; } else if (IsGesture(MLHands.Left, MLHandKeyPose.Thumb)) { pose = HandPoses.Thumb; cube.GetComponent<Renderer>().material.color = Color.green; } else { pose = HandPoses.NoPose; cube.GetComponent<Renderer>().material.color = Color.gray; } } // ジェスチャーを取得するためのメソッド private bool IsGesture(MLHand hand, MLHandKeyPose type) { if (hand != null) { if (hand.KeyPose == type) { if (hand.KeyPoseConfidence > 0.9f) { return true; } } } return false; } } |
このスクリプトを任意の空オブジェクト(今回はColorChangerオブジェクトを作成)にアタッチして、色を変えたいオブジェクトをスクリプトにアタッチします。
これで特定のジェスチャーをすることでオブジェクトの色を変化させるサンプルプロジェクトが完成しました。
仕組みはとてもシンプルで、以下の手順でハンドジェスチャーを実現しています。
- 使用したいジェスチャーをEnumとして準備(10行目)
- Start関数内でハンドトラッキングをスタート(24行目)
- 使用したいジェスチャーをキーポーズとして格納(27〜33行目)
- 作成したキーポーズをMLHandsのキーポーズマネージャーに登録(36行目)
- 引数で渡したジェスチャーかどうかを判定するIsGesture関数を準備(83〜96行目)
- Update関数内でIsGestureを使用して特定のジェスチャーをしている時の処理を準備(49〜79行目)
- OnDestroy関数が呼び出された段階でハンドジェスチャーを終了(42行目)
※右手で判定を行いたい場合はUpdate関数内のif文の条件を「MLHands.Left」から「MLHands.Right」に変更するだけです。
基本的にMagicLeapが提供するAPIを利用するだけで簡単にハンドジェスチャーを実現することができます。
実際に実行して確認してみましょう。

ジェスチャーごとに色が変化していることを確認できました。
まとめ
いかがでしたでしょうか。
MagicLeapではとても簡単にハンドジェスチャーを実装できることがおわかりいただけたでしょうか。
今回は最低限の機能のご紹介でしたが、次回以降ハンドジェスチャーのユースケースもご紹介していきたいと思っております。
XR-HUBでは引き続きMagicLeapの使い方をご紹介していきますのでぜひご参考ください。
本記事が少しでもMagicLeapやMR開発の共創につながれば幸いです。
参考記事)【MagicLeap入門】Unityのセットアップ手順を1から解説!
参考記事)【MagicLeap入門】3Dオブジェクトを任意の平面に設置する!

この記事はいかがでしたか?
もし「参考になった」「面白かった」という場合は、応援シェアお願いします!