Wie Kluge Interactive Synth Riders auf Apple Vision Pro brachte

Synth Riders, ein immersives Rhythmusspiel, kam 2019 auf Steam VR und Meta Quest auf den Markt und wurde seitdem auf zahlreiche Geräte portiert, darunter Apple Vision Pro. Hier erfahren Sie, was das Team bei der Entwicklung eines Mixed-Reality-Erlebnisses für visionOS gelernt hat.

Wie kann ein Studio einen beliebten Titel für Apple Vision Pro neu gestalten und dabei die Cyberpunk-Ästhetik mit dem minimalistischen und farbenfrohen Design von Apple vereinen?

Da es sich bei Apple Vision Pro um eine neue und sich weiterentwickelnde Plattform handelt, war sich das Team von Kluge Interactive der möglichen Hürden bewusst und wusste, dass es sich anpassen musste, um erfolgreich zu sein. Ihr Hauptaugenmerk lag auf der Einhaltung der Frist für die Markteinführung der Plattform am ersten Tag und auf dem Feinschliff ihres Spiels, um den hohen Anforderungen der Medienvorschauen gerecht zu werden.

Vorbereitung auf eine neue Herausforderung

"Unser Team war schon immer sehr technikorientiert. Die Möglichkeit, für Apple Vision Pro zu entwickeln, kam zum richtigen Zeitpunkt, denn wir wollten die visuelle Seite von Synth Riders verstärken und waren gerade dabei, die Benutzeroberfläche des Spiels neu zu gestalten", sagt Arturo Perez, Geschäftsführer von Kluge Interactive.

Jede Synth Riders-Veröffentlichung bringt plattformspezifische Herausforderungen mit sich. Nachdem sich das Team darauf geeinigt hatte, das Spiel neu zu portieren oder, wie in diesem Fall, für ein neues Medium neu zu konzipieren, begannen die Vorbereitungen für die Arbeit mit der Hardware. In den letzten anderthalb Jahren hat das Team Portierungen für PlayStation VR2 und Meta Quest 3 veröffentlicht und dann schnell auf Apple Vision Pro umgestellt.

"In den letzten 12 bis 18 Monaten der Spieleentwicklung ging es darum, technische Schulden abzubauen und unsere Toolsets näher an die 2022 LTS heranzuführen", erklärt Ann-Marie Wirrel Bartholomaeus, Technical Producer bei Kluge Interactive. "Wir sind bereits von der Built-in Render Pipeline auf die Universal Render Pipeline (URP) umgestiegen und haben auf ein OpenXR-Backend umgestellt. Das hat dazu beigetragen, dass wir technisch viel besser in der Lage sind, mit neuen Technologien zu arbeiten.

Außerdem verfolgten sie einen modulareren Ansatz und bemühten sich, das Spielgeschehen von Grafik und Eingabe zu entkoppeln. Wenn sie eine neue Portierung begannen, verwaltete dieses "Core"-Paket Dinge wie das Laden von Musik, das Erstellen von Menüs und das Auffüllen von interaktiven Notizen und Schienen im Spiel. Dadurch konnte sich das Team darauf konzentrieren, wie die Daten auf der jeweiligen Plattform dargestellt werden, um das gewünschte Aussehen und die gewünschte Wirkung zu erzielen.

Bartholomaeus sagt: "Je mehr wir verschiedene Konzepte von Synth Riders erforschen wollten, desto fantastischer war es, diese Teile herauszulösen. Wir haben den Core verwendet, um mit Synth Riders für Apple Vision Pro voranzukommen, und er war äußerst hilfreich."

Die Ergebnisse

• Erstellung einer neuen, überarbeiteten Version ihres Rhythmusspiels für die Markteinführung von Apple Vision Pro am ersten Tag
• Einsparung der Kosten für die Einstellung eines ganzen plattformspezifischen Teams von mehr als 15 Künstlern, Entwicklern und anderen Personen
• Erhielt eine durchschnittliche Bewertung von 4.7/5 auf Apple Vision Pro

Entwerfen einer responsiven UI

