Shader-Erklärung: Vertex vs. Fragment für echten Game Feel

Shader entscheiden in Spielen darüber, wie „lebendig“ sich Oberflächen anfühlen. Wenn Du Vertex- und Fragment-Shader sauber trennst, bekommst Du nicht nur hübschere Effekte, sondern auch reproduzierbares Game Feel: Timing, Lesbarkeit und Kontrolle.

In diesem Guide lernst Du, was Vertex- und Fragment-Shader jeweils machen, wie Du typische Effekte daraus ableitest und wie Du Entscheidungen triffst, wenn Du Performance, Stil und Interaktion unter einen Hut bringst.

Was ist ein Vertex-Shader? (Game-Feel über Geometrie)

Ein Vertex-Shader läuft pro Vertex (Ecke) Deines Meshes und verschiebt oder skaliert Geometrie im Raum. Dadurch kontrollierst Du, wie Objekte sich verformen, wie schnell Reaktionen starten und wie stark sie im Gameplay „ziehen“.

Vertex-Logik eignet sich besonders, wenn Du Formen verändern willst: Wellen, Hebel-Effekte, Body-Deformation, Drahtgitter-Look oder Bewegungen, die eine Silhouette mitnehmen.

Vertex-Output: Position, Normalen, Varyings

Dein Vertex-Shader schreibt in der Praxis vor allem die Position (z.B. Clip-Space) und oft auch Normalen oder Tangenten. Zusätzlich kannst Du „Varyings“ berechnen. Diese Werte laufen dann in den Fragment-Shader weiter, wo Du sie pro Pixel nutzt.

Ein häufiges Muster: Vertex-Shader berechnet eine Deformationsgröße (z.B. „wobbleStrength“) und Fragment-Shader nutzt sie für Glanz, Fresnel oder Kantenhighlight. So koppelt Dein Look die Bewegung an das Materialgefühl, ohne alles pro Pixel neu zu rechnen.

Beispiel: Wellen, die man fühlt

Wenn Du ein Wasser-Planeffekte-Feeling willst, verschiebe die Vertices in Wellenform. Danach gib dem Fragment-Shader eine Korrelation zur Wellenhöhe, um Specular und Normal-Intensity passend mitzuändern.

Das wirkt „körperhaft“, weil Silhouette und Lichtreaktion aus demselben Signal kommen. Spieler merken den Unterschied sofort, wenn Du nur den Fragment-Look änderst. Das ist der Kern von „Game Feel“: Konsistenz zwischen Bewegung und Materialreaktion.

Was ist ein Fragment-Shader? (Material-Look pro Pixel)

Ein Fragment-Shader läuft pro potenziellem Pixel (Fragment) und entscheidet, wie ein Oberflächeneindruck aussieht. Hier entstehen Farbe, Texturwirkung, Normal-Look, Transparenz, Kantenstärke und die meisten „Wow“-Momente.

Fragment-Shader sind der Ort für Materialgefühl: glatte vs. raue Oberfläche, Tinten- oder Toon-Look, Emission, Rim-Lighting und glanzbasierte Lesbarkeit in Bewegung.

Fragment-Output: Farbe, Alpha, Depth-Effekte

Fragment-Shader geben typischerweise mindestens einen Farbwert aus, oft auch Alpha. Je nach Pipeline kannst Du außerdem Effekte einbauen, die die „Lesbarkeit“ beeinflussen, etwa Cutout-Kanten (Alpha-Test) oder weiche Kanten (Alpha-Blending) für bestimmte Stilrichtungen.

Wenn Du Cutouts nutzt, achte auf konsistente Kanten: Schon kleine Unterschiede in der Kantenberechnung können dazu führen, dass Silhouetten im Motion-Look „flackern“.

Beispiel: Toon-Rim und kontrollierte Kanten

Ein Toon-Shader nimmt häufig eine NdotL-ähnliche Größe (Lambert/ Half-Lambert) und mapped sie auf Stufen. Der Rim-Teil nutzt typischerweise eine Fresnel-ähnliche Größe, berechnet aus Blickrichtung und Normalen.

Wenn Du Rim-Intensität stabil halten willst, gib dem Fragment-Shader Normalen aus dem Vertex-Shader oder nutze ein konsistentes Normal-Tangent-Setup aus Deinem Mesh. Andernfalls schwankt der Rim beim Animieren unnötig, und das fühlt sich „billig“ an.

Wie hängen Vertex- und Fragment-Shader zusammen?

Vertex- und Fragment-Shader arbeiten wie ein Team: Vertex baut den Raum, Fragment füllt ihn mit Material und Lichtgefühl. Vertex entscheidet, wo etwas ist und wie es sich bewegt, Fragment entscheidet, wie es aussieht, während die Bewegung passiert.

Dein Ziel bei Game Feel ist meist nicht „mehr Shader“, sondern eine klare Zuständigkeit. Trenne geometrische Änderungen von Materialinterpretation, dann wird Dein Ergebnis vorhersehbar.

