GLSL Materials in TouchDesigner: Porting from WebGL

Take your vertex and fragment shader skills to the next level with custom GLSL Materials in TouchDesigner. This tutorial gives a gentle introduction to the concepts of GLSL Materials in TD by porting a shader from WebGL. We discuss each part of the shader pipeline, analogous structures in WebGL vs TouchDesigner, and end up with a fully ported parametric curve renderer, 100% in GLSL!

Links:

Project file: www.patreon.com/water__shed

Original blog post: https://mattdesl.svbtle.com/shaping-curves-with-parametric-equations
Function Store toolbar: https://github.com/function-store/FunctionStore_tools/releases/tag/v2.1.0
Writing a GLSL Material – https://docs.derivative.ca/Write_a_GLSL_Material

00:00 Intro
02:28 Parametric Equation Blog Post Review
10:13 Begin Network Rebuild
11:15 Tube SOP and Render Network
14:46 Vertex Shader and Pipeline Review
16:38 Begin WebGL Vertex Shader Port to TouchDesigner
48:47 Begin WebGL Fragment Shader Port to TouchDesigner
53:40 Adding Mouse Interactivity
57:31 Add Color Palette
1:03:29 Outtro