芸大 – メディアアート・プログラミング I 2025
TouchDesigner実践 1 – SOPのレンダリングとマテリアル
本日の内容
これまでの内容でSOPのレンダリングの基本を学びました。今回の講義では、ここからさらに進んで、SOPのレンダリングの詳細なテクニックやマテリアルの設定方法を学びます。SOPにテクスチャ (画像) をマッピングする「テクスチャーマッピング (Texture Mapping)」、テクスチャの法線マップを使用して表面の凹凸を表現する「バンプマッピング (Bump Mapping)」、テクスチャの高さ情報を使用して頂点を変位させる「ハイトマッピング (Height Mapping)」、物理ベースのマテリアル (PBR) について学んでいきます。これらのテクニックは、SOPのレンダリングにおいて非常に重要な要素です。これらを理解することで、よりリアルな表現が可能になります。
SOPのレンダリングとマテリアル概要
TouchDesignerにおいて、SOP (Surface Operator) は3Dの形状データを作成・編集するための基本要素です。しかし、SOP単体では最終的なビジュアルとして表示されません。SOPをレンダリングし、画面に描画するためには、Geometry COMPにSOPを接続し、Camera COMPで視点を、Light COMPで照明を設定し、それらをRender TOPで統合して2Dイメージとして出力するという一連のパイプラインが必要です。
そして、SOPで作成した形状に「どのような見た目を与えるか」を決定するのがマテリアル (MAT) の役割です。マテリアルは、オブジェクトの色、光沢、質感、透明度などを定義します。本日は、基本的なPhong MATから始め、テクスチャを使ってより詳細な表現を加えるテクスチャーマッピング、表面に擬似的な凹凸を与えるバンプマッピング、実際に頂点を変位させるハイトマッピング、そして現実世界の光の挙動を再現するPBRマテリアルといった、SOPの表現力を飛躍的に向上させるテクニックを学んでいきます。これらの要素を組み合わせることで、よりリッチでリアルな3Dシーンを構築することが可能になります。
SOPのレンダリング基本 – 法線マップとマテリアル
法線は、ポリゴンの表面がどちらを向いているかを示す情報で、光の当たり方や陰影の計算に不可欠です。SOPを作成・変形する際には、法線が正しく設定されていることが重要です。Attribute Create SOPで法線を再計算することで変形したSOPの法線を正しく補正することが可能です。Phong MATは、拡散反射光（Diffuse）、鏡面反射光（Specular）、光沢（Shininess）などを設定できる基本的なマテリアルです。
法線ベクトル
サンプルプログラム
ポイント:
- Sphere SOPで球を作成し、Noise SOPで表面を変形させています。
- Geometry COMPに上記のSOPを接続し、レンダリング対象とします。
- Phong MATを作成し、Geometry COMPの Material パラメータにドラッグ＆ドロップして適用します。
- Phong MATの Diffuse Color や Specular Color を調整して、基本的な質感を設定します。
- Light COMPを配置し、位置や種類（例: Point Light, Directional Light）を調整してライティングを行います。
- SOPの法線が正しく計算されていることを確認します。必要であればAttribute Create SOPで法線を再計算（Compute Normalsをオン）します。
- この例ではSphere SOPをNoise SOPで変形したため不正確になった法線を、Attribute Create SOPによって補正しています。
テクスチャーマッピング
テクスチャーマッピングは、2Dの画像を3Dオブジェクトの表面に貼り付けることで、オブジェクトに模様やディテールを追加する基本的なテクニックです。オブジェクトにはUV座標と呼ばれる、テクスチャ上のどの部分をオブジェクトのどの面に貼り付けるかの情報が必要です。
サンプルプログラム
ポイント:
- Movie File In TOPなどで画像ファイルを読み込みます (またはNoise TOPなどでプロシージャルに生成)。
- Phong MATのColor Mapパラメータに、読み込んだ画像テクスチャ (TOP) を指定します。
- SOPにUV座標が適切に設定されている必要があります。Sphere SOPなどのプリミティブはデフォルトでUV座標を持っています。
- Texture SOPを使用すると、UV座標のスケール、オフセット、回転などを調整したり、投影方法を変更したりできます。
- この例では、Noise SOPで変形した球体に、外部から読み込んだ画像（またはプロシージャルテクスチャ）をカラーマップとして適用しています。
バンプマッピング (Bump Mapping)
バンプマッピングは、テクスチャを使用してオブジェクトの表面に細かい凹凸があるように見せかけるテクニックです。実際にはジオメトリの形状を変更せず、光の当たり方を変えることで陰影を生み出し、擬似的な凹凸を表現します。一般的には、法線マップ（Normal Map）と呼ばれる特殊な画像（通常、青紫色っぽい見た目）を使用します。
バンプマッピング (Bump Mapping)
法線マップ (Normal Map)
面の向き（法線方向）をRGBカラーで表現したテクスチャです。赤はX軸、緑はY軸、青はZ軸の法線成分に対応。
サンプルプログラム
ポイント:
- 法線マップ用のテクスチャ (TOP) を用意します。これは専用に作成された画像か、Normal Map TOPなどでグレースケールのハイトマップから生成できます。
- Phong MATの Normal Map (Bump) パラメータのトグルをオンにし、用意した法線マップテクスチャを指定します。
- Bump Scale パラメータで凹凸の強さを調整できます。
- バンプマッピングは視覚的なディテールを追加しますが、オブジェクトのシルエットは変化しません。
- この例では、球体にNoise TOPで作成したテクスチャーをマッピングして、さらに同じ画像から生成した法線マップを適用し、表面に凹凸を持たせています。これにより、よりリアルな質感を実現しています。
ハイトマッピングと頂点変位 (Height Mapping and Vertex Displacement)
ハイトマッピング（ディスプレイスメントマッピングとも呼ばれる）は、グレースケールのハイトマップ（高さ情報を持つ画像）に基づいて、実際にジオメトリの頂点を移動させるテクニックです。これにより、バンプマッピングよりもリアルな凹凸や変形をオブジェクトに加えることができます。オブジェクトのシルエットも変化します。
ハイトマッピング
法線マップ (Normal Map) とハイトマップ (Height Map) の比較
サンプルプログラム
ポイント:
- ハイトマップとしてグレースケールのテクスチャ (TOP) を用意します。画像の明るい部分がより高く、暗い部分がより低く変位します。
- PBR MATの Displacement セクションで設定を行います。
- Enable Height Map をオンにします。
- Height Map パラメータにハイトマップテクスチャを指定します。
- Displace Scale で変位の大きさを調整します。
- Displace Midpoint で変位の基準となる高さを調整します (通常0.5)。
- 効果をはっきりと確認するためには、ジオメトリにある程度の頂点数が必要です。頂点数が少ないと、滑らかな変位になりません。
- この例では、バンプマッピングした球体に、さらにハイトマップを適用して、よりダイナミックな形状変化や凹凸を生み出しています。
物理ベースのマテリアル (PBR Materials)
PBR (Physically Based Rendering) マテリアルは、光が現実世界の物質とどのように相互作用するかをより正確にモデル化することで、非常にリアルな質感を表現する手法です。PBR MATを使用し、Base Color (基本色)、Metallic (金属度)、Roughness (表面の粗さ) などのパラメータを調整したり、対応するテクスチャを割り当てたりします。
サンプルプログラム
ポイント:
- PBR MATを作成し、Geometry COMPの Material パラメータに適用します。
- Environment Light COMPと環境マップ (HDR画像など) を使用すると、周囲の環境を反射し、よりリアルなライティング結果が得られます。
- この例では、Noise SOPで変形した球体にPBR MATを適用し、メタリック感やラフネスを調整して、よりフォトリアルな質感を追求しています。
- PBRマテリアルを適用するパッチングは少し複雑なので、実際に作成しながら解説していきます。
応用 1: いろいろ機能を詰め込み
ここまで出てきたSOPのレンダリングに関する様々な機能を、たくさん盛り込んでみました。
- ジオメトリ・インスタンシング
- Noise TOPによるアニメーション
- テクスチャーマッピング
- バンプマッピング
- PBRマテリアル
詳細は完成したプログラムを確認してみてください!
サンプルプログラム
応用2: ノイズに映りこむ光と陰
ノイズで変形させたGrid SOPをPBRレンダリングすることで、ノイズに映る光と陰をリアルに描画しています。詳細はパッチをみながら解説していきます!
サンプルプログラム
まとめ
本日の講義では、TouchDesignerにおけるSOPのレンダリング品質と表現力を高めるための重要なテクニックを幅広く学びました。
まず、SOPのレンダリングにおける法線の役割と、基本的なPhong MATを用いた質感設定の基礎を確認しました。次に、2D画像を3Dオブジェクトに貼り付けるテクスチャーマッピング、法線マップを利用して表面のディテールを豊かにするバンプマッピング、そしてハイトマップを用いて実際にジオメトリを変形させるハイトマッピングについて、それぞれの仕組みとTouchDesignerでの設定方法を実践的に見てきました。最後に、物理ベースのレンダリングを実現するPBRマテリアルを紹介し、Base Color、Metallic、Roughnessといったパラメータや各種マップを駆使することで、より現実に近いフォトリアルな質感を追求できることを学びました。
これらのマッピング技術やPBRマテリアルを理解し、適切に組み合わせることで、単純なSOPからでも驚くほど多様でリアルなビジュアルを生み出すことができます。今回学んだ知識を基に、様々なSOP、テクスチャ、マテリアル設定を試しながら、ぜひ皆さん自身のクリエイティブな表現を探求してください。
アンケート
本日の講義参加した方は下記のアンケートに回答してください。
