Technische Grafik hinter der tollen Farbe von I See Red

WHITEBOARD GAMES / WHITEBOARD GAMESAuthor
Jul 21, 2023|10 Minuten
Technische Grafik hinter der tollen Farbe von I See Red
Diese Website wurde aus praktischen Gründen für Sie maschinell übersetzt. Die Richtigkeit und Zuverlässigkeit des übersetzten Inhalts kann von uns nicht gewährleistet werden. Sollten Sie Zweifel an der Richtigkeit des übersetzten Inhalts haben, schauen Sie sich bitte die offizielle englische Version der Website an.
In diesem Gastbeitrag erläutert Whiteboard Games die Geschichte der ersten kommerziellen Veröffentlichung des Studios, I See Red, und teilt das technische Denken, das in den einzigartigen Farbansatz des Spiels eingeflossen ist.

Wir sind Whiteboard Games, ein Entwicklungsstudio, das 2021 in Buenos Aires, Argentinien, von fünf College-Absolventen gegründet wurde, die ihren eigenen Weg in der Spielebranche gehen wollten. Seitdem ist Whiteboard auf ein Team von 30 jungen Fachkräften angewachsen. Sie lesen dieses Intro, weil wir uns heute hier versammelt haben, um über unsere erste kommerzielle Veröffentlichung zu sprechen: Ich sehe Rot.

I See Red ist ein rasender, doppelstäbiger Shooter-Roguelit, bei dem es um Wut, Kampf, Rache, Blut, tragische Vergangenheit und – ja, es ist im Namen – RED geht. Es ist nicht schwer, andere Spiele zu unterscheiden, nicht nur wegen der Sci-Fi-Umgebungen und der Top-Down-Kamera, sondern auch wegen einer entscheidenden Ästhetik: Sie werden aufgefordert, mehr Farben als Schwarz, Weiß, Grau und Rot zu finden. Dies ist eine Entscheidung, die schon früh getroffen wurde und eng mit narrativen und Gameplay-Aspekten verknüpft ist. Natürlich hat es seine Herausforderungen: Ein Spiel mit einer so begrenzten Palette zu erstellen (und zu spielen) ist nicht für jeden. Wie sind wir dann vorgegangen? Lesen Sie weiter, um es herauszufinden.

Geschichte von I See Red

Beginnen wir mit einem kurzen historischen Abstecher, um zu untersuchen, wie sich der Look im Laufe der Zeit entwickelt hat und welche entscheidenden Entscheidungen zu dem geführt haben, was I See Red heute ist.

Erster Prototyp

Alles begann mit einer Abschlussarbeit für den Kurs „Videospieldesign und Programmierung“ an der Da Vinci First School of Multimedia Art in Buenos Aires. Aus dieser Arbeit entstand ein Spiel, das künstlerisch weniger anspruchsvoll sein musste, da die Studierenden nicht viel Geld haben. Zu diesem Zeitpunkt hatte sich die Farbe Rot noch nicht durchgesetzt. Es gab Blau, sogar Grün im Spiel, aber lasst euch nicht zu sehr darauf ein, denn die zusätzlichen Farben werden nicht lange da sein.

Fachliche Weiterbildung

Nach Abschluss des Kurses konnte unser Gründerteam das Projekt nicht mehr loslassen, da es echtes, kommerzielles Potenzial sah. Wir beschlossen, die Entwicklung außerhalb des Colleges fortzusetzen und ein Team zusammenzustellen, was zur Gründung von Whiteboard Games als Studio führte. (Fun fact: Einige unserer Professoren sahen ebenfalls Potenzial und beschlossen, dem Team beizutreten, als sie um Hilfe gebeten wurden.)

Zu diesem Zeitpunkt waren die Grundlagen des Spiels bereits abgedeckt: ein rasanter Sci-Fi-Shooter über rote, rasende Rache.

Endgültiger Look (mit HDRP)

Monate und sogar Jahre vergingen. Inmitten von Gesprächen mit Herausgebern und Investoren hat I See Red viele miteinander verbundene Level – jetzt nicht nur mit menschlichen Feinden, sondern auch mit Aliens –, eine enorme Menge an Passiven, Cutscenes und einen noch eleganteren Grafikstil. Mit genug Fehlerbehebungen, Tests, Inhalten und Leistungsverbesserungen (es ist okay, wir müssen uns nicht bedanken) war das Spiel bereit, die Sonne zu sehen.