Als das Team von Kluge Interactive mit der Überarbeitung der Benutzeroberfläche für Apple Vision Pro begann, wurde ihnen schnell klar, dass Apple vorschreibt, wie man auf Dinge klickt und wie eine Standardschaltfläche aussehen sollte. Da die Eye-Tracking-Daten den Entwicklern nicht direkt zur Verfügung stehen, mussten sie sich anpassen und Probleme lösen, um eine funktionierende Benutzeroberfläche zu schaffen, die alle Regeln befolgt.

Ohne Zugang zu Eye-Tracking-Daten kam eine individuelle Lösung nicht in Frage. Um gut mit dem in Apple Vision Pro integrierten Hervorhebungssystem zusammenzuarbeiten, wurde die gesamte Benutzeroberfläche in 3D neu erstellt.

"Die Verwendung einer standardmäßigen leinwandbasierten Benutzeroberfläche könnte funktionieren, aber wir hatten Probleme mit der Überlagerung verschiedener transparenter Ebenen", erklärt Miguel Mosquera, ein Entwickler bei Kluge Interactive. "Das Hauptproblem war die quadratische Form, die die Leinwand, das Bild und die 2D-Elemente hervorhob. Es war ästhetisch nicht ansprechend, und das Highlight passte nicht zum Objekt. Um dieses Problem zu vermeiden, ging das Team zu einer 3D-Benutzeroberfläche über, da 3D-Elemente ein quadratisches Netz und eine Alphatextur zur Unterstützung verwenden.

Durch die Nachbildung der Benutzeroberfläche in 3D wurde sichergestellt, dass die Hervorhebungen für das Auge mit der Form der Schaltflächen übereinstimmen, aber das allein reichte nicht aus, damit sich die Benutzeroberfläche auf der Plattform natürlich anfühlt. Der Lichteffekt war immer ein sanftes weißes Leuchten am Rande der Silhouette eines Objekts, und das mussten die Menüdesigner berücksichtigen. So wurden beispielsweise helle Farben und blockige Ränder zugunsten weicherer Verläufe mit dunkleren Farben vermieden.

Obwohl dies einen vollständigen, separaten Arbeitsablauf für das Team bedeutete, hat es den neuen Prozess angenommen und ist mit den Ergebnissen insgesamt sehr zufrieden. Perez sagt: "Das war es wert. Die Benutzeroberfläche ist viel aufgeräumter als auf anderen Geräten".

Gestaltung leistungsfähiger Effekte

Das Team hat sowohl die Replicate Properties- als auch die Bake to Mesh-Methode ausprobiert, um Shuriken Unity-Effekte zu ihrem PolySpatial-Projekt hinzuzufügen. Bei der Option Eigenschaften replizieren werden die Eigenschaften des Unity-Partikelsystems auf ein natives Partikelsystem in Xcode angewendet. Mit der Bake-to-Mesh-Methode wird die Ausgabe des Unity-Partikelsystems in ein Standard-Mesh umgewandelt. Letzteres war wesentlich ressourcenintensiver, unterstützte aber eine breitere Palette von Funktionen, die mit einem nativen Partikelsystem nicht nachgebildet werden konnten.

Das Team war der Meinung, dass die Vervielfältigung von Eigenschaften im Allgemeinen die bessere Option sei, entschied sich aber letztendlich für die Option Bake to Mesh. "Partikelspuren waren ein Muss, das unser 3D-Künstler unbedingt nutzen wollte, um audio-reaktive visuelle Effekte für das Spiel zu erstellen, und das war mit der Option Eigenschaften replizieren nicht möglich", sagt Justin Dopiriak, ein leitender Entwickler bei Kluge Interactive.

Die Option "Bake to Mesh" war ziemlich anstrengend, und einige der Partikelsysteme, die sie auf dem Bildschirm verwendeten, hatten einen großen Overhead. "Wir haben das System bis an seine Grenzen gebracht, und es war interessant herauszufinden, woher die Leistungsprobleme kamen", so Dopirak weiter. "Nachdem wir die Probleme gefunden und behoben hatten, entdeckten wir, dass die Verwendung reiner Scheitelpunkte eine gute Lösung war.

