Zurück

Afterglow Grand Prix

Ein Arcade-Rennspiel mit Formelwagen, das direkt im Browser läuft: Gehen Sie gegen fünf KI-Fahrer an den Start – mit Drifts, Boost und Windschatten auf einem Rundkurs bei Sonnenuntergang, in regennassen Stadtstraßen und auf einem nächtlichen Stadtkurs in Singapur. Alle fünf Rennwagen in der Garage wurden mit Tripo generiert.

Autor: Theodore
Live ausprobieren
Afterglow Grand PrixLive ausprobieren

Beschreibung

Afterglow Grand Prix ist ein Arcade-Rennspiel mit Formelwagen, das direkt im Browser läuft. Im Starterfeld stehen sechs Wagen: Sie und fünf KI-Fahrer. Es gibt drei Strecken – Afterglow International bei Sonnenuntergang (3,4 km, 14 Kurven), die regennassen Rain City Streets (2,4 km, 14 Kurven) und einen Stadtkurs nach dem Vorbild des Nachtrennens von Singapur (4,9 km, 19 Kurven). Wählen Sie zwischen Sonnenuntergang, Regennacht und klarer Nacht, und legen Sie Rundenzahl und KI-Schwierigkeitsgrad selbst fest (Easy, Normal, Hard oder Extreme).

Jeder der fünf Rennwagen in der Garage fährt sich anders: AURUM GT ist ausgewogen und einsteigerfreundlich; AURELIA hat einen explosiven Antritt und kommt am schnellsten aus den Kurven; NERINE hat den meisten Grip und ist in der Kurvenmitte am schnellsten; DELUSION ANGEL ist die Drift-Königin und lädt den Boost am schnellsten auf; VIRELIA erreicht die höchste Endgeschwindigkeit, lenkt sich aber schwer. In der Fahrzeugauswahl können Sie zwischen zwei Szenen wechseln – den Wagen, abgestellt in einer nächtlichen Boxengasse, oder Ihrem Wagen mit Vollgas auf einer Strecke unter Flutlicht –, und durch Ziehen mit der Maus lässt sich der Wagen rundum drehen.

Jedes Rennen beginnt mit einem filmischen Intro: ein Überflug über die Startaufstellung, eine bodennahe Kamerafahrt durch das Feld, dann eine Nahaufnahme Ihres Wagens – und sobald die fünf roten Lichter erlöschen, geht es los. Das Renn-HUD ist an TV-Übertragungen angelehnt – ein Positionsturm, die Abstände zu den Wagen vor und hinter Ihnen und ein Renningenieur mit Ihrer voraussichtlichen Endplatzierung und Siegwahrscheinlichkeit –, dazu kommen Banner für Überholmanöver und schnellste Runden, während die großen Videowände an der Strecke das Rennen live zeigen. Bei der Zieldurchfahrt gibt es die Zielflagge, eine kreisende Kamera und ein Feuerwerk, danach die Ergebnisse.

Je länger Sie driften, desto kräftiger der Schub beim Loslassen, und die Funken wechseln von Blau über Orange zu Pink; Driften lädt Ihren Boost auf, der sich auf den Geraden am meisten lohnt; hängen Sie sich hinter einen Wagen, um in seinen Windschatten zu kommen; fahren Sie zu weit über die Randsteine hinaus, bremst Sie das Gras aus, das Kiesbett noch stärker. Die fünf KI-Fahrer haben jeweils eine eigene Persönlichkeit: Einer ist auf der Geraden am schnellsten, macht aber in Kurven Fehler, einer ist ein Kurvenspezialist, der auf den Geraden langsam ist, und einer verteidigt knallhart.

Steuerung: W für Gas, S für Bremse / Rückwärtsgang, A / D zum Lenken (Pfeiltasten funktionieren auch); Leertaste gedrückt halten zum Driften – je länger Sie halten, desto stärker der Schub; Shift für den Boost, C zum Wechseln zwischen naher Verfolger-, ferner Verfolger- und Cockpitkamera, R zum Zurücksetzen, M zum Stummschalten, Esc / P für Pause. Tippen Sie bei hohem Tempo während des Lenkens kurz S an, um den Wagen in einen Drift zu werfen. Vorerst wird nur die Tastatur am Desktop unterstützt, ohne Touch- oder Gamepad-Steuerung.

