GLSL MAT 完全ガイド | 使い方・パラメータ解説【TouchDesigner】

※当サイトにはプロモーションリンクが含まれます。

GLSL MAT によるカスタムシェーダの構成図

記事更新の通知はXでアナウンス٩(๑❛ᴗ❛๑)
→ @maru6o6をフォロー

概要 📖 – カスタム GLSL シェーダによる任意マテリアル

GLSL MATは、Vertex / Pixel / Geometry シェーダを GLSL コードで自由に記述できる、最も自由度の高いカスタムシェーダ MATです。Phong MAT / PBR MAT で書き出した GLSL コードを起点に独自シェーダへ拡張する、あるいは Inherit Uniforms/Samplers from で別 GLSL MAT のユニフォームを継承する運用が一般的です。

主な用途 🎯

  • Vertex / Pixel / Geometry シェーダを Text DAT に書いて自由に表現
  • Phong / PBR では実現できない独自のシェーディングを実装
  • Uniforms / Samplers / Vectors / Matrices / Constants / Arraysを経由してパラメータ・テクスチャをシェーダに供給
  • Geometry Shader で頂点を動的に増減 (パーティクル / インスタンシング)
  • Two-Sided Coloring による表裏別カラー制御

データフロー 🔄

入力: Vertex / Pixel / Geometry Shader Text DAT + Samplers / Vectors / Matrices / Constants
 ↓
GLSL コンパイル → ピクセル単位でシェーダ実行
 ↓
出力: Geometry COMP の Material 入力へ

Tips

初心者の方は、以下日本語書籍も手元にあると安心です。

まる。
まる。

実際の案件事例まで踏み込んで紹介されていて、効率よくスキルアップするなら必携の二冊です！

パラメータ解説 ⚙️

Load Page 🛠️

Shader Source DATs .shadersource 📄

Vertex / Pixel / Geometry シェーダのソース DAT 指定

項目 内部名 説明
Vertex Shader .vdat 頂点シェーダコードを保持する Text DAT のパス
Pixel Shader .pdat ピクセル (フラグメント) シェーダコードを保持する Text DAT のパス
Geometry Shader .gdat ジオメトリシェーダコードを保持する Text DAT のパス (任意)
Preprocess Directives .predat シェーダ冒頭に挿入する #extension 等のディレクティブ用 DAT
GLSL Version .glslversion コンパイル対象の GLSL バージョン

Uniform Management .uniformmgmt 📋

Uniform 名の自動読み込み / クリア / 継承

項目 内部名 説明
Load Uniform Names .loaduniformnames ボタン。コンパイル済みシェーダ内の宣言済 / 使用済ユニフォームを読み込み、各ユニフォーム名フィールドに自動入力
Clear Uniform Names .clearuniformnames ボタン。全ユニフォーム名フィールドをクリア
Inherit Uniforms/Samplers from .inherit 別 GLSL MAT のテクスチャとユニフォーム設定を継承するパス

Geometry Shader Settings .gsettings 🔺

ジオメトリシェーダの入出力プリミティブ設定

項目 内部名 説明
Input Primitive Type .inprim ジオメトリシェーダへの入力プリミティブ型
Output Primitive Type .outprim ジオメトリシェーダの出力プリミティブ型
Num Output Vertices .numout ジオメトリシェーダが出力する頂点の最大数

Lighting & Misc .lightingmisc 💡

ライティング座標空間と Simplex Noise / Two-Sided Coloring

項目 内部名 説明
Lighting Space .lightingspace ライティング計算に使う座標空間 (World Space / Camera Space [legacy 088])
TDSimplexNoise() .simplexnoise TDSimplexNoise() 関数の品質モード選択 (Performance / Quality)
Two Sided Coloring .twocolor gl_FrontColor / gl_BackColor 両対応のカラー出力を有効化

Uniform Pages 📋

Attributes / Samplers / Vectors / Matrices / Constants / Arrays .uniformpages 📋

シェーダに供給する各種ユニフォーム。各シーケンスは Name + Value / TOP 等を持つ:

  • Attribute (attr): POP ベースワークフロー用の属性宣言。シェーダから TDAttrib_<attribName>() でアクセス
  • Sampler (sampler): TOP テクスチャをシェーダのサンプラに割り当てる
  • Vector (vec): vec1〜vec4 のユニフォーム値
  • Matrix (matrix): mat4 ユニフォーム + COMP 間相対変換 (Relative)
  • Constant (const): コンパイル時定数 (シェーダ最適化に利用)
  • Array (array): 配列ユニフォーム

Deform Page 🦴

Deform .dodeform 🦴

ボーン変形 (スキニング) の設定群。Vertex Shader 側で対応コードを書く必要がある:

  • Deform トグル: ボーン変形を GLSL シェーダ側で使えるよう有効化
  • SOP with Capture Data: pCaptPath / pCaptData 属性を持つ SOP
  • Skeleton Root Path: スケルトンのルート COMP のパス

Common Page 🔧

Blending .blending 🎨

色のブレンディング (透過合成) に関する設定群

項目 内部名 説明
Add .add ソースとデスティネーションを加算
Subtract .subtract ソースからデスティネーションを減算
Reverse Subtract .revsubtract デスティネーションからソースを減算
Minimum .minimum 両者の最小値を採用
Maximum .maximum 両者の最大値を採用
Blending (Transparency) .blending 透過効果のためのカラーブレンディングを有効化するトグル
Separate Alpha Function .separatealphafunc アルファチャンネルのブレンド設定を RGB と独立させる
Blend Constant Color .blendconstant constantcol 系オプション選択時に使用する RGB 定数カラー
Blend Constant Alpha .blendconstanta constanta 系オプション選択時に使用する定数アルファ値
Legacy Alpha Behavior .legacyalphabehavior 旧バージョンのアルファ処理との後方互換を有効化
Post-Mult Color by Alpha .postmultalpha ブレンド演算完了後に RGB を計算後アルファで乗算

Depth Test .depthtest 📏

デプステスト (Z 比較) によるオクルージョン制御

項目 内部名 説明
Less Than .less 新ピクセルのデプスが既存より小さい (手前) なら描画
Less Than or Equal .lessorequal 新ピクセルが既存以下なら描画
Equal .equal デプスが完全一致時のみ描画
Greater Than .greater 新ピクセルが既存より大きい (奥) なら描画
Greater Than or Equal .greaterorequal 新ピクセルが既存以上なら描画
Not Equal .notequal デプスが一致しない場合のみ描画
Always .always デプス比較を行わず常に描画
Depth Test .depthtest デプスバッファとの比較によるオクルージョンを有効化
Write Depth Values .depthwriting デプステストを通過したピクセルのデプス値をデプスバッファに書き込む

Alpha Test .alphatest 🔍

アルファ値に基づくピクセル単位の破棄判定

項目 内部名 説明
Less Than .less アルファが閾値より小さいピクセルを残す
Less Than or Equal .lessorequal アルファが閾値以下のピクセルを残す
Greater Than .greater アルファが閾値より大きいピクセルを残す
Greater Than or Equal .greaterorequal アルファが閾値以上のピクセルを残す
Discard Pixels Based on Alpha .alphatest ピクセル単位でアルファによる破棄判定を有効化
Alpha Threshold .alphathreshold アルファ比較の閾値。条件外のピクセルは破棄される

Wire Frame .wireframe 🕸️

ジオメトリをワイヤーフレーム表示する設定

項目 内部名 説明
Off .off 通常のソリッド描画 (ワイヤーフレーム無効)
OpenGL Tesselated Wire Frame .tesselated OpenGL が三角形分割した状態でワイヤーを描画
Topology Wire Frame .topology 元のポリゴントポロジ (四角形等) のままワイヤーを描画
Line Width .wirewidth ワイヤーフレームの線の太さ (ピクセル単位)

Cull Face .cullface 🔺

ポリゴンの表裏どちらを描画するか (カリング) の選択

項目 内部名 説明
Use Render Setting .userender Render TOP 側の設定に従う
Neither .neither 両面とも描画 (カリングなし)
Back Faces .backfaces 裏面をカリング、表面のみ描画
Front Faces .frontfaces 表面をカリング、裏面のみ描画
Both Faces .bothfaces 両面をカリング (= 何も描画されない)

Polygon Depth Offset .polygonoffset ↔️

Z-fighting 対策としてポリゴンのデプス値をオフセット

項目 内部名 説明
Polygon Depth Offset .polygonoffset ポリゴンのデプス値オフセット機能を有効化
Offset Factor .polygonoffsetfactor デプス勾配に対するオフセットの乗数
Offset Units .polygonoffsetunits デプス単位の固定オフセット量

Color Space .parmcolorspace 🌈

カラーパラメータの色空間 / 基準白色の解釈

項目 内部名 説明
sRGB .srgb SDR sRGB トランスファ関数 (一般的なディスプレイ標準)
sRGB – Linear .srglinear SDR リニアトランスファ
Rec.601 (NTSC) .rec601ntsc SDR NTSC 規格 (旧テレビ放送)
Rec.709 .rec709 SDR ビデオ規格 (HD テレビ)
Rec.2020 .rec2020 HDR 放送規格 (4K/8K UHD)
DCI-P3 .dcip3 HDR シネマ規格 (D65 ホワイトポイント)
DCI-P3 (D60) .dcip3d60 HDR シネマ規格 (D60 ホワイトポイント)
Display-P3 (D65) .displayp3d65 HDR sRGB ガンマ (Apple ディスプレイ等)
ACES2065-1 .aces2065-1 HDR リニアシネマ規格 (アーカイブ用)
ACEScg .acescg HDR リニアシネマ作業用色空間
Passthrough .passthrough 色空間変換を行わずそのまま渡す

実践アイデア 💡

Example 1: Phong MAT から書き出した GLSL を起点にカスタマイズ 🛠️

Phong MAT (Output Shader ...) → 自動生成 GLSL MAT + Vertex/Pixel Text DAT → カスタム編集 → Geometry COMP → Render TOP

Phong MAT の Output Shader ... ボタンで、現在のシーン設定相当の GLSL コードを書き出せます。これを起点に編集すれば、Phong とほぼ互換のシェーダから独自表現まで段階的に拡張できます。

  1. Phong MAT を作成しシーンに配置 + Render TOP で 1 度レンダリング (シェーダを生成させる)
  2. Phong MAT の Output Shader ... をクリックして GLSL MAT + Text DAT を生成
  3. Pixel Shader DAT を編集して独自エフェクト (例: トゥーンシェーディング) を追加
  4. Load Uniform Names でユニフォームを再読み込みして反映

Example 2: Sampler 経由で複数 TOP を入力するエフェクト 🎨

Movie File In TOP (×2) → GLSL MAT (sampler0/sampler1) → Pixel Shader でブレンド → Geometry COMP → Render TOP

GLSL MAT は任意の数の TOP を Sampler として受け取れます。シーケンス追加で sampler0 / sampler1 等を増やし、Pixel Shader でブレンドや合成計算を行います。

  1. GLSL MAT の Samplers ページで 2 つのサンプラを追加 (sampler0name / sampler1name)
  2. それぞれの TOP パラメータに別の Movie File In TOP を指定
  3. Pixel Shader 内で texture(sampler0, uv) と texture(sampler1, uv) をミックス
  4. vec ページに mix_ratio ユニフォームを追加し、Constant CHOP やパラメータ参照で動的にミックス率を変える

Example 3: Geometry Shader でパーティクル風プリミティブ増幅 ✨

Point SOP → Geometry COMP (GLSL MAT) → Geometry Shader で頂点 → 三角形ストリップ → Render TOP

Geometry Shader を使うと、頂点 1 つを入力に、複数の頂点 (= 三角形 / 四角形) を出力できます。ポイントクラウドからスプライト的なパーティクルを生成するワークフローでよく使われます。

  1. Geometry Shader Text DAT を作成し EmitVertex() でビルボード生成コードを書く
  2. GLSL MAT の Geometry Shader にその DAT を割当
  3. Input Primitive Type = points、Output Primitive Type = triangle_strip、Num Output Vertices = 4 に設定
  4. Point SOP の点 1 つにつき四角形が 1 枚生成され、Render TOP でパーティクル状に表示される

関連オペレータ 🔗

類似機能OP 🔍

  • Phong MAT — プリセット Phong シェーダ。GLSL の起点として書き出し可能
  • PBR MAT — プリセット PBR シェーダ。同様に GLSL 書き出し可能
  • GLSL TOP — 2D 用 GLSL カスタムシェーダ (画面処理エフェクト)
  • GLSL Multi TOP — 複数 TOP 入力対応の 2D GLSL シェーダ

組み合わせ推奨OP 🔄

  • Geometry COMP — GLSL MAT を割り当てる対象 COMP
  • Render TOP — GLSL シェーダの最終ピクセル出力先
  • Text DAT — Vertex / Pixel / Geometry シェーダコードを保持
  • Light COMP — シェーダ内で TDLighting 系関数経由で参照可能
  • Camera COMP — シェーダ内で uTDMats[0].cam 等で参照

前処理・後処理MAT 🎯

Info情報 📊

MAT は Info CHOP / Info DAT に接続することで、シェーダコンパイル状況やクック情報を取得できます。

汎用オペレータ情報 🔄

  • total_cooks: プロセス開始からの累計クック回数
  • cook_time: 直近クックに要した時間 (ミリ秒)
  • cook_frame: 最後にクックされたフレーム番号
  • warnings: 現在の警告数 (シェーダコンパイル警告含む)
  • errors: 現在のエラー数 (シェーダコンパイルエラー含む)

トラブルシューティング ⚠️

よくある問題と解決策 🔧

❌ Problem: シェーダがコンパイルエラーで赤画面 / 何も描画されない
✅ Solution:

  • Info DAT を GLSL MAT に接続してコンパイラエラー / 警告メッセージを確認
  • GLSL Version がターゲット GPU で対応している値か確認
  • Preprocess Directives に必要な #extension を入れているか確認

❌ Problem: Uniform に値を送ったのにシェーダで反映されない
✅ Solution:

  • Load Uniform Names ボタンを押してユニフォーム名を再取得
  • シェーダ内のユニフォーム宣言と Name フィールドの綴りが完全一致しているか確認 (大文字小文字含む)
  • Inherit Uniforms/Samplers from を使っている場合、上位 GLSL MAT 側の値が継承されているか確認

❌ Problem: Geometry Shader が動かない / 出力されない
✅ Solution:

  • Input Primitive Type / Output Primitive Type / Num Output Vertices が正しく設定されているか確認
  • シェーダコード内で EmitVertex() + EndPrimitive() を呼び出しているか確認
  • Num Output Vertices が実際の出力数より少ないと余分な頂点は破棄される、上限を確認

❌ Problem: テクスチャ (Sampler) が真っ黒で参照できない
✅ Solution:

  • Samplers ページの TOP パラメータが対象 TOP を正しく指しているか確認
  • サンプラ名が sampler2D / sampler3D 等、TOP の次元と一致しているか確認
  • ジオメトリに UV 属性が無いと texture(sampler, uv) でゼロが返る、SOP 側に UV を持たせる

参考資料 📚

公式リソース 📖

コミュニティ 💬

この記事はLLMと共に内容を執筆、更新しています。
最新バージョンとの項目差異など、情報の不一致を見つけた心優しい方はXもしくはInsta、メールなどよりサイト管理者までご連絡ください😎


まる。

お仕事のご依頼はDM又はメールにて。
━━━━━━━━━━━━━━━━━
Python/Touchdesigner/M5Stackをこよなく愛すフルスタックエンジニア。
専門は生理心理学、趣味はヨガやサウナ、EMS電気風呂などヘルスケア全般。
脳波や筋電、心拍を中心とした生体情報のセンシング＆インタラクティブアートづくりがライフワーク。

普段はワントゥーテンという会社で空間演出エンジニアをしています。
リファラル採用お繋ぎできますので、我こそはという尖った方は経歴と希望職種添えてDMください(エンジニア以外、営業職等もOK)。
ご飯行きましょう。

↓日常垢
Instagram：＠malmal0v0

まる。をフォローする
その他の記事はこちら
Math Combine POP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】
ZED Select TOP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】
ZED POP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】
Window COMP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】
Widget COMP 完全ガイド | 使い方・パラメータ解説【TouchDesigner】

タイトルとURLをコピーしました