Shader & GLSL

1. Was ist ein Shader?

Ein Shader ist ein kleines Programm, das direkt auf der Grafikkarte (GPU) ausgeführt wird. Während die CPU Aufgaben nacheinander abarbeitet, verarbeitet die GPU mithilfe von Shadern Millionen von Bildpunkten oder 3D-Punkten parallel und gleichzeitig.

Die drei Haupttypen:

• Vertex Shader: Verändert die Positionen und Formen von 3D-Punkten (Eckpunkten) im Raum.
• Fragment / Pixel Shader: Berechnet die exakte Farbe für jeden einzelnen Pixel auf dem Bildschirm (Licht, Schatten, Texturen, Effekte).
• Compute Shader: Nutzt die parallele GPU-Power für allgemeine Berechnungen (z. B. Partikelsysteme oder Physik).

2. Was ist GLSL?

GLSL steht für OpenGL Shading Language. Es ist die Programmiersprache, in der Shader für OpenGL und WebGL geschrieben werden. Die Syntax ist stark an C / C++ angelehnt.

Wichtige GLSL-Datentypen:

• float: Fließkommazahl (z. B. 1.5)
• vec2: Vektor mit 2 Werten (z. B. 2D-Koordinaten: x, y)
• vec3: Vektor mit 3 Werten (z. B. 3D-Koordinaten oder RGB-Farbe: r, g, b)
• vec4: Vektor mit 4 Werten (z. B. RGBA-Farbe inkl. Alpha: r, g, b, a)
• sampler2D: Schnittstelle für 2D-Bildtexturen

Wichtige Schlüsselwörter:

• in: Eingabedaten, die von der vorherigen Stufe in den Shader fließen.
• out: Ausgabedaten, die der Shader an die nächste Stufe (oder den Bildschirm) übergibt.
• uniform: Globale Variablen, die von außen (z. B. aus TouchDesigner, JavaScript oder C++) in den Shader gereicht werden (z. B. Zeitwert, Auflösung).

3. Einsatzbereiche

• TouchDesigner: Einsatz im GLSL TOP (2D-Effekte/Generatoren) oder GLSL MAT (3D-Materialien).
• Web / WebGL: Direct-Rendering im Browser auf HTML5 Canvas (z. B. mit Three.js oder auf Shadertoy).
• Game Engines: Materialien, visuelle Effekte und Post-Processing.