CS:GO Mapping Tutorial – Himmel & Umgebungslicht

Raus aus einem engen Raum und unter freien Himmel geht es in diesem Mapping Tutorial. Die sogenannte “Skybox” simuliert unter anderem einen Himmel und das dazugehörige Sonnenlicht. Sie ist damit maßgeblich für die Atmosphäre einer Map verantwortlich.

Ab diesem Tutorial wird vorausgesetzt, dass du mit Brushes, Texturen und Entities arbeiten kannst. Dieses Wissen wurde in den sechs vorhergehenden Tutorials vermittelt. Im Zweifelsfall kannst du auf diese zurückgreifen und bei Unklarheiten unser Mapping-Forum LINK für Fragen nutzen.

Was ist eine Skybox?

Bevor es richtig losgeht, müssen wir noch eine grundlegende Frage klären. Eine Skybox ist nämlich mehr als ein einfacher Himmel. Sie simuliert die weitere – nicht betretbare – Umgebung der Map. Die Skybox lässt die eigentliche Map als Teil von einer größeren Umgebung erscheinen. Und ganz wichtig: Eine Skybox ist deswegen auch dreidimensional.

Eine 3D-Skybox zu erstellen ist aber wiederum ein Thema für sich, das wir erst in einem späteren Tutorial angehen werden. In diesem Mapping Tutorial fokussieren wir uns erstmal auf den Teil mit dem Himmel und der Beleuchtung.

Welcher Himmel darf es sein?

Eine Skybox erfüllt gleich mehrere Zwecke. Sie spendet nicht nur Licht, sondern dient gleichzeitig als Level-Grenze und trägt zur Atmosphäre der Map bei. Letzterer Punkt setzt voraus, dass man sich eine passende Skybox für seine Map aussucht. Deshalb fangen wir damit an.

Einfach mal den Texture Browser öffnen und dort „skybox“ eingeben. Daraufhin erscheinen sehr viele Einträge zu unterschiedlichen Himmelsvarianten.

cs go mapping tutorial skybox textures

Da eine Skybox wie erwähnt dreidimensional ist, besteht sie aus sechs Texturen – eine für jede Seite. Im Texture Browser kann man das ganz gut daran erkennen, dass die einzelnen Texturen mit Abkürzungen versehen sind.

  • bk = „back“ = hinten
  • dn = „down“ = unten
  • ft = „front“ = vorne
  • lf = „left“ = links
  • rt = „right“ = rechts
  • up = „up“ = oben

Man sieht dabei an vielen Einträgen den eben angesprochenen Faktor, dass die Skybox auch gleich die Umgebung simuliert – z.B. eine Großstadt bei der Skybox von Office. Jedenfalls kann man sich im Texture Browser nun eine Variante heraussuchen, die man für passend zur eigenen Map hält. Im Zweifelsfall einfach etwas schlichtes und unspezifisches wie z.B. „sky_cs15_daylight01_hdr“ ins Auge fassen. Diese Skybox habe ich mir mal für die Beispiel-Map zu diesem Tutorial herausgesucht.

Wie schon gesagt, findet man zu jeder Skybox sechs einzelne Texturen. Die Abkürzungen für die Seiten sind fortan aber nicht mehr wirklich wichtig. Das was davor steht ist der Name der Skybox und den muss man sich merken.

Jetzt den Texture Browser einfach wieder schließen und oben im Editor auf „Map“ und dann auf „Map Properties…“ gehen. Dort findet man ein Feld namens „SkyBox Texture Name“ und genau dort gibt man nun den Namen der gewünschten Himmelsvariante – also z.B. „sky_cs15_daylight01_hdr“ – ein.

cs go mapping tutorial skybox textures

Auch dieses Fenster kann man dann wieder schließen. Nicht wundern: Durch das Aufrufen der Map-Eigenschaften wurden automatisch alle Elemente der Map ausgewählt. Um diese Auswahl aufzuheben einfach mit dem Selection Tool wieder ein einzelnes Objekt auswählen.

Textur als Werkzeug

Die Auswahl des Himmels ist getroffen, doch dieser wird in CS:GO nicht automatisch dargestellt. Wir müssen dem Spiel sagen, wo der Himmel bzw. die Umgebung dargestellt werden soll. Und dazu verwenden wir erstmals eine sogenannte „Tool Texture“.

