TouchDesigner + 2D

はじめに

TOPはTexture Operatorと呼ばれ、静止画や動画を含む2D画像を扱うOperatorである。

TOPを使いこなせば、PhotoshopのフィルターやAfter Effectsのビデオエフェクトのような画像処理を行うことができる。

Back To Top

TOPの使い方

例外的なものもあるが、TOPは機能によって入力/ソース、効果/フィルタ、出力の3つの種類に分けられる。

 

入力/ソース

  • Movie File In
  • Video Device In
  • Constant
  • Ramp
  • Circle
  • Noise
  • Text

効果/フィルタ

  • Monochrome
  • Level
  • Blur
  • Flip
  • Mirror
  • Tile
  • Transform
  • Composite / Add / Multiply / Over / Screen
  • Displace
  • Edge
  • Lookup

出力

  • Out
  • Movie File Out
  • Video Device Out

Back To Top

準備

サンプルプロジェクトのオペレータを削除して、Palleteを閉じておく。

Back To Top

入力/ソース

Movie File In TOP

画像や映像を読み込むことができる。パラメータウィンドウのFileで画像や映像ファイルを指定できる。

 

Video Device In TOP

映像機器を接続できる。パラメータウィンドウのDeviceのプルダウンリストで接続機器を切り替えることができる。

 

Constant TOP

RGBA(0~1指定)でカラーマットを作成できる。

 

Ramp TOP

様々なグラデーションを作成できる。パラメータウィンドウで色設定、TypeでVertical、Horizontal、Radial等の種類を変更できる。

 

Circle TOP

正円、楕円が作成できる。ボーダーも設定可能。

 

Noise TOP

パラメータにより様々なノイズが作成可能。

 

Text TOP

文字が作成可能。フォント指定、文字色、背景色の設定が可能。

Back To Top

出力

Out TOP

出力用TOP。サンプルプロジェクトではルートのContainer COMPにout1が指定されている。Nullの名称をout1にしても動作可能なのでOut TOPの必然性があるかは不明。

 

Movie File Out TOP

RecordのON/OFFにより録画可能。各種フォーマットに対応、映像データだけでなくイメージシーケンスも書き出し可能。

 

Video Device Out TOP

Blackmagic Design等の対応機器を接続すれば、直接映像出力することが可能。

Back To Top

効果/フィルタ

Monochrome TOP

白黒画像へ変換。

 

Level TOP

Brightness、Gamma、Contrast等を変更可能。

 

Blur TOP

 

Flip TOP

 

Mirror TOP

Tile TOP

 

Transform TOP

移動、回転、スケールが可能。

TileタブのExtendをRepeatにすることでタイリングが可能。Tile TOPは4分割上限だが、Transform TOPでのタイリングは無限に作成可能。

 

Composite TOP(Add / Multiply / Over / Screen他)

2つ以上の画像を合成するオペレータ。OperationのプルダウンリストからAdd / Multiply / Over / Screen等様々な合成を行うことができる。

※Add TOP / Multiply TOP / Over TOP / Screen TOP等はCompositeのOperation設定を変更したものと同義。

 

Displace TOP

グレースケール画像をDisplacement Map(置き換えマップ)として、変形させることができる。

上図は、Dispplace TOPのDisplace Weight: 0.1, 0.1、Noise TOPのHarmonics:0、Exponent: 1.0の設定。Noise TOPのTransform Xを変更すると面白いアニメーションが作成できる。

 

Edge

エッジ抽出

 

Lookup TOP

Ramp TOPと一緒に使うことでイラスト風なエフェクトを作成できる。

上図では、Ramp TOPのInterpolate NotchesをStepにした上で色調整、Lookup TOPのIndex ChannelをLuminanceに変更したもの。

Back To Top

チュートリアル事例

LookupやDisplacementを理解できれば、下の映像のようなチュートリアルが作成可能。

Javier CasadidioのYouTubeチャンネルにはオシャレなチュートリアルが多数アップされているので参考になる。

Back To Top

透明背景を黒にする方法

画像の透明部分はNetwork EditorのOperator上ではチェック柄で表示される。ViewerやPerform Modeを利用すれば透明部分は黒となって表示されるが、Network Editorの段階で透明部分を黒にしたい場合、以下の4つの方法が考えられる。方法③がおススメ。

 

方法① Over

ソース画像(下図ではMovie File In TOP)とConstant TOP(黒設定)をOver TOPで合成する。

Over TOPのFixed LayerをInput 1に設定してMovie File In TOPの解像度に合わせる。

※方法①と方法②では、Constant TOPの色を変更すれば黒以外も可能。

 

方法② Composite (Over)

方法①のOver TOPをComposite TOPに入れ替えたもの。

Composite TOPのOperationをOverに設定。

Fixed LayerはInput 1に設定してMovie File In TOPの解像度に合わせる。

 

方法③ Transform

Transform TOPだけで背景を黒にすることができる。

Comp Over Background ColorをON、Background Colorを0:0:0:1(R:G:B:A)に設定する。

 

方法④ Preferences

EditメニューからPreferencesを開く。TOPsタブでViewer BackgroundをChecker BoardからBlackへ変更する。ただし、この方法では素材画像の透明部分が全てわからなくなるのでお勧めしない。

Back To Top