So denkst Du in Signalen: Geometrie vs. Material

Überlege zuerst: Willst Du die Form wirklich verändern? Dann geht es in den Vertex-Shader. Willst Du eher die Lichtreaktion ändern, ohne die Form zu bewegen? Dann geht es in den Fragment-Shader.

Wenn Du ein Effekt-Problem siehst, prüfe die Quelle: Flackert die Kante. Dann liegt oft ein Fragment-Problem vor (Threshold, Mipmap, Blending). „Laggt“ die Bewegung optisch. Dann liegt es oft an Vertex-Varyings oder daran, dass Fragment-Logik nicht an denselben Bewegungszeitpunkt gekoppelt ist.

Varyings als „Game Feel Klebstoff“

Varyings transportieren Zahlen vom Vertex-Shader ins Fragment-Lager. Das ist Dein Werkzeug, um Look und Bewegung miteinander zu verkoppeln.

Typische Varyings: Deformationshöhe, lokaler Bewegungsvektor, Maskenwerte für Bereiche (z.B. „wetness“, „heat“, „dirt“), sowie Raumkoordinaten für Triplanar oder UV-ähnliche Projektionen.

Welche Shader-Strategien erzeugen „Game Feel“?

Game Feel entsteht aus der Kombination aus Lesbarkeit, Timing und Kontrollierbarkeit. Shader liefern dafür Mechaniken: Silhouetten reagieren, Kanten bleiben stabil, Materialwerte bleiben konsistent und Effekte verstärken Animation statt sie zu überdecken.

Du kannst diesen Effekt mit wenigen, aber gezielten Designregeln erreichen. Die wichtigste Regel lautet: Stelle sicher, dass Bewegung (Vertex) und Materialreaktion (Fragment) aus denselben Quellen entstehen.

Strategie 1: Silhouette zuerst, Details danach

Starte bei Vertex: Was macht die Silhouette im Gameplay? Ein Charakter im Nahkampf braucht stabile Kanten. Ein Gegner in der Ferne braucht erkennbare Formen. Wenn Deine Silhouette „klebt“ oder „schwimmt“, helfen nur kosmetische Fragment-Optimierungen nicht lange.

Danach gehst Du zu Fragment: Rim, Specular, Stufen oder Roughness-Varianten. So bekommst Du Stil, ohne die Form zu zerstören.

Strategie 2: Masken statt alles gleichzeitig zu rechnen

Viele Effekte funktionieren besser, wenn Du Zonen definierst. Zum Beispiel: Kante, Übergangslinie, Detailbereich. Dann rechnest Du teure Dinge nur dort.

Ein praktisches Schema: Vertex erzeugt eine Deformationsmaske oder lokale Höhe. Fragment nutzt die Maske, um Kanten zu verstärken und nur in diesen Bereichen normalisierte Noise oder Emission einzusetzen.

Strategie 3: Konsistente Mips und Textur-Interpretation

Wenn Du Texturen in Fragment-Shadern stark vergrößerst oder stark verschiebst, kann die Mipmap-Entscheidung zu „wobbligen“ Details führen. Das wirkt wie ein Spielgefühl-Bug, obwohl es nur Sampling-Fehler sind.

Arbeite mit klaren UV-Skalierungen, vermeide unkontrollierte Projektionswechsel und teste Effekte bei echten Kamerawinkeln. Ein Shader fühlt sich dann gut an, wenn er unter Bewegung stabil bleibt.

Best Shader-Ansatz für Stylized vs. Realistic

Der beste Shader-Ansatz hängt von Deinem Ziel ab. Stylized Looks brauchen oft klare Kanten, stabile Stufen und kontrollierte Rim-Lichter. Realistic Looks brauchen konsistente Normals, plausibles Roughness-Verhalten und sauberes Specular-Handling.

Du musst nicht zwischen beiden Welten wählen. Du kannst auch hybride Ansätze machen, zum Beispiel realistic Basismaterial, stylisierte Kanten in einem zweiten Pass oder über eine Fragment-Maskierung.

Look-Ziel	Vertex-Schwerpunkt	Fragment-Schwerpunkt	Game-Feel Fokus
Toon/Stylized	Deformation, Silhouette	Stufen, Rim, Cutout-Kanten	Lesbarkeit bei Bewegung
Realistisch	Animation, korrekte Raumdaten	Specular, Roughness, Fresnel	Materialkohärenz
VFX/Effects	Wellen, Distortion	Emission, Transparenz, Dithering	Timing und Intensität

Ein guter Workflow: erst definierst Du die bewegten Formen, dann definierst Du das Materialgefühl. Viele Teams versuchen zuerst „den Shader fancy zu machen“. Dadurch verlieren sie die Kontrolle über Silhouette und Lesbarkeit.

Wenn Du Dir eine Vorlage für stylized Shader-Logik sichern willst, helfen fertige Shader-Assets beim Einstieg, weil Du Dich auf die Parameter statt auf die Grundstruktur konzentrieren kannst.