Endgültiger Look (mit URP)

Irgendwann kam die Zeit für die Veröffentlichung des Spiels. Wir hatten an ein paar Events und Wettbewerben teilgenommen und waren stolz auf das, was wir geschaffen hatten. In dieser Phase haben wir beschlossen, eine mögliche Veröffentlichung für Konsolen zu planen, von HDRP zu URP zu wechseln und scharfe HD gegen eine noch stilisiertere Ästhetik einzutauschen. Wir haben den Graustufenfarben (ja, Blau ist wieder da... aber sag es niemandem) auch einen dezenten kalten Farbton hinzugefügt, um ein metallischeres Gefühl zu erzeugen, und alles noch weiter poliert. Durch diesen Wechsel mussten wir einige HDRP Funktionen in URP umbauen, aber wir sind uns sicher, dass sich die Mühe gelohnt hat.

Zusätzlich zu den Alien-Leveln der vorherigen Stufe gab es bei I See Red jetzt auch Roboterfeinde, mehrere Bosse, Storyline, Qualitätssicherung, Lokalisierung und mehr. Es war an der Zeit, den großen grünen Knopf zu drücken.

Es war sicherlich ein langer Weg mit vielen Herausforderungen und Veränderungen auf dem Weg dorthin, ganz zu schweigen von jahrelanger Arbeit. Wir finden, dass es sich fantastisch anfühlt und aussieht, und wenn Reggie Fils-Aimé und andere der „erfahrensten Experten der Branche“ das sagen, dürfen wir nicht verrückt sein. Auf jeden Fall haben wir es geschafft und veröffentlicht. Aber die Frage nach dem Wie blieb. Gute Nachrichten an alle Technical Art Fans da draußen: Es ist an der Zeit, technisch zu werden. (Inhaltswarnung: Wir sind alle mit dem Blut ausgegangen.)

Blut-VFX

Wir haben viel Zeit auf Blut verwendet, weil es das hauptsächliche visuelle Feedback ist, das Sie erhalten, wenn Sie einen Feind treffen oder im Spiel getroffen werden. Dieses Element sollte klar und überzeugend sein, und Rot ist die wichtigste Farbe des Spiels, daher gab es keinen Platz für Faulheit.

Wir wollten die Welt rot mit Blut malen, also brauchten wir einen starken Kontrast zwischen dem Grau der Umgebungen und dem Blut sowie Variationen für Aufkleber. Wir hätten Texturen verwenden können, um die Decals zu maskieren, aber mit der Menge, die wir brauchten, wurde es zu repetitiv. Natürlich wollten wir das nicht.

Wir haben Rauschen, den URP-Decal-Projektor und die Weltkoordinaten kombiniert, sodass sich die Form ändert, je nachdem, wo wir die Decals platziert haben. Mit dieser Technik haben wir es so gemacht, dass Breite, Höhe, Kantenglättung und Blutrauhigkeit mit ihm reibungslos animiert werden können. Das ist praktisch, wenn wir zum Beispiel eine Blutlache unter einem besiegten Feind spawnen müssen.

Der Shader Graph in Aktion zur Generierung der I See Red-Aufkleber.

Indem wir die Farben der Albedo und die Eigenschaften der Lärmmasken ändern, können wir auch verschiedene Arten von Blut für Außerirdische und Roboter erzeugen, die etwas haben, das Öl ähnelt. Dies diente nicht nur dazu, einen ästhetischen Unterschied zwischen Feinden zu erreichen. Aus Gameplay-Sicht war es ebenso wichtig zu wissen, welches Blut welches ist, da die Spieler eine passive Fähigkeit Acquire können, durch die sie das zurückgelassene Blut „aufnehmen“ können, mit unterschiedlichen Effekten: menschliches Blut ist neutral, außerirdisches Blut schädigt und Roboterblut heilt.

Neben Decals werden in I See Red auch viele Blutpartikel verwendet. Denken Sie an die passive Fähigkeit, über die wir gerade gesprochen haben: Wir mussten den Spielern die Absorption vermitteln. Das Ergebnis sind natürlich die Mini-Bluttornados.

Die drei Blut-„Tornado“-Partikel, eines für jede Art von Feind: Alien, Mensch und Roboter.