Empfohlen wird Chrome / Edge 113 oder neuer (WebGPU); Browser ohne WebGPU weichen automatisch auf WebGL2 aus, und ist beides nicht verfügbar, weist die Seite Sie darauf hin. Beim ersten Laden einer Strecke müssen die Shader kompiliert werden, daher dauert es etwas länger. Die Benutzeroberfläche des Spiels ist auf Englisch.

Rennwagen und Wahrzeichen · Mit Tripo generiert

Die fünf Rennwagen in der Garage wurden vom Art-Team mit Tripo generiert und anschließend einheitlich in das vom Spiel benötigte Format gebracht: Alle Reifen stehen auf derselben Höhe, und jedes der vier Räder ist einzeln herausgelöst und auf seine Nabe zentriert, sodass sich die Räder im Rennen drehen und einschlagen lassen. Auch die Wahrzeichen entlang der Strecke wurden mit Tripo aus Referenzfotos generiert, und nachts erleuchtet das Spiel ihre Fenster und die Läden im Erdgeschoss.

Damit innerhalb von Sekunden ein Wagen auf dem Bildschirm steht, gibt es jedes Fahrzeug in zwei Versionen: Die Fahrzeugauswahl lädt zuerst einen leichtgewichtigen Platzhalter mit etwa einem Zehntel der Dreiecke und 512-Pixel-Texturen, während das vollständige Modell im Hintergrund heruntergeladen wird – der Fortschritt wird direkt in der Fahrzeugauswahl angezeigt – und den Platzhalter ersetzt, sobald es bereit ist. Die vollständigen Modelle verwenden Meshopt-komprimierte Meshes und KTX2-Texturen, die beim Laden in die nativen komprimierten Formate der GPU transkodiert werden, was Grafikspeicher spart.

Abgesehen von diesen Modellen wird alles andere in der Szene – Strecke, Barrieren, Tribünen, Lichtgerüste, Häuserblocks, Zuschauer und Himmel – per Code generiert. Rund um den Singapur-Kurs wächst die Stadt aus den realen Grundrissen und Höhen der Gebäude in den offenen Kartendaten von OpenStreetMap empor, ohne dass darüber hinaus etwas erfunden wird; die Marken auf den Werbetafeln an der Strecke sind allesamt fiktiv.

So läuft das Spiel im Browser

Eine Game-Engine gibt es nicht: Das Spiel baut direkt auf dem WebGPU-Renderer von three.js auf; Materialien, Postprocessing und Regenpartikel sind als TSL-Nodes geschrieben, sodass derselbe Code in Browsern ohne WebGPU automatisch auf WebGL2 umschaltet. Das gesamte Spiel ist nach dem Build eine statische Website von rund 26 MB, den Großteil machen Auto- und Gebäudemodelle aus.

Nachtrennen leben von ihrer Beleuchtung: Die LED-Straßenlaternen und Neonschilder entlang der Strecke laufen über Clustered Lighting, damit die Szene eine große Zahl von Punktlichtern verkraftet; die nasse Fahrbahn erhält eine Pfützenmaske, Rauheit pro Pixel, planare Spiegelungen und Wellenringe von Regentropfen, und der Regen selbst ist ein Partikelsystem auf Compute-Shader-Basis. Das Postprocessing stapelt Ambient Occlusion, Bloom, Nebel, Color Grading, Filmkorn und Anti-Aliasing, bei hohem Tempo kommt eine radiale Geschwindigkeitsunschärfe hinzu.

Die Bilder auf den großen Videowänden an der Strecke liefert live eine virtuelle Streckenkamera, die dem verfolgten Wagen vorauseilt und mit ihm mitschwenkt, alle sechs Frames ein 256×144-Bild aktualisiert und eine Rundenleiste, einen Positionsturm und eine Fahrereinblendung darüberlegt; im Ziel fixiert sie Ihren Wagen und zeigt Ihre Endplatzierung.

Für die Grafik gibt es die Stufen Low, Medium und High; sie legen Renderauflösung, Shadow-Map-Größe, Ambient Occlusion, Fahrbahnspiegelungen und die Anzahl der beibehaltenen Lichter fest. Sämtliche Shader werden vorab hinter dem Ladebildschirm kompiliert – selbst das Feuerwerk an der Ziellinie wird vorher aufgewärmt –, damit mitten im Rennen nichts ruckelt. Der Sound läuft über Web Audio: Motor, Gangwechsel, Reifen, Wind, Regen und Publikum werden allesamt in Echtzeit synthetisiert, Musik und UI-Sounds hingegen sind CC0-Assets.