• 3Minuten
blank

Wer ein Reto-Spiel entwickeln will, möchte i. d. R. auch, dass es so aussieht. Neben klassischen Pixelgrafiken und Reduzierung der Farbpalette denkt man früher oder später über einen CRT-Effekt nach. In GameMaker lässt sich das mit wenigen Zeilen Shader-Code bewältigen.

Was ist CRT?

Der Begriff CRT-Effekt bezieht sich auf visuelle Effekte oder Ästhetiken, die typischerweise mit CRT-Bildschirmen (Cathode Ray Tube) verbunden sind. CRTs waren früher die dominierende Technologie für Computermonitore und Fernseher, bevor sie von flacheren Bildschirmen wie LCDs und LEDs abgelöst wurden. Kurz gesagt: Bei dem Effekt versucht man auf einem flachen Bildschirm so zu tun, als wäre er ein Röhrenmonitor.

Einige der charakteristischen Merkmale des CRT-Effekts sind:

Scanlines

CRT-Bildschirme erzeugen Bilder, indem sie einen Elektronenstrahl über die Bildschirmoberfläche bewegen, der jedes Pixel zeilenweise beleuchtet. Dies kann zu sichtbaren horizontalen Linien führen, die als Scanlines bezeichnet werden.

Pixelartefakte

Die individuellen Phosphorpunkte auf einem CRT-Bildschirm können leicht erkennbar sein, was zu einer körnigen Textur führt. Dies kann insbesondere bei niedrigeren Auflösungen oder stark vergrößerten Bildern sichtbar sein.

Bildverzerrung und Geometrieabweichungen

CRTs neigen dazu, subtile Verzerrungen in Form von Krümmungen oder Verzerrungen am Bildschirmrand aufgrund ihrer physikalischen Eigenschaften zu erzeugen.

Farbbluten

Aufgrund der Art und Weise, wie CRTs Bilder erzeugen, können Farben leicht überlappen oder ausbluten, was zu einem weicheren und manchmal unklaren Erscheinungsbild führen kann.

Zumindest optional ist es eine sehr gute Wahl, den Effekt für nostalgische Momente anzubieten. In den Weiten des Internets findet man sehr viele Ansätze, um einen solchen Effekt zu realisieren. Häufig sind diese jedoch viel zu extrem. Die Krümmung und Störungen sind so stark, dass das Spielen auf Dauer keinen Spaß macht. Deshalb habe ich für meine Demo NO RUST einen eigenen Shader geschrieben.

Den Effekt kannst du am Anfang und am Ende der Demo sehen:

Shader-Code

Mein Shader heißt im GameMaker schlicht sh_crt. Dabei verwende ich ausschließlich den Fragment-Shader. Wenn du einen neuen Shader nutzt, kannst du den Vertex-Shader so lassen, wie er ist.

Damit es nicht so extrem ist, beschränkt sich der Effekt darauf, die Texturkoordinaten zu verformen und Scanlines hinzuzufügen. Die Intensität kann entsprechend eingestellt werden, im Beispiel liegt sie bei 6,4.

Objekt

Nun müssen wir den Effekt nur noch in einem Objekt anwenden. Hierfür habe ich ein eigenes Objekt mit dem Namen o_pp_crt.

Event Create

Event Draw-GUI

Alpha habe ich separat, weil ich das in der Demo noch extra steuere. Die Variable und die entsprechende Zeile im Draw-GUI-Event kannst du auch weglassen, wenn du sie nicht brauchst.

Weiterführende Links

Shader-Programmierung 1: Grundlagen und Sprites
Shader-Effekt: Warping
Shader-Effekt: Interferenz-Effekt

Autor

Abonnieren
Benachrichtige mich bei
guest

0 Comments
Inline Feedbacks
Alle Kommentare anzeigen