Diese knorrigen Wirbelwinde wurden sowohl durch die Verwendung einer Scrolltextur als auch durch einen Partikeleffekt erreicht. Der Partikeleffekt ist ein 3Dmodelliertes Band (ein Streifen aus Polygonen) plus ein Shader, der die Textur mithilfe des Haupt-UV ganz nach oben scrollt. Auf diese Weise konnten wir die benutzerdefinierten Daten aus dem Partikelsystem verwenden, um die Geschwindigkeit, den Fluss und die Form auf dem Mesh zu ändern sowie ein Ein- und Ausblenden für die Strips hinzuzufügen, damit der Effekt oben und unten im Tornado glatt erscheinen und verschwinden konnte. Nehmen Sie dies, fügen Sie einige Blutsträhnen für zusätzlichen Saft hinzu, und Sie haben einen umgekehrten Bluttornado, der Blut in den Spieler absorbiert.

Apropos Partikel: Partikeleffekte bei Treffern dürfen wir nicht vergessen, wenn der Spieler oder Feind Schaden nimmt. Diese Partikel werden im selben Frame wie der Blutpool/Aufkleber gespawnt, über den wir gesprochen haben, wobei beide für einen nahtlosen Übergang durch eine Code-Koroutine animiert sind. Sie spawnen in die Richtung, in die die Kugel ging, im Allgemeinen entgegengesetzt zum Spieler.

Dies durch Code zu tun, erwies sich als sehr nützlich, um den Effekt zu personalisieren, indem er größer wurde, wenn der Schaden größer war oder wenn der Feind näher war oder sogar wenn der Effekt in der Nähe einer Wand lag. Wir haben Raycasting verwendet, um festzustellen, wie lang das Decal und die Partikel sein können, bevor sie durch eine Wand clippen, und wie die Neigung des Decals sein sollte (wenn es beispielsweise an eine Wand gehen muss). Diese Werte haben wir dann an die Animation weitergegeben und die Magie ist eingetreten.

Treffereffekte, die Ihren Kugeln ein sehr zufriedenstellendes Gefühl verleihen.
Codeausschnitt für Hit-Effekte

Das ist eine Menge Blut. Viel Rot. Da das Spiel eine begrenzte Palette verwendet, mussten wir sicherstellen, dass die Lesbarkeit in keinem Aspekt verloren geht. Die Einschränkungen unseres unverwechselbaren Looks führten dazu, dass wir kreativ werden und viele Tools und Tricks anwenden mussten. Zum Beispiel sind rote Dinge nicht immer rot.

Vielleicht sehen Sie eine Tür, die einen roten Umriss hat und leuchtet, aber wenn Sie sie betreten, wird sie grau. Dasselbe passiert mit Feinden, die rot sind, während sie feindlich sind und grau, sobald sie... nun, nicht mehr feindlich sind. Über diese Signale nutzt das Spiel seine unverwechselbare Farbe, um zu kommunizieren, welche Dinge von Interesse sind: unerforschte Gebiete, wichtige Objekte, gefährliche Hindernisse und mehr. In gewisser Weise ist es, als ob der Spieler ständig eine „detektive Vision“ hat und sich ständig aktualisiert, um nur das zu zeigen, was in diesem Moment relevant ist.

Aber was ist, wenn Sie nicht so rot sehen wie wir? Was ist, wenn jemand, der I See Red spielen möchte, die Unterschiede zwischen Rot und Grau ebenfalls nicht wahrnehmen kann? Wir möchten auf jeden Fall, dass jeder „The Rage“ erleben kann. Aus demselben Grund ist I See Red auch in 13 Sprachen verfügbar. Sicherlich würden viele der Sprecher dieser 13 Sprachen von den Barrierefreiheitsfunktionen profitieren. Rufen Sie unseren benutzerdefinierten URP-Farbblindmodus auf.

Spezieller Farbenblindmodus URP