Einen kleinen Ausblick auf dieses Thema gab es in unserem Tutorial über Texturen. Es handelt sich dabei quasi um „Werkzeuge“, mit denen man innerhalb des Editors arbeiten kann. Jede „Tool Texture“ übernimmt eine bestimmte Funktion. Die meisten dieser Texturen sind im Spiel komplett unsichtbar. Wir brauchen jetzt die Platzhalter-Textur für die Skybox. Wenn man „toolsskybox“ in den Filter eingibt, findet man diese direkt.

cs go mapping toolsskybox texture

Mit dieser Textur im Gepäck muss man die Map jetzt umschließen. Man erstellt also einfach normale Brushes, die lediglich eine spezielle Textur haben. Daraus wird im Spiel dann die Skybox.

The Sky is the Limit

Für Testzwecke könnte man einfach aus Brushes eine ausgehöhlte Box formen, die einen großzügigen Abstand zur eigentlichen Map hat und diese vollständig umschließt. Damit wäre die Map vom Nichts abgeschirmt und könnte kompiliert werden. Eine gute Lösung ist das aber keineswegs!

Für eine richtige Map muss man sich die Skybox eher wie einen angepassten Deckel vorstellen, der etwas größer ausfällt als die eigentliche Map. Der Grund für die angepasste Form ist, dass man keine Ressourcen verschwenden möchte, weil sonst die benötigte Zeit zum Kompilieren ansteigen und sich die in-game Performance verschlechtern würde.

cs go mapping tutorial skybox

Wie bereits erwähnt ist die Skybox auch eine Grenze. Die Brushes, die wir mit der „toolsskybox“-Textur belegen, sind zwar nicht sichtbar, aber sie sind dennoch fest. Beispielsweise prallen Granaten einfach davon ab – bestimmt hast du dieses Phänomen auch schon auf einer offiziellen Map beobachtet. Wenn du willst, dass man über Mauern und Dächer innerhalb deiner Map Granaten werfen kann, solltest du darüber etwas Platz lassen.

Du musst jetzt also Brushes mit der „toolsskybox“-Textur um die abgrenzenden Wände herum und als eine Art Deckel platzieren, so als würdest du normale Wände und eine Decke für einen Raum bauen.

cs go mapping tutorial skybox

Dort wo sich diese Brushes befinden, ist das absolute Ende deiner Map. Alles dahinter ist nur noch visuelle Trickserei, nennt sich „3D-Skybox“ und ist wie schon erwähnt ein eigenes Thema für ein späteres Tutorial.

Wichtig: Es darf am Ende keine Lücke ins „Nichts“ bestehen. Außerdem müssen die Skybox-Brushes auf jeder Seite mit der genannten Tool-Textur belegt sein. Sonst erhälst du Fehlermeldungen und kannst deine Map nicht kompilieren.

Du kannst dir auch die Beispiel-Map am Ende dieses Mapping Tutorials herunterladen, um zu sehen, wie ich die Skybox um eine einfache Test-Map herum gebaut habe.

Sonnenlicht strahlt herab

Unsere kleine Übungs-Skybox steht schon mal. Allerdings müssen wir sie auch noch dazu bringen, Licht zu spenden. Da wir jetzt einen Himmel haben, können wir ein Licht-Entity einsetzen, das von diesem Gebrauch macht.

An einer beliebigen Stelle innerhalb der Map muss ein neues Entity platziert werden. Dessen Klasse kann man entweder vorher auf der rechten Seite in das entsprechende Feld eingeben, oder im Nachhinein mit der Tastenkombination Alt+Enter die Eigenschaften öffnen. Für Sonnenlicht wird ein Entity der Klasse „light_environment“ benötigt.

cs go mapping tutorial light_environment

Wird erst im Nachhinein die richtige Klasse eingestellt, dann muss man diese im Eigenschaftenfenster bei „class“ eingeben und die Änderung mit einem Klick auf „Übernehmen“ bestätigen.

