[Touchdesigner]新卒でもハンドトラッキングできるんじゃ! leapmotionとともに

11143 ワード
TouchDesigner LeapMotion handtracking LeapMotion テキストリンク

ハンドトラッキングとは

実空間内の手の形を検出することを言って、
ARやVR界隈ではかなりおなじみの技術ですね。

って言われてもって方は実際に見せたほうがわりやすいですね。
そんなわけでーーーー

今回作るものはこちら

結構きれいにトラッキングできてるんすよね

環境

touchdesigner 2020.22080
windows10 Pro
leap motion

leap motion ってなにとなったあなたは、

(引用:https://www.yama.info.waseda.ac.jp/ja/research/leap-browsing-api)

手のジェスチャー操作を可能にするデバイスなのですが、
持ってない方はぜひ借りるなり買うなりなんなりしてください。今すぐ。

絶対に後悔はさせません
(決してultraleap社からの案件ではございません)

1.指を作る

leapmotionを接続してください。もしかしたらドライバーとかダウンロードする可能性があるかも。
あれだけ言ってましたので、プロジェクト開いたらまず
leap motion CHOPを出しましょう。

手をleapmotionにかざすと、手に関する様々な情報が数値として返ってきます(なにも反応しない場合はleapmotionがうまく接続されてないかドライバーが入ってない)。
この値を制御していきやす。

まずleapmotionCHOPのパラメーターを写真のように変更お願いシャス。

そしたらmath CHOPつなげてMult-Add → Multiply → 0.01に変更(座標としては値が大きいので小さくします)。
次にselect CHOPつなげます。ここで指のデータを選ぶためにChannel Namesを

hand0/finger[0-5]/next_*:t[xyz]

と入力してください。もしかしたら、macやversionによっては名前が異なる可能性があるので、その際は
channel names横の黒の▶ボタンから同じような名前を見つけて適宜修正してください。

実際に見てもらうと、指の関節の名前とかいろいろ書いてありますが、今回に関すると

hand0(片方の手の)
finger[0-5]（親指から順に小指まで)
next_*(後の第3関節から順に指先まで全部)
t[xyz]（それぞれのxyz座標)

ってな感じです。ご参考に

(引用:https://ameblo.jp/yamatokawashima/entry-12436212230.html)
字が汚い（笑）

ほんならshuffleCHOPをつないで、MethodをSequence Every Nth Channelに、N Valueを3にしてください。
これでそれぞれの座標をx,y,zでまとめてます。

いちおうrename CHOPでToをt[xyz]にしてnull CHOPをつなげます。

次は、モデルを作るためにline SOPを出しましょう。ここでNumber of Pointsを4にします。これで3つの関節を作ります。

次にcopySOPつないでNumber of Copiesを5にします。指は5本ですからね。

そしてchop to SOPつないで先ほどつくったnullちゃんをCHOPにぶち込んでください(ドラック＆ドロップ)

ついでに、compute NormalsもOnに!

そのあと、groupSOPとdeleteSOPをつないでそれぞれ次のように変更してください。

なぜこんなことしてるん？
親指は関節が2つしかないので、無駄に検知したポイントを消してるんですね。

groupSOP上でdisplay optionsでpoint numberを選んでやれば消したいポイントが黄色で表示されることでしょう。
あとはnullつないでgeometryCOMPとconstantMATアタッチさせましょう。
これでleampmotionに手をかざすと5本指が出てくるでしょう。

2.手のひらを作る

さきほどのleapmotionCHOPの値を小さくしたmathCHOPからselectCHOPを3つつなげます。

そして上からChannelNamesを

finger0CHOP
hand0/finger0/next_proximal:t[xyz]
finger1_4CHOP
hand0/finger[1-4]/next_metacarpal:t[xyz]
wristCHOP
hand0/wrist:t[xyz]

※wristは手首のことっすね(リストカットとかいうやん？)

この3つをmergeCHOPで順につないで
その後先ほどの指の時と同じ手順で、

shuffleCHOP(Method:sequence Every Nth Channel、N Value:3 )
→
renameCHOP(To:t[xyz])
→
nullCHOP

手のひらモデルを作るために、circleSOPを使います。
circleSOPを置いて、Divisionsを6にします。

あとで指の根本と手首のポイントでつなげるため、5指+1手首=6ってな感じです。

そのあと、choptoSOPつないで　CHOPの欄に先ほど作った手のひら用CHOPをD&Dします。

D&D!!??

ドラック&ドロップです（笑）

そのあとも指同様、nullSOPからのgeometryCOMP、MATはphongにしましょう。色はご自由に。

3.関節球を作る

まあこれはぶっちゃけなくてもいいんですけど、作ったほうが見た目いいかなって感じです。
leapmotionCHOPからselectCHOPをつなげてCHOP名をtrackingに変更します。
そしておなじみのChannel Namesは

tracking(selectCHOP)
hand0:tracking

にしときましょう。

そしたら、sphereSOPを置き、primitive Typeをpolygonに変更
次にtransformSOPをつなぎ、Uniform Scaleを

op('tracking')['hand0:tracking'] * 0.05

と打ちましょう!
したら、nullSOPつないでgeometryCOMPつないで、MATは手のひらのphongをアタッチ

ここではインスタンシングを使って、配置していきます。

まずSOPtoCHOPを出してSOPの欄に指のnullSOPをD&Dします（笑）

したら、geometryCOMPのinstancingをOnにして、Default instance OP に先ほどのSOPtoCHOPをD&Dします
そして、TranslateXをtx, TranslateYをty, TranslateZをtzにしてください。

インスタンシング完了！！

4.レンダリングじゃーーー!

CameraCOMPとLightCOMP置きましょう。
パラメーターはこちら

仕上げにrenderTOPをおいてrampTOPとoverTOPで重ねれば完成

こんな感じで自分の手をバーチャル空間に出現させることができました。
ちょっと長くなってしまいましたがいかがでしたか？

youtubeでも

文面だとどうしてもわかりずらいなどで、もし映像で見たいのならこちら

発展させると

ハンドトラッキングはほぼ同じですが、手を握ってるかどうかも検知しています。
めちゃくちゃ簡単だけどね（笑）

注意点

leapmotionは精密機器で特に液晶は割れやすくなっていますので注意して下さい。

自分は学生時代に、ゼミの先生から借りたleapmotionの液晶にひびを入れ、土下座して詫びました(詫びろ詫びろ詫びろ!)。

皆さんにこんなみじめな思いはしてほしくない！！
お気をつけて

最後に

新卒の僕でもハンドトラッキングができるんじゃみたいなこと言いましたが、要は先人たちの最高の技術にお世話になってるだけですね。そこは感謝して存分使いましょう。

アドベンドカレンダー初日行かせてもらいましたが、この後も僕よりも何億何兆何京何垓倍もすごい人たちが登場します。
もちろん自分の会社のたき工房の偉大な仲間たちも参加していますので、要チェックや!!

あともう一度いいますが、これは
leapmotionの宣伝案件ではございません。
ご安心を。

みんなtouchやろうぜ！！(イナズマイレブン風)