第2回: 図形・映像の生成

目次

ダウンロードからインストールまで

TouchDesignerは無料版・有料版とありますが,アプリをダウンロードしてすぐ使用できるわけではありません.ここでは,TouchDesignerのダウンロードからインストールまでの流れを順を追って説明します.

ダウンロード

以下のリンクにアクセスしダウンロードする.
https://derivative.ca/download


インストール

macOS: アプリケーションフォルダにコピーする

windows: インストーラ画面に従いインストールする


ライセンス

ライセンスの種類 価格 詳細
non commercial 無料 非商用(出力解像度の制限あり)
educational $300で1年間アップデート可 non commercialで使用できないOP解放
commercial $600で1年間アップデート可 同上
pro $2200で1年間アップデート可 commercialで使用できないOP解放
電話相談可能

non-commercialは非商用利用に限られ,さらに出力解像度が1280 x 1280に限られてしまいます.
また,使用できない機能がそこそこありますが,学生であれば一旦non-commercialから始めるのが良いでしょう.
non-commercialライセンスは年間10個まで発行可能で,発行しきってもDerivativeに問い合わせれば新たに発行してくれます.
educational以上のライセンスは購入から1年間ライセンスが有効となり,アップデート可能です.
その後TouchDesigner自体が使用できなくなるわけではなく,その後アップデートしなければ利用可能です.


ライセンス認証

初回起動時は,keyManagerのウィンドウが立ち上がり,ライセンス認証を求められます.
今回はnon commercialのライセンスキーを入力する必要があります.
Not registered yet? をクリックしましょう.


websiteに誘導されるので,必要な情報を入力してRegisterボタンをクリックしてアカウントを作成します.


その後メールが来るのでアカウントの確認のリンクをクリックしてログインしましょう.
自動でログインできない場合は,
https://derivative.ca/
のMY ACCOUNTを押して,アカウント名とパスワードを入力してログインします.


ログイン後は以下のMY LICENSESにアクセスします.


LINCENSESメニューにTOUCHDESIGNER NON-NOMMERCIALがあります.
ここのDetailsをクリックします.


これまで付与したライセンスキー一覧が表示されます.
みなさんはまだライセンスキーを発行したことがないので,一覧には何も表示されずCREATE KEYボタンが表示されています.
CREATE KEYをクリックします.


System CodeとMachine nameを入力する欄があるので,自分のTouchDesignerのKey Manager画面にある情報を手入力します.
間違いなく入力できたら,GENERATEボタンをクリックします.

System CodeとMachine nameはこちらに記載されています.


ライセンスが発行されるため,ドラッグしてコピーしておきます.

TouchDesignerのアプリに戻ります.
戻ったらKey ManagerウィンドウのInstallタブに移動します.
その中にEnter keyと書いてあるテキストフィールドがあるので,先程コピーしたライセンスをペーストします.
その後,Install keyボタンをクリックすると,TouchDesignerを使用することができるようになります.


使う前に

UI


基本操作

Operator windowを出す: レフトクリック2回 or tabキー
ライトクリックメニューを出す: ライトクリック or ダブルタップ
Operatorをドラッグして選択: ライトクリックでドラッグ or shiftキー+マウス移動
Operatorの情報を見る: ミドルクリック or altキー+ダブルタップ

オペレータの種類と役割

TOPはTexture Operatorの略で,2Dの画像処理などを行なうオペレータです.ADOBEで言えばPhotoshopのようなイメージです.


CHOPはChannel Operatorの略で,数値として処理するためのオペレータです.演算やデバイスからの入出力を扱ったりします.


SOPはSurface Operatorの略で3Dオブジェクトを扱ったりモデリングしたりするオペレータです.


MatはMeterialの略で,3Dオブジェクトの質感を決めるオペレータです.SOPと共に使用することになります.


DATはDataの略で,データベースや外部デバイスとのデータのやりとりで使用するオペレータです.CHOPと重複する機能もありますが,scriptによってCHOPより詳細に設定可能だったります.


COMPはcomponentの略で,大きめの構造を持ったオペレータです.複数のオペレータをまとめて作られた箱のようなイメージです.


映像を生成する

座標系

座標系はOpenGLに等しく,系が右手系でup軸はYとなります.
下の図のようになります.
これまでやってきたProcessingと大きく異なる点なので注意しましょう.

図形を描く


これで全てではありませんが,

  • Circle TOP
  • Rectangle TOP
  • Constant TOP
  • Text TOP

などがあります.
Processingからの対応で言えば,以下のようになるでしょう.

ellipse(x, y, w, h);
rect(x, y, w, h);
background(r, g, b); // 厳密には異なる
text("text", x, y);

Circle TOP


Rectangle TOP


Constant TOP


Text TOP


主な設定事項

名称 機能 主な設定事項
Circle 楕円を描く 半径,回転,中心座標,塗り色,
塗り色透明度,背景色,背景不透明度,枠線太さ
Rectangle 四角形を描く 幅高さ,回転,中心座標,塗り色,
塗り不透明度,背景色,背景不透明度,枠線太さ
Constant 塗画像を描く 塗り色,塗り不透明度
Text 文字を描く テキスト文字列,フォント,サイズ,方向,
カーニング,ラインスペース,揃え,色

色の設定

RGB値(赤,緑,青)+A値(透明度)で表すことはProcessingと同じですが,値が0 – 1の小数で表されます.

ファイルを再生する

カメラの映像を取り込む

素材を合成する

素材を選択する

主な設定事項

名称 機能 主な設定事項
Composition 2つのインプットを指定の合成方法で合成する 合成方法選択
Switch 複数のインプットのうち1つだけ描く テクスチャ選択(整数)

解像度について

解像度には注意する必要があります.何かを生成した場合には256 x 256 pxとなります.
例えば1280 x 720 pxの画像上にComposite TOPで重ねたい場合は,Operater windowのCommon > Resolutionで解像度を合わせたりするなどの対策をすると良いです.

映像として出力する

今はまだ厳密に理解する必要がありませんが,プロジェクトファイルを最終的にウィンドウ出力したい場合には,Out TOPに繋げ,
F1キー
を押すことでウィンドウとして表示できます.
macOSの場合はfnキーを押しながら1,タッチバー付きのmacbook proの場合は,fnキーを押すとタッチバーにF1が出現します.

少しアニメーションする

Parameter windowの変更したいパラメータに以下を打ち込んでみましょう.

me.time.frame / me.time.end

前者はタイムラインの現在のフレームを示し,校舎は全体のフレーム数を示します.
つまり,少しずつ 0 – 1 に変化していくことになります.
これを利用して円を移動させたり,大きくしてみましょう.

課題

授業内課題

以下のようにSwitch TOPで信号が切り替わるプロジェクトを作成しなさい.

締切: 2021年4月15日16:00
提出先: 情デサーバー 02_授業内/

来週までの課題

これまで習った内容を使って,TOPでアニメーションを作りなさい.
締切: 2021年4月21日23:59
提出先: 情デサーバー 03_週課題/