Da sie jedes Mal einen Effekt in das Mesh einbauen mussten, wirkte sich allein die Anzahl der Vertexe viel stärker aus als auf anderen Plattformen. Um den Overhead zu verwalten und die Ressourceneinsparungen zu optimieren, haben sie sich sehr genau überlegt, was sie verwenden dürfen. Der Gesamteffekt auf die visuelle Wiedergabetreue war vernachlässigbar. "Als wir in allen Bereichen disziplinierter waren, was wir anwendeten und wie wir uns einschränkten, hatten wir am Ende ein nahezu perfektes Äquivalent", schließt Dopiriak.

Beleuchtung der Bühne

Zur Erstellung von Shadern und Beleuchtungen griff das Team auf die Tools und die Dokumentation von Unity PolySpatial zurück. Sie entdeckten neue, speziell für visionOS entwickelte Knoten, die bei fehlender Beleuchtung im Simulator hilfreich waren, sowie eine Liste von Knoten, die anzeigte, ob jeder einzelne mit der Plattform kompatibel war. Dies erwies sich als vorteilhaft bei der Konvertierung von Tangentenräumen, der Verwaltung von Reflexionssonden und Blickrichtungen sowie der Handhabung der Normalenabbildung.

Das Team verwendete den PolySpatial Lighting Node als Hauptausgabeknoten und steckte alles an seinen Platz. Die Grundfarbe, normal, metallisch und die Glätte sind gleich geblieben.

"Es handelte sich um einen Shader mit zwei Durchläufen, denn auf der PolySpatial-Seite, der Apple Vision Pro-Seite, fügte das Headset Reflexionen von unserer Umgebung und einige Beleuchtungen hinzu, die auf dem Feedback der Kamera basierten", erklärt Esteban Meneses, ein 3D-Künstler. "PolySpatial Lighting verwaltete alles, was wir von der Engine kannten, und es gab Optionen für die gebackene Beleuchtung. Wir haben über die Verwendung von Lichtkarten und Lichtsonden diskutiert, die beide sehr nützlich waren."

Für die Reflexionstests standen dem Team einfache und gemischte Optionen zur Verfügung. Von dort aus wurde alles, was vom PolySpatial Lighting Node kam, in die Grundfarbe und die Emission eingesteckt, um auf Nummer sicher zu gehen.

"Es gibt Pässe, die die Grundfarbe verwenden, und die wollten wir nicht in Schwarz haben", so Meneses weiter. "Ich habe einen Intensitätsmodifikator hinzugefügt, um die Werte zu erhöhen und künstlerische Freiheit zu gewinnen. Ich habe die Reflexionsvariable von Apple Vision Pro verwendet und die Ambient Occlusion im finalen Node ausgeschaltet, so dass wir die Reflexionen der Umgebung nicht sehen konnten." Diese Kontrolle über die Reflektivität ermöglichte es dem Team, ihr Spiel sauber aufzuteilen zwischen Objekten, die sich scheinbar mit dem Benutzer im Raum befanden, und solchen, die er durch ein Portal sah.

Handtracking ausprobieren

Als sich das Team mit der Neugestaltung des Spiels befasste, machte es seinen ersten richtigen Vorstoß in die Handsteuerung. Obwohl sie anfangs wegen der fehlenden Haptik Bedenken hatten, waren sie von den Ergebnissen begeistert. "Wenn man einen Controller in der Hand hält, endet die Hand normalerweise am Handgelenk, aber mit dem Hand-Tracking werden die Finger wichtig und man kann Gesten machen und mit der Musik auf eine andere Art und Weise interagieren. Das brachte eine neue Dimension in das Spiel", sagt Bartholomaeus.

Ohne Kontrolleure haben sie sich an eine neue Art der Eingabe angepasst. Sie mussten auch die Lücke schließen, die der Spieler mit der Haptik auf nicht-intrusive Weise verbindet. Bartholomaeus erklärt: "Wir arbeiteten an audio-reaktiven Effekten, Beleuchtung und verschiedenen Partikeln, die die Verbindung mit dem Lied auf der Grundlage ihrer Aktion förderten. Die Interaktion mit den Schienen war besonders wichtig.