Ein Beispiel aus der Asset-Welt ist „Anime Stylized Shader Pro“ auf Getly: Es kann Dir helfen, toonartige Beleuchtung und Stufenlogik schneller zu verstehen und anzupassen. Du findest es hier: Anime Stylized Shader Pro.

Game-Assets & Shader-Praxis: Von Modell zu Effekt

Ein Shader fühlt sich nur dann gut an, wenn Mesh, UVs und Materialdaten zusammenpassen. Ein typischer Engpass liegt weniger im Shader-Code, sondern in den Daten: Normalen, Tangenten, Skalierung, sowie welche Details Du in welchem Shader-Level behandelst.

Wenn Du ein komplett fertiges Game-Asset nutzt, bekommst Du oft eine saubere Basis, auf der Du dann Vertex- und Fragment-Logik sauber einhängst.

Model-Assets als „Datenlieferanten“

Game-Ready 3D Modelle liefern Dir die Geometrie, die Du im Vertex-Shader transformieren willst, und die Daten, die Du im Fragment-Shader interpretierst. Achte darauf, dass Normalen und UVs konsistent sind.

Wenn Du einen Sci-Fi oder Alien-Look baust, helfen fertige Modelle als Testbasis für unterschiedliche Shaderstile. Zum Beispiel „Alien 1“ und „Alien 2“ als Game-Ready Projekte und weitere Formate können Dir schnell Material- und Deformations-Tests ermöglichen. Hier sind die Assets: Alien 1 Game-Ready und Alien 2 Game-Ready.

So testest Du effizient: ein Mesh, viele Shader-Varianten

Lege eine Testszene an, in der Du nur einen Parameter änderst. Nutze ein Modell, eine feste Lichtsetzung und bewege die Kamera konstant. Dann siehst Du sofort, ob Vertex- oder Fragment-Änderungen den Hauptfehler verursachen.

Wenn Du Fehler siehst, beurteile zuerst die Art des Fehlers:

• Flackernde Kanten: Fragment-Threshold, Blending oder Sampling-Probleme.
• „Zieht“ die Bewegung, aber sieht falsch aus: Vertex-Deformation oder fehlender Varying-Kopplung.
• Glanz „springt“ beim Drehen: Normalen, Tangenten oder Fresnel-Näherung.

FAQ zu Vertex- und Fragment-Shadern

Wann sollte ich einen Effekt im Vertex-Shader machen?

Wenn Dein Effekt die Geometrie beeinflusst, wie Wellen, Verformung, Silhouette-Animation oder Distortion für Mesh-Oberflächen, mach ihn im Vertex-Shader. So bleibt die Form konsistent und die Kanten reagieren mit.

Wann gehört es in den Fragment-Shader?

Wenn Du pro Pixel Farbe, Materialwerte, Lichtreaktion, Rim-Lighting, Cutout- oder Transparent-Looks steuern willst, gehört es in den Fragment-Shader. So kannst Du Detailwirkung erzeugen, ohne die Geometrie zu verändern.

Was sind Varyings und warum sind sie für Game Feel wichtig?

Varyings sind Werte, die Dein Vertex-Shader an den Fragment-Shader übergibt. Sie koppeln Bewegung und Materialgefühl. Wenn Du die gleiche Bewegungslogik über Varyings an den Look übergibst, wirkt Dein Effekt „aus einem Guss“.

Warum flackern Toon-Kanten manchmal bei Bewegung?

Flackern entsteht oft durch Threshold-Logik, Sampling über Mips oder inkonsistente Alpha-Methoden. Teste Cutout- bzw. Blending-Parameter in einer bewegten Kameraansicht und prüfe, ob Deine Kantenmaske stabil bleibt.

Reicht ein Shader allein, oder brauche ich Mesh/UVs?

Ein Shader allein reicht selten. UVs, Normalen und Tangenten beeinflussen direkt, wie Fragment-Logik wirkt. Ein sauberes Mesh hilft Dir, dass Vertex- und Fragment-Shader ihre Arbeit konsistent machen.

Fazit: Shader richtig aufteilen, damit sich Spielwelten gut anfühlen

Vertex-Shader formen die Welt, Fragment-Shader liefern den Look. Wenn Du beide Rollen sauber trennst und Varyings als Brücke nutzt, entsteht genau das, was Spieler als Game Feel beschreiben: stabile Lesbarkeit, konsistente Reaktion und Timing, das zu Animation und Licht passt.

Wenn Du als Nächstes einen konkreten Effekt bauen willst, wähle einen kleinen Testfall. Verforme ein Mesh im Vertex-Shader und verknüpfe dann im Fragment-Shader Glanz oder Rim mit derselben Bewegungsgröße. Danach skalierst Du den Ansatz auf Deinen eigentlichen Content.

Wenn Du dabei lieber mit bestehenden Beispielen startest, schau Dir Shader-Assets und Game-Ready Modelle an, die Du sofort in Deine Testszene übernehmen kannst. Das spart Dir Wochen im Vergleich zu Null-Szene-Setup.