Shader-Effekt: Warping

  • 4Minuten

Da wir im dritten Shader-Tutorial 2D und Pseudo-3D-Effekte behandelt haben, möchte ich immer mal wieder entsprechende Effekte als einzelne Tutorials präsentieren. Einerseits, weil das viel Spaß machen kann, andererseits, weil bekanntlich Übung den Meister macht.

Im heutigen Effekt geht es um Warping. Darunter versteht man Neigungen und Verzerrungen. Mit solchen Effekten lassen sich Wasser, Lava oder – wie im hiesigen Beispiel – surreale Effekte erzeugen. Das Resultat sieht dann so aus:

Hierbei handelt es sich nur um eine von vier Farbvarianten, die ich im Code eingebaut habe. D. h. wer das nachbaut, kann per Tastendruck durchschalten, sich für eine Variante entscheiden oder etwas ganz anderes kreieren. Außerdem ist der Effekt so aufgebaut, dass man ihn im Shader mit vielen Parametern steuern und verändern kann.

sh_warping01

Den Shader habe ich sh_warping01 genannt. Im Vertex-Shader muss nichts geändert werden, der GameMaker-Code reicht völlig. Den Fragment-Shader habe ich recht ausführlich kommentiert, weshalb ich auf zusätzliche Erklärungen weitestgehend verzichte.

Das Ganze sieht auf den ersten Blick wesentlich kompliziert aus, als es ist. Die meisten einfachen Änderungen kann man in den Funktionen fieryFractal und main vornehmen. 

In der Funktion fieryFractal haben die sechs Variablen am Anfang einen sehr großen Einfluss auf das Aussehen. Bei octaves sollte man darauf achten, dass der Effekt rechenintensiver wird, je größer diese Zahl ist.

Das GM-Objekt

Normalerweise müsste ich, aufgrund des Shader-Tutorials, das Objekt nicht mehr zeigen. Durch das Umschalten und der version-Variable halte ich es dennoch für angebracht. Ich schalte die Version mit dem Nummernblock durch, ihr könnt euch natürlich für andere Tasten, Maustaste oder Mausrad entscheiden. Natürlich lässt es sich auch zeitlich steuern.

Create-Event

Step-Event

Draw-Event

Wichtig: Die Variable version übergeben wir per shader_set_uniform_i, da es sich um einen Integer handelt. Bisher haben wir Variablen nur mit shader_set_uniform_f übergeben.

Übrigens: Ich habe den Effekt so gestaltet, dass er langsam nach oben scrollt. So kann man ihn gleich für einen Textscroller, etwa Abspann oder Credits, nutzen.

Weiterführende Links

Shader-Programmierung 1: Grundlagen und Sprites
Textscroller
Skripte für Textformatierung
Bitmap-Fonts im GameMaker

Autor

Abonnieren
Benachrichtige mich bei
guest

0 Comments
Inline Feedbacks
View all comments
0
Would love your thoughts, please comment.x