# はじめに こんにちは、なるみんです。 2017年の TouchDesigner Advent Calender にて 「[TouchDesigner 使いはじめた頃知りたかったことTips](https://qiita.com/narumin256/items/25710e6952079e1b3348#%E3%81%AF%E3%81%98%E3%82%81%E3%81%AB)」というタイトルで、私自身TouchDesignerを使っていて「もっと早く知りたかったー！」と思っていたところや、意外と知らない便利なオペレータについて8個+1Tips紹介させていただきました。 2018年は第２弾ということで6個書きます！
サンプルと呼ぶほどでもないですがサンプルはこちら▼
ここだよ
紹介する内容
1. Replicate COMP (オペレータを複製する方法)
2. Animation COMP (キーフレームを打つ方法)
3. Cash TOPとReoder TOPでRGB Delay (かっこよくなる)
4. OP Viewer TOP / Screen Grab TOP (見ればわかる)
5. Trace SOP (2Dを3D化できる)
6. Panel CHOP (上の階層のCOMP上でカーソルの位置やタイプしたキーがわかる)
Replicate COMP (オペレータを複製する方法)
Replicate COMPは参照させたTable DATの行（row）の数だけオペレータを複製させるオペレータです。今回はCircle SOPを使って、オペレータディジット数の頂点数で作られる多角形を複製してみます。
※オペレータディジットというのはCircle SOPを設置した時に自動で名付けられるcircle1の「１」の部分です。circleXという名前ならXに該当する数です。
- 【Replicate COMP】の[Replicator]タブ->[Master Operator]に【Circle SOP(circle1)】をドラッグ&ドロップします。
- 【Replicate COMP】の[Replicator]タブ->[Template DAT Table]に【Table DAT(tabele1)】をドラッグ&ドロップします。【Table DAT(tabele1)】の[Table]タブ->[Exact Dementions]をONにし、[row]にオペレータを複製させたい数を入力します。
- オペレータディジット数の頂点数で作られる多角形を制作したいので、【Circle SOP(circle1)】の[Divisions]のなかに
me.digits + 2というスクリプトを書きます。こうすることで、「item1」という名前の【Circle SOP】は1(digit number)+2 = 3個の頂点がある多角形(三角形)、「item2」という名前の【Circle SOP】は2(digit number)+2 = 4個の頂点がある多角形（四角形）、、というように、頂点数の数が増えていく多角形の生成を実現できます。 - 【Replicate COMP】の[Replicator]タブ->[Recreate All Operators]の[All]をクリックすると【Table DAT(tabele1)】の[row]の数だけ【Circle SOP】が複製されます。（Master Operatorの(circle1)を含む）
複製されたオペレータはデフォルトでは「itemX」(Xに整数)という名前になっています。
3~X角形の多角形が複製されました！
Animation COMP (キーフレームを打つ方法)
【Animation COMP】はTouchDesignerでキーフレームアニメーションチャンネルを打つことができるオペレータです。以下の手順で陽気に楽しく動くバナナを作ってみましょう。
1.【Animation COMP】を設置し、【Null CHOP】をつなぎます。
2.【MovieFilein TOP】、【Trandform TOP】、【Null TOP】の順でつなぎます。【MovieFilein TOP】のバナナは【Trandform TOP】の[Scale]で小さくしておきましょう。
3. 【Animation COMP】の上で右クリックし、[Animation Edit]を選択します。TouchDesignerの画面下1/3にキーフレームを設定できるエディタが出てきます。エディタ右側[Animation Setting]の[Add Channel]をクリックすると[tx][ty][tz]と書かれたラインが引かれます。今回はTOP(2次元画像や映像の処理をするオペレータ)を使うので[tz]の情報は使わないため、[×]を押して消してください。
4.スペースキーを押してTouchDesignerのタイムラインを一時停止してください。
5. [tx][ty]それぞれのラインの上をAltキーをおしながクリックすると、波の形状を編集できるポイントが現れます。ポイントを複数置いて、ぐにゃぐにゃした波を作ってみましょう。ポイントはDeleteキーで消すことができます。
6.キーフレームを打ち終わったら再びスペースキーを押してタイムラインを再生してください。【Animation COMP】のなかの[tx][ty]の数値が5.の手順で売ったキーフレーム通りに動いているのがわかるかと思います。
7.あとはみんな大好きエクスポートです。【Animation COMP】につながった【Null CHOP】の[tx][ty]の値を【Movie File in TOP】につながった【Transform TOP】の[transform]にエクスポートしてください。バナナが楽しく動きます。
Cache TOPとReoder TOPでRGB Delay (かっこよくなる)
【Cache TOP】と【Reorder TOP】をつかって「RGB Delay」という効果を作ります。
1. 【Box SOP】と【Transform SOP】、【Geometry COMP】【Camera COMP】【Light COMP】【Render TOP】を使って回転するBoxを作ります。（細かい方法は割愛）
2. 【Render TOP】から【Cache TOP】を3つつなぎます。それぞれ【Cache TOP】の[Cacheタブ]->[Step Size]を例えば「1」「8」「16」のように異なる数値を入れます。【Cache TOP】は接続前のTOPの[Step Size]フレーム前のフレームから再生するTOPです。例の場合、1フレーム過去、8フレーム過去、16フレーム過去が再生されています。
3. 3つの【Cache TOP】を4つのinputの上から順に【Reorder TOP】につなぎます。（一番下のinput口があまります。）【Reorder TOP】の[Reorderタブ]->
[Output Red]->[input1]
[Output Green]->[input2]
[Output Blue]->[input3]
上記のように変更します。
このように設定することによって、
【Render TOP】と1フレーム過去の【Cache TOP】ズレは赤（Red）、
【Render TOP】と8フレーム過去の【Cache TOP】ズレは緑（Green）、
【Render TOP】と16フレーム過去の【Cache TOP】ズレは青（Blue）
として【Reorder TOP】内に現れます。かっこいい！
OP Viewer TOP / Screen Grab TOP (見ればわかる)
こちらはただの紹介です。
【Screen Grab TOP】はPCの画面をキャプチャすることができます。
【OP Viewer TOP】は[Sourseタブ]->[Operator Viewer]にドラック＆ドロップしたオペレータのにビューされている画像をそのままキャプチャしTOPとして書き出します。
Trace SOP (2Dを3D化できる)
TOPの画像を3Dに変換してくれるSOPです。(厚みをつけるにはExtrude SOPを使ってみてください。使ってみましたが厚みの部分がなんかおかしくて私は諦めました）
以下の手順で薄っぺらいバナナを回してみましょう。
1. 【Movie File in TOP】を【Trace SOP】の上にドラッグ&ドロップします。バナナがトレースされてSOPとして扱えるようになりました。 <-説明ここだけで大丈夫ですね。
2. 【Trace SOP】の隣に【Transform SOP】、【Geometry COMP】をつなぎ3Dレンダリングのお約束【Camera COMP】【Light COMP】【Render TOP】をおきます。
3.【Phong MAT】に【Movie File in TOP】をドラッグ&ドロップし、マテリアルとして割り当てます。【Phong MAT】を【Geometry COMP】にドラッグ&ドロップします。
4. 【Transform SOP】の[Rotate]のty(真ん中)に```absTime.frame * 0.5```と記入します。薄っぺらいバナナが回りました！
Panel CHOP (一個階層上のCOMPの上でやったことがわかる)
【Panel COMP】は一向上の階層のコンポーネントの上で行った操作をチャンネルとして取り出すことができるオペレータです。
- 【Container COMP】を設置し、【Container COMP】の上で右クリックし、[View]を選択し別ウィンドウを立ち上げます。
- 【Container COMP】の内部に入り、【Panel CHOP】をおいてください。1.の手順で立ち上げたウィンドウの上でカーソルを動かしたり、クリックをすると【Panel CHOP】のチャンネルが変化したことがわかります。
- 【Panel CHOP】に【Select CHOP】をつなぎ、[Channel Selects]からrollu, rollv, select, cmdを選択します。別ウィンドウの上でカーソルを動かすとrollu, rollvでu,v値で座標を取得できます。selectでクリックしたかどうかがわかります。cmdではウィンドウ上でcommandキーを押したことがわかります。
おわりに
TouchDesignerを学ぶなら！
TouchDesigner Study Weekend！
遊びに来てね！