Das Team stützte sich auf die Plattformdokumentation, um sich über die Skelettabweichungen bei Apple Vision Pro zu informieren, die es bei anderen Plattformen nicht gibt. Was das Gameplay betrifft, so haben sie das Handgelenk als einzigen Punkt für die Extrapolation herangezogen. Da sie sich für eine Mischung aus Hand-Tracking für die Gameplay-Elemente und räumlichem Tippen für alles andere entschieden haben, haben sie keine benutzerdefinierten Gesten verwendet. "Wir haben die Vorteile genutzt, die uns das Betriebssystem bot. Ich ermutige die Leute, das zu nutzen. Er war wirklich sehr leistungsfähig", sagt Bartholomaeus.

Rendering und Optimierung der Leistung

Außerdem musste das Team ein neues Rendering-Verfahren erlernen. Bei anderen Plattformen wurde das, was sie erstellten, in der Regel direkt in Unity gerendert, aber bei visionOS gab es einen zweiten Schritt in RealityKit. Eine der größten Herausforderungen, die das Team zu bewältigen hatte, war der Verzicht auf einen Line Renderer, eine Komponente, die aus einem Array von zwei oder mehr Punkten im 3D-Raum eine gerade Linie zwischen diesen Punkten zeichnet. Diese Komponente war ein großer Gewinn für das Team für ihr Schienensystem in anderen Versionen von Synth Riders.

"Als wir auf dieses Hindernis stießen, konnten wir mit dem Unity PolySpatial-Team ein fantastisches Brainstorming durchführen", sagt Bartholomaeus. "Für die Schienen, eine Funktion, die noch nicht von der Plattform unterstützt wurde, schlugen sie unserem technischen Künstler vor, sie von Grund auf mit einem Standard-Mesh und Vertex-Displacement neu zu erstellen, was wirklich gut funktionierte."

In Bezug auf die Leistungsoptimierung war eine der wichtigsten Lektionen, die sie gelernt haben, dass sie keine Annahmen auf der Grundlage ihrer Erfahrungen mit anderen Plattformen machen sollten. Als das Team das gesamte Spiel durchging und Stück für Stück Optimierungspfade zur Leistungssteigerung testete, entdeckte es, dass Lösungen, die die Auswirkungen der Materialinstanzierung in URP auf anderen Plattformen reduziert hatten, auf Apple Vision Pro nicht anwendbar waren. "Nachdem wir das Problem gefunden hatten, änderten wir ein paar Codezeilen. Es war eine einfache Lösung und die Verbesserung war dramatisch", sagt Dopiriak.

Das Team testete auch die Leistung mit dem Unity Profiler, dem Xcode Debugger und der Funktion "Play to Device". "Am Anfang war es schwierig, zu testen und Probleme zu finden", erklärt Mosquera. "Die Funktion Play to Device hat uns geholfen, Probleme schneller zu lokalisieren, und ohne sie hätte das Projekt länger gedauert."

Auf die nächste Stufe bringen

Seit seiner Gründung als Designstudio im Jahr 2007 hat sich Kluge Interactive mit neuen Technologien beschäftigt und neue Dinge ausprobiert. Obwohl sich Synth Riders im fünften Jahr seines Bestehens befindet, sieht das Team eine lange Reihe neuer Inhalte voraus und ist bestrebt, aktiv Funktionen zu entwickeln und die Beziehung zwischen Bild und Musik auf Apple Vision Pro zu verbessern.

"Design ist ein wichtiger Teil unserer DNA. Zu sehen, wie viel Absicht in diesem Gerät und in seinem Betriebssystem steckt, hat uns immer wieder inspiriert. Ich weiß, dass wir mehr erreichen können, und ich bin gespannt, was als Nächstes kommt", sagt Perez.

Heute für Apple Vision Pro bauen

Sprechen Sie mit unserem Team, um zu erfahren, wie wir Ihnen helfen können, die leistungsstarken Tools und Workflows von Unity zu nutzen, um überzeugende räumliche Erlebnisse zu schaffen.