Bei der Entwicklung von I See Red wussten wir, dass ein Universum in Schwarz, Weiß und Rot vielleicht nicht für jeden lesbar ist. Deshalb haben wir eine Lösung für die Implementierung verschiedener Farbenblindmodi entwickelt, damit jeder spielen kann. Die beste Möglichkeit, dies zu erreichen, war die Verwendung der Scriptable Render-Funktionen in Unity und eines einfachen Shaders. Die Hauptidee dahinter ist, jeden Wert in den verschiedenen Kanälen mit einer Art Look-Up-Tabelle innerhalb des SRF zu transformieren, die diese Werte dann in den Shader für den endgültigen Renderdurchlauf übersetzt. Da der Effekt als letzter Durchgang über allen anderen Objekten ausgeführt werden musste, die in der Welt gerendert wurden, wird dieser Durchgang nach dem Rendern der Benutzeroberfläche ausgeführt und ist der letzte Durchgang in jedem Frame in I See Red.

Nachdem wir die verschiedenen Arten von Farbenblindheit untersucht und untersucht hatten, wie wir den Scriptable Render nutzen konnten, um ihnen gerecht zu werden, indem wir verstanden hatten, wie jede Person die Farben in I See Red wahrnehmen könnte, konnten wir verschiedene Modi erstellen, um die Farben entsprechend zu schärfen oder zu modifizieren: Protanomalie, Protanopie, Deuteranomalie, Deuteranomalie, Tritanomalie, Tritanopie, Achromatomalie und Achromatopsie. Je nachdem, wen Sie fragen, sieht das rote Spiel unter diesen vielleicht nicht so rot aus, aber das ist für uns okay: Letztendlich ist es das Wichtigste, dass jeder das Spiel genießen kann. Es gibt noch viele weitere Systeme, um die Wut zu kommunizieren, die Sie brauchen.

Schließlich ist unser Blut wunderschön und für alle... zumindest solange sie älter als 14, 15, 16 oder 17 Jahre sind, je nachdem, wo Sie leben. Aber Blut ist sicherlich nicht alles, was die Ästhetik von I See Red ausmacht. Vergessen wir nicht, dass Rot in vielerlei Hinsicht, Schattierungen und Formen vorkommt, ebenso wie Grau.

Splatmap-Shader

Wir mussten einen Weg finden, ein Farbschema zu erstellen, das sich an neue Modelle anpassen kann, ohne die Textur von Grund auf neu zu machen, was viel Zeit in Anspruch nimmt. An diesem Punkt müssen wir klarstellen: I See Red ist nicht wirklich schwarz, weiß und rot, sondern wie die meisten anderen Spiele rot, grün und blau. Wir haben am Anfang gelogen (sorry), aber es sieht immer noch nicht so aus wie die meisten anderen Spiele. Der Grund dafür ist, dass wir einen benutzerdefinierten Shader verwendet haben, der eine Splatmap anwendet. Dabei handelt es sich um eine Textur, die mehrere Graustufentexturen oder Masken zu einer kombiniert und pro Textur einen anderen Kanal (rot, grün, blau oder alpha) verwendet.

Die verschiedenen Phasen unseres Modellierungsprozesses, einschließlich der RGB Splatmap.

Dies ermöglicht uns eine bessere Kontrolle der Farben im Spiel, indem wir jeden Kanalwert innerhalb der Engine einzeln steuern und Ressourcen sparen, indem wir weniger Texturen laden. Es hilft auch massiv bei der Iterationszeit.

GIF der Splatmap in Aktion innerhalb des Unity Editors.
Es gibt noch mehr?

Wir haben Blut. Wir haben Feinde. Wir haben Umgebungen. Wir haben die Farben, die wir brauchen. Es fühlt sich gut an. Als Nächstes könnten wir über benutzerdefinierten Nebel, Beleuchtung und Kameramathematik, Tone Mapping oder diese coole Sache mit der falschen Perspektive auf Cutscenes sprechen...

Ja, es könnte noch viel mehr gesagt werden, aber wir wären stundenlang hier (und das braucht Zeit, um zu schreiben), also könnten wir es genauso gut abschließen. Keine technischen Sachen mehr. Erleben Sie es einfach: Spielen Sie I See Redselbst und teilen Sie uns mit, wenn Sie etwas im Zusammenhang mit dem sehen, worüber wir hier gesprochen haben. Zögern Sie nicht, uns oder die schönen Leute bei Unity zu kontaktieren, wenn Sie mehr erfahren möchten.

Danke fürs Lesen, bis zum nächsten Mal!

Sie können das Spiel I See Red noch heute auf Steam herunterladen. Entdecken Sie nach dem Spielen weitere Geschichten der Entwickler Made with Unity.