>   >  Unityでつくるインタラクティブコンテンツ:第3回:複数人の顔検出に対応させる
第3回:複数人の顔検出に対応させる

第3回:複数人の顔検出に対応させる

<2>お面の複数表示に対応させる

1人しか認識できないと面白くないですよね。複数人に対応できるようにしていきましょう。処理としては2つ必要です。1つは、お面を複数出せるようにすること、もう1つは顔検出した位置に同じお面を表示し続けるようにすること。

1つずつ考えていきます。まず、表示できるお面の画像を増やしていきます。素材は前回と同じフリー素材配布サイト「Frame illust」の「[ハロウィン]カボチャランタン(ジャックランタン)のイラスト」から、前回とは別バージョンのイラストを使わせてもらいます。画像を保存して、jack2.png、jack3.pngとしてUnityのImageフォルダにインポートしましょう。

前回、FaceDetectionWebCamTextureExample .csに以下のように追記しましたね。

[SerializeField] private UnityEngine.UI.Image _mask;

これを配列に変更する必要があります(前回private指定を忘れていました)。3種類の画像を表示できるようにしたFaceDetectionWebCamTextureExample.csをGitHub Gistに置きましたので、このコードを使用してください。Unity Editorに戻るとMaskのパラメータが下画像のように変化しているはずです。

これはMaskが複数の画像を扱えるようになったことを示します。Sizeに3を指定してください。

次にHierarchyに移動して、Maskを2つ複製してそれぞれMask2、Mask3と名前を付けます。

これまでの手順を全て行うと以下のような状態になります。

その後Quadゲームオブジェクトを選択し、Mask、Mask2、Mask3ゲームオブジェクトをそれぞれFace Detection Web Cam Texture ExampleコンポーネントのElement 0、Element 1、Element 2にアサインします。

これで、Unityに3種類の画像を登録することができました。

<3>それぞれの顔をトラッキングする

2人以上で試すとすぐに気が付くと思いますが、頻繁にお面が入れ替わってしまうはずです。Aの人にはAのお面、Bの人にはBのお面をかぶせ続けたいですよね。これを行うためにはそれぞれの顔をトラッキングする必要があります。様々な方法がありますが、良いまとめがありましたので紹介します。

●Object Tracking using OpenCV
https://www.learnopencv.com/object-tracking-using-opencv-cpp-python/

このサイトにも書いてありますが、顔検出をする場合は画像ベースでのトラッキングを行う必要はあまりありません。前フレームでの検出位置と新しい検出位置を比べて、最も近い者同士が対応すると考えるのが妥当そうです。

処理のながれとしては以下のようになります。

1:OpenCVで顔検出を行う
2:トラッキング可能な数だけ検出点を割り当て、トラッキング状態にする
3:トラッキングされている位置から最も近い検出点を新しい位置とみなす
4:トラッキングされている位置の周りに新たな検出点がなければトラッキングをやめる
5:上記をループする

上記の処理をざっとコードにしたものをGitHub Gistに置きましたので、実行してみてください。下記のような結果になれば成功です。

これでお面コンテンツの基本はできました。次回はこのコードの簡単な解説と、JIDO-RHYTHMのようなコンテンツをつくるには何が必要かを考えていきたいと思います。



Profile.

高田稔則/Toshinori Takata(Codelight)
Codelight株式会社 代表取締役・インタラクションエンジニア
フリーランス、株式会社TBSテレビ等で映画CG制作、株式会社ソニー・コンピュータエンタテインメント(現 ソニー・インタラクティブエンタテインメント)でPS4のOSD開発などを経て2006年にCodelight株式会社を設立。インタラクティブコンテンツの制作を中核として、製造業向けのプロトタイプ開発なども行う
www.codelight.co.jp




その他の連載