Im Rahmen der Erweiterung "Der Fall von Oriath", die im August dieses Jahres erschienen ist, haben wir massive Änderungen am Rendering des Wassers in Path of Exile vorgenommen. Im heutigen News-Post erklärt euch Grafikprogrammierer Alex, wie ihm diese bedeutende Umsetzung gelungen ist:

Mit dem Wachstum von Path of Exile haben wir auch mehr und mehr Ressourcen in die Grafik-Engine investiert. Einige Spieler haben die Engine jedoch nur in ihrer ursprünglichen Fassung beurteilt, die vor Jahren entwickelt wurde und zu denen auch die Wassereffekte zählten (eines der ersten Dinge, die ihr am Anfang des Spiels seht). Im Hintergrund arbeiten wir jedoch ständig daran, dass unsere Engine modern, schnell und erweiterbar bleibt. Diese Attribute sollen auch für euch sofort sichtbar sein. Als mir die Aufgabe aufgetragen wurde, das Wasser im Spiel zu ersetzen, hatte ich sofort viele Umsetzungsideen im Kopf, die ich gerne ausprobiert hätte. Jedoch war mir von vornherein klar, dass einige Ideen (wohl eher die meisten) verworfen werden mussten, da sie entweder nicht schön genug oder zu performancehungrig geworden wären.

Der Austausch sämtlicher Wasserelemente war etwas komplizierter, da viele Spielinhalte davon betroffen waren und das neue Wasser 100% abwärtskompatibel zum alten Wasser sein musste. Es genügte nicht, einfach nur schöne Wassereffekte zu erzeugen, da es sich jedem Terrain und jeder Umgebung automatisch anpassen können musste. Und natürlich lag ein großes Hauptaugenmerk auf der Performance, da uns für die Umgebung eine begrenzte GPU-Leistung zur Verfügung steht.

Meine Hauptaufgabe bestand darin, sogenannte Shader für das Wasser zu programmieren. Die Shader werden dabei von der GPU (Grafikkarte) verarbeitet und anschließend als fertiges Bild ausgegeben. In Fällen wie diesen muss man zuerst das bestehende System aufbrechen und es anschließend Stück für Stück von Neuem aufbauen, damit man schlussendlich ein besseres Ergebnis erzielt. Zuerst habe ich ein wenig mit dem alten Wasser-Shader rumgespielt, indem ich normale Debug-Varianten generierte. Darüber habe ich einen Bildschirmkanten-Erkennungsalgorithmus gelegt, damit dieser nach Möglichkeit die Gischt auf dem Wasser rendert, falls weitere Objekte mit dem Wasser zusammenlaufen (Anmerkung: Die HUD-Oberfläche in diesen Screenshots wurde während der laufenden Arbeiten an 3.0.0, noch vor ihrem finalen Design, erstellt).



Obwohl die Kantenerkennung gut funktionierte, musste ich die Idee verwerfen, da sie zu ressourcenhungrig sein könnte. Im nächsten Schritt fügte ich einige Oberflächenwellen hinzu, färbte das Wasser und implementierte einfache Reflexionen:



Die Oberfläche wird tatsächlich mithilfe eines Raytracing-Algorithmus im Bildschirmraum gerendert, was bedeutet, dass das Wasser tatsächlich flach ist, aber aufgrund der genutzten Shader-Techniken, ähnlich dem “Parallax Occlusion Mapping”, den 3D-Effekt erhält. An diesem Punkt musste ich festlegen, was bereits gut funktionierte und in die nächste Iteration der Entwicklung übernommen werden konnte und was von Grund auf neu erstellt werden musste. Das lustige am Wasser-Rendering ist, dass man die eigentliche Farbe des Wassers gar nicht so sehr sieht. Man sieht eigentlich nur Dinge, die vom Wasser reflektiert werden und brechen, weshalb ich die Entscheidung traf, mich näher damit zu beschäftigen. Also habe ich das Raytracing so gelassen, wie es war, und alles andere neu erarbeitet.

Für einigermaßen genaue Reflexionen habe ich sogar einen Algorithmus für den Bildschirminhalt implementiert, der tatsächlich nur Dinge reflektiert, die auf dem Bildschirm sichtbar sind. Ein Beispiel ist dieses 100% reflektierende, quecksilberähnliche "Wasser":



Es war eines dieser Dinge, egal wie sehr man es mochte, das man einfach streichen musste, da am Ende Aufwand und Ertrag nicht im Verhältnis zueinanderstehen würden.

Das Komplizierteste am Wasser-Rendering war wohl der Algorithmus zur Erzeugung der Wellen an der Wasseroberfläche und der Gischt, da sie einiges an künstlerischem Talent erforderten (wofür ich nicht gerade bekannt bin). Der Rest war nur Physik, Optik und Programmierung, die wesentlich einfacher waren. Ich wusste, dass die ersten Experimente mit der Gischt schwierig werden würden, aber ich fing trotzdem damit an:



Obwohl mir bewusst war, dass ich auf dem richtigen Weg war, musste ich genau verstehen, was echte Gischt realistisch aussehen lässt. Beispielsweise hatte meine Umsetzung eine sehr gleichmäßige, unnatürliche Struktur und im Gegensatz dazu wird echte Gischt von sehr aufgewühlten und unregelmäßigen Strömungen beeinflusst, welche sie ineinanderwirbeln. Zur gleichen Zeit entwickelte ich eine einfache App, um studieren zu können, wie sich Wasserpartikel in einem Wellenquerschnitt bewegen und wann Wellen beginnen sich zu türmen.

Nachdem das alles in die Shader eingeflossen ist und das Licht teilweise angepasst war, begann es tatsächlich nach etwas auszusehen:



Ich habe unzählige Referenzvideos studiert, viel Programmcode umgeschrieben und mich mit professionellen Surfern ausgetauscht, um die Gischt so real und ressourcenschonend wie möglich zu gestalten. Nach der Implementierung der Physik-Engine für Umhänge war das Wasser-Rendering meine nächste große Aufgabe – mein Verstand kannte nur noch den einen Fokus. Von meinem Fitnessstudio aus haben wir einen tollen Ausblick auf ein Schwimmbad und meine Freunde scherzten immer über mich, weil ich dort ständig die Mädels anstarren würde. Leider haben sie nicht verstanden, wie sehr mich das Studium von Oberflächenwellenmustern, Kaustiken und Doppelbrechungseffekten fasziniert hat. Ich beobachtete die Wolken und fragte mich, wie sie im Wasser reflektiert werden. Ich musterte Pflanzen und konnte nicht aufhören, darüber nachzudenken, wie sie das Licht unter der Oberfläche ihrer Blätter verhält, denn das Gleiche passiert mit dem Meerwasser.

Im nächsten Entwicklungsschritt ging es darum sicherzustellen, dass diese Technologie in jedem Gebiet funktionierte und hoffentlich auch an der Küste einem natürlichen Verlauf folgte. Zu diesem Zeitpunkt entstand ein Trailer, der einen Einblick in die Wassertechnologie gewährte. Einige Spieler waren zu Recht besorgt, da der Wellengang in einem sehr unnatürlichen Winkel ablief. Besondere Gebiete mit äußerst komplexen Uferstrukturen, wie das Riff des Gischtkönigs, wurden dabei besonders kritisiert, weshalb ich beschloss, ein weiteres Nebenprojekt zu starten, um eine geglättete Küstenlinie mit einer kontrollierten Welle zu schaffen.

Der Algorithmus erlaubte es uns, die Form der Wellen auf natürlichere Art und Weise zu glätten. Die hinzugefügten Karten in HDR-Umgebung werteten ebenfalls die Wahrnehmung der Wasseroberfläche insgesamt auf. Das bedeutete, dass es uns möglich war, wirklich helle "funkelnde" Muster zu erzeugen, die man sieht, sobald die Sonne von Wellen reflektiert wird:



Von diesem Punkt an war es nur noch eine Frage von Verbesserung der Shader und das Hinzufügen kleinerer kosmetischer Effekte. Als Beispiel seien hier die Sonnenstrahlen erwähnt. Wenn diese an der Oberfläche gebrochen werden, erzeugen sie ein helles Muster auf sandigen Flächen. Aber wenn die Strahlen von tiefem Wasser reflektiert werden, erhalten die Wellen eine etwas hellere Tönung, die durch die sogenannte Volumenstreuung (subsurface scattering) entsteht. Durch das Hinzufügen des physikalischen Konzepts, das beim Zusammenspiel zwischen Gischt und Sand entsteht, konnte die Küstenlinie optisch aufgewertet und interessanter gestaltet werden. All diese Veränderungen haben uns dem Wasser, das wir heute kennen, nähergebracht:



Die Zwielichtküste ist das erste Gebiet, das jeder neue Spieler betritt. Das Wasser gehört zu den ersten Dingen, die man dort wahrnimmt. Während meiner Arbeit am neuen Wasser-System wollte ich, dass Path of Exile vom Start weg einen positiven Eindruck hinterlässt.