Dieses Entity erzeugt Umgebungslicht. Allerdings sollten wir die Einstellungen noch etwas anpassen. Dort können wir nämlich den Einfallswinkel und die Helligkeit festlegen. Also spätestens jetzt solltest du mit Alt+Enter die Eigenschaften des Entities mit dem Sonnen-Icon öffnen.

  • Pitch Yaw Roll (Y Z X): „Pitch“ bestimmt den Einfallswinkel, wird aber von einer weiteren Einstellung überschrieben. Deshalb lässt du den Wert am besten einfach auf 0 eingestellt. „Yaw“ bestimmt die Himmelsrichtung, aus der das Licht kommt. „Roll“ kann ignoriert werden. Mein Vorschlag: 0 70 0
  • Pitch: Überschreibt den oben angegebenen Wert und muss immer eingestellt werden. Pitch ist der Einfallswinkel des Sonnenlichts. Bei „0“ würde das Licht horizontal verlaufen, was nicht sinnvoll ist. Bei „-90“ scheint es senkrecht nach unten. Es muss also ein Wert dazwischen sein, ich schlage für den weiter oben ausgewählten Himmel „-50“ vor.
  • Brightness: Die ersten drei Werte bestimmen die Farbe – du kannst dafür auch den Button „Pick color“ verwenden. Der letzte Wert bestimmt die Helligkeit des direkten Sonnenlichts. Meine Empfehlung: 255 220 160 600
  • Ambient: Bestimmt die Farbe und die Helligkeit des Streulichts, das am ehesten in schattigen bereichen deiner Map zu sehen ist. Entsprechend machen eine dunklere Farbe und weniger Helligkeit Sinn. Beispiel: 180 200 230 200
  • SunSpreadAngle: Bestimmt in welchem Ausmaß weiche Schatten geworfen werden. Für sonniges Wetter ist „5“ ein guter Startwert. Für wolkige Szenarien sollten Werte >100 eingesetzt werden.

Die weiteren Einstellungen sind für das „HDR Lighting“ (HDR = High Dynamic Range), können aber einfach so belassen werden. Bei den vorgeschlagenen Werten habe ich mich übrigens an der Sky List aus dem offiziellen Wiki orientiert. Dort findest du passende Angaben zu verschiedenen Himmelsvarianten, die in den offiziellen CS:GO Maps verwendet werden.

cs go mapping tutorial light_environment

Licht mit den gerade eingegebenen Werten wird von allen Skybox-Brushes in deiner Map ausgestrahlt. Dadurch wird das Umgebungslicht simuliert. Du solltest deshalb auch nur ein einziges „light_environment“ Entity in deiner Map haben.

Die Sonne am Horizont

Witzigerweise ist unsere Map bereits mit Sonnenlicht ausgestattet, es gibt aber noch gar keine Sonne. Diese können wir aber als weiteres Entity hinzufügen. Dieses muss die Klasse „env_sun“ haben und kann an einer beliebigen Stelle innerhalb der Map platziert werden. Es sollte logischerweise auch hiervon nur eins pro Map geben, um Fehler zu vermeiden. Alles, was dieses Entity macht, ist ein Sprite – also eine einfache 2D Grafik – an einer bestimmten Position im Himmel darzustellen. Die Effekte und Farbeinstellungen sorgen dafür, dass es wie eine echte Sonne aussieht.

Um kein Hexenwerk daraus zu machen, lassen wir viele der voreingestellten Werte einfach unberührt. Ein paar Einstellungen sind aber absolut wichtig und müssen angepasst werden, damit die Sonne richtig dargestellt wird.

  • Pitch Yaw Roll (Y Z X): Hier sollte man die Werte aus dem „light_environment“ Entity übernehmen, damit die Position der Sonne mit dem Einfall des Lichts und dem Schattenwurf übereinstimmt.
  • UseAngles: Diese Einstellung unbedingt auf „Yes“ stellen, da sonst keine Sonne angezeigt wird.
  • Pitch: Hier ebenfalls den gleichen Wert wie beim „light_environment“ eingeben.
  • Size: Die Größe der Sonne. Probier doch mal beispielsweise „32“ als Wert.

Die anderen Einstellungen sind etwas Spielerei. Du kannst sie einfach auf den Standardwerte belassen.

cs go mapping tutorial env_sun

Zum Ende noch eine Anmerkung: Nicht jede Skybox unterstützt das „env_sun“ Entity. Das heißt es gibt auch Himmelsvarianten, bei denen keine Sonne dargestellt wird, egal was du machst. Manchmal kann man das schon vorher erahnen, wenn man die entsprechenden Texturen im Texture Browser sieht.

Licht und Schatten

Wir sind schon fast am Ende dieses Mapping Tutorials angekommen. Allerdings möchte ich die Gelegenheit nutzen, um noch ein paar Anmerkungen zu Licht und Schatten loszuwerden.

Das bereits angesprochene „HDR Lighting“ sorgt für reichhaltigere Farben, feinere Übergänge zwischen Hell und Dunkel sowie Blendeffekte. Dieses Feature wurde zu Zeiten von Counter-Strike: Source in die Source Engine integriert und war damals noch optional. In CS:GO ist HDR immer aktiv. Bei den Licht-Entities in deiner Map kannst du die HDR-Einstellungen aber erst einmal auf den Standardwerten belassen, damit machst du nichts falsch.

cs_museum review

Für die Berechnung der Schatten in CS:GO wird eine Technik eingesetzt, die auch in Dota 2 zum Einsatz kommt. Die sogenannten „Cascade Shadow Maps“ passen den Detailgrad der Schatten dynamisch an, je nachdem wie weit der Spieler von ihnen entfernt ist. Das sorgt vor allem bei Bäumen und anderer Vegetation für mehr Realismus. Im Gegensatz zu älteren Spielen auf der Source Engine wird deshalb das „shadow_control“ Entity in CS:GO nicht benötigt.

csgo update de_lake

Platzier doch einfach mal verschiedene Objekte in deiner Map und schau dir an wie die Schattenwürfe mit deinem neu eingerichteten Umgebungslicht aussehen. Erstelle dazu ein neues Entity der Klasse „prop_static“ und geh beim Eintrag „World Model“ auf den Button „Browse…“ – im Model Browser kannst du dann z.B. nach „tree“ suchen, um einen Baum zu platzieren. Ich hab mal einen Baum und eine Bank in meine Test-Map gestellt.

cs go mapping tutorial skybox light

In den meisten Fällen – so wie auch bei dieser Beispiel-Map, simuliert das light_environment Entity das Sonnenlicht. Schließlich spielen die meisten CS:GO Maps bei Tag. Der Grund warum wir es aber eigentlich als Umgebungslicht bezeichnen ist, dass es nicht zwangsläufig das Sonnenlicht simuliert. Spielt eine Map bei Nacht, braucht man dieses Entity genauso. Man schraubt einfach ein bisschen an den Lichtwerten, verpasst dem env_sun Entity ein anderes Sprite und schon hat man eine Nacht-Map mit Mondlicht. Ein schönes Beispiel dafür ist „Spooky Cobblestone“ vom CS:GO Halloween Event 2018.

cobblestone halloween update t spawn

Die Map in-game betrachten

Mit der Taste F9 rufst du das Menü zum Kompilieren auf. Damit deine Beleuchtung nicht fehlerhaft wird und die Models im Spiel schwarz sind, musst du diesen Workaround benutzen.

Mit dem Konsolenbefehl „map mapname“ (z.B. „map incs_tutorial_himmel_umgebungslicht“) kannst du deine Map jederzeit in CS:GO starten.

Beispiel-Map herunterladen

Wie ich im Tutorial bereits geschrieben habe, kannst du dir einfach die folgende Beispiel-Map herunterladen, um zu sehen, wie man eine Skybox um eine Map herum bauen sollte. Da es sich nur um eine total simple Map handelt, ist das Beispiel zwar nicht vollkommen repräsentativ, aber ich hoffe du verstehst die Idee dahinter.

Die VMF Datei kommt in den Ordner Steam\steamapps\common\Counter-Strike Global Offensive\sdk_content\maps\ und kann dann im Editor geladen werden.

Mit diesem Mapping Tutorial sollten die Grenzen erweitert werden, so dass du mehr als nur geschlossene Räume bauen kannst. In den folgenden Tutorials kümmern wir uns dann endlich auch um die Elemente, die deine Map zu einer richtigen, spielbaren CS:GO Map machen. Als nächstes sind Buyzones an der Reihe.