# TDSW202102
講演メモです。
完成動画はこちら：https://www.youtube.com/watch?v=1xHWrVaKghk
TouchDesignerはこちら : https://derivative.ca/download

## はじめに
### 今日のスケジュール
- オブジェクト（被写体）の作り方
- texture3d TOPの使い方
- geometoryのインスタンシング
- カメラの作り方
- カメラ作りのコツ
- カメラの値をマトリクスにして活用する
- ポストプロセス(エフェクト類)の作り方
- テクスチャのインスタンスを使ったエフェクト
- RGBからCMYKへの変換を使ったエフェクト
- ピクセルのストレッチエフェクト

#### このプロジェクトファイル作成のねらい
- オブジェクト、カメラ、ポスプロをそれぞれオーディオで動かして複合的に見た目をつくる
- プリミティブオブジェクトのインスタンスだけで済むシンプルなしあがり
- リアルタイムで動作する
- 使いまわしがしやすい

以上のようなことを意識しながらプロジェクトファイルを作っていきました。

#### このシーンの処理の流れ

このプロジェクトファイルに限らずほとんどのビジュアライズはこの流れで考えることができます。

## ①オブジェクト（被写体）の作成

カメラで撮影する3Dの被写体についてです。

#### オブジェクトの構造
- Front / 正面(+z)に向かってランダムに配置されている
- Ground / xz平面に敷き詰められている
- Tnnnel / z方向に円を描いて円柱状に配置されている
- Box / 立方体型に配置されている

これらが切り替わっています。

#### texture3d TOPの活用
このオブジェクトはつまるところループ動画をテクスチャとして各インスタンスに割り振っているだけです。
テクスチャをインスタンスごとに別のタイミングで貼り付けるために使っているOPが**texture3D TOP**です。

#### TOPをinstance OPにすることに慣れる

CHOPよりもTOPのほうが圧倒的に大量のインスタンスができます。
今回は2500程度しか複製していませんからほとんど影響がありませんが、ポイントクラウドなど数千万ptのインスタンスを生成したいときなどはTOPじゃないとまったく動きません。
以下注意することです。

- 各Instance OPの解像度(＝サンプル数)をそろえる
- 画像のPixel Formatの設定を32bitにする
----
## ②カメラの作成

被写体を撮影するカメラのふるまいについてです。

#### 一般的なカメラパスの考え方

0秒(または指定の秒数)に初期位置からカメラパスのレールに沿ってドリーして、N秒後に目的地に到着します。

#### 今回のカメラシステムの考え方

オブジェクト周辺を常にLookAtして画角内にとらえつつ、カメラのポジションが常に変化していきます。


白く描かれているのがオブジェクト
黄色の範囲がLookAtのターゲット移動範囲
水色の範囲がカメラの移動範囲
カメラの移動や設定は動的に変化しますが、モチーフによって適切な範囲を制限して常にベストな画角を維持できるようにします。

#### カメラの親子関係

camera COMPを子にして親のnull COMPにtransformアニメーションをまとめています。
camera COMPで直接アニメーションさせるのはfovやwindow sizeなどカメラが持つユニークなアニメーションだけです。
これは実際のカメラにならったカメラマウントの考え方です。DCCツールでも基本的にこの慣習にならってカメラを扱っていることが多いです。
この方法を使うことでカメラオブジェクトの取り回しがしやすくなります。

#### カメラのパラメータをマトリクスで動かす

カメラのパラメータはマトリクス化したCHOPで動かすことができます。
この方法によって実際に描画するカメラをひとつにまとめることができて便利ですし、switch CHOPによる制御によってcamera brend COMPなどを使わなくても簡単にカメラを切り替えることができます。

---
## ③ポストプロセスの作成

毎フレーム流れてくるレンダリング結果(2D)に加える効果についてです。

### ■Pixel Stretch(3D)

カメラから一定の深度ごとに画像を切り取って任意の地点から画像を引きのばします。
画面全体に対して一律に引きのばすのではなく深度で区切って別々に引きのばすことで３D空間に馴染みやすくなります。

#### 一般的なピクセルストレッチ
画面に対して一律かかるのでモチーフによっては立体感を損なってしまったり、加工が強く効きすぎる恐れがあります。

#### 深度を利用したピクセルストレッチ
深度ごとに別々にかかるため画面の変化が過剰になりすぎず画が壊れにくいところが利点です。

#### Pixel Stretch(3D)のイメージ

----

### ■RGB to CMY(K)

レンダリング結果をCMYに変換して色ズレのエフェクトを作っています。
色空間の変更は汎用的なポストプロセスのひとつです。


<iframe width="560" height="315" src="https://www.youtube.com/embed/VTkdCPMQb_g" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

---
### ■TDSWのロゴを使ったエフェクト

画面全体にロゴが出たり消えたりするエフェクトです。
- T/D/S/W/✖が3種類のアニメーションで表示される
- 画像がところどころ矩形状に白黒化する

以上大きく2種類のエフェクトをかけあわせています。