Astral Chain: Neuer Blog-Eintrag beschäftigt sich mit dem User Interface im Spiel

    • Astral Chain: Neuer Blog-Eintrag beschäftigt sich mit dem User Interface im Spiel

      In dieser Woche haben sich vier Mitarbeiter von PlatinumGames zusammengeschlossen, um gleich zwei Blog-Einträge zum Thema User Interface (UI) in Astral Chain zu erstellen, Ein UI Artist entwirft jede Anzeige im Spiel: Sei es die Lebensanzeige, die Minikarte auf dem Bildschirm, Dialogboxen, Menüs, divsere Icons im Spiel und vieles mehr. Doch nicht nur das Konzept, sondern auch die Erstellung und Animation der UI-Elemente sind dessen Aufgabe. Zunächst erklärte Rui Onishi, Lead UI Artist von Astral Chain, sein Vorgehen bei der Konzepterstellung.

      Als erstes wurde ein übergeordnetes Design-Konzept für das UI benötigt, wie dies auch bei den Charakteren und der Umgebung der Fall ist. Astral Chain hat ein technologisch-fortgeschrittenes, in der nahen Zukunft liegendes Setting, wo eine Vielzahl an Informationen über Hologramme dargestellt wird. Dadurch wurde das übergeordnete Ziel schnell gefunden: Das UI soll so aussehen, als würden Hologramme in die Umgebung projiziert, um weitere Informationen zu erhalten. Dabei sollte es nicht aussehen, als ob die Informationen nur dem Spieler zugänglich sind, sondern auch vom Charakter im Spiel wahrgenommen werden. Folgend ein paar Skizzen von Rui Onishi:


      © PlatinumGames

      Zunächst war das UI recht flach, geordnet und einfach gehalten, was leicht an "Papierkram" in Büros erinnerte. Nach etwas Nachdenken entschied sich der Lead UI Designer des Spiels, Rui Onishi, dass der Stil passend ist. Durch die Einfachheit ist es auch möglich gewesen, die nötige Menge an Informationen darstellen zu können. Er experimentierte auch mit unterschiedlichen Perspektiven und begann die exakt-angeordneten Fenster etwas zu verschieben. Dadurch wirkt das UI nun wie in die Welt projiziert, direkt in Sichtweite des spielbaren Charakters.

      Es werden hohe Kontraste verwendet, um mit dem allgemeinen, grafischen Stil des Hintergrundes und der Legionen zu harmonieren. Die Animationen des UI besitzen scharfe Linien und leichte, digitale Störungen, um mehr dem Sci-Fi-Gefühl gerecht zu werden. Es gibt viele Details im Spiel, wie die Stadtlandschaften auf der Arche, die vor Farben nur so strotzen und auch die Hologramme von Neuron, welche die selbe Rolle wie der "Papierkram im Büro" in unserer heutigen Zeit spielt. Und viele Polizisten von Neuron sind recht jung, einschließlich des Spielcharakters, sodass eine Balance zwischen der formalen, behördlichen Ästhetik und der Pop-Anime-Sensibilität gefunden werden musste. Folgend ein Bild vom UI des Legatus-Menüs während der Entwicklung, was noch nicht das finale Design im Spiel darstellt:


      © PlatinumGames

      Nach einiger Zeit wurden zwei Designregeln für das UI-Design festgelegt: Das Design soll zum einen simpel gehalten werden und etwas an "Papierkram im Büro" erinnern und zum anderen durch sein schlankes, futuristisches Aussehen Hologrammen ähneln. Diese zwei Grundpfeiler bildeten die Basis der weiteren Arbeiten des UI-Teams.

      Als nächstes schrieb Yasutaka Saito etwas für den Blog. Er ist ebenfalls UI Artist bei PlatinumGames, allerdings ist er erst seit etwa einem Jahr im Entwicklerteam tätig, wovon er etwa sechs Monate lang an Astral Chain arbeitete. Seine Aufgabe waren alle Grafiken auf dem Monitor und auch die Animationen, einschließlich der Animation des Spielelogos auf dem Titelbildschirm. Bevor er seine Arbeit daran aufnahm, gab es bereits einige grobe Animationsskizzen. Der Director des Spiels gab ihm die Aufgabe mit folgenden Anweisungen: Die Logo-Animation soll nicht zu lang sein und es soll leicht erkennbar sein, wann das Logo komplett angezeigt wird. Mit diesen zwei Anweisungen begann er den Feinschliff.

      Dazu verwendete er eine Mischung aus digitalem Störungsrauschen, chromatischer Aberration und einem leichten Schütteleffekt am Ende, wenn das Logo fertig generiert wurde, um die Aufmerksamkeit auf das fertige Logo zu ziehen. Die Animation erfolgte in Adobe After Effects, ohne das speziell in dieser Software vorkommende Effekte verwendet wurden. Die Animation hat auch etwas "retro-haftes" an sich, da er Dutzende einzelne Bilder anfertigte, die in Kombination die komplette Animation ergeben. Er denkt auch, dass er für die Logo-Animation mehr Rechtecke an einem Tag zeichnete als er es in seinem ganzen restlichen Leben zeichnen wird. Folgend einige Beispielbilder, die für die Logo-Animation im Titelbildschirm zum Einsatz kommen:


      © PlatinumGames

      Die Animationen im Legatus-Menü (also dem Pausenmenü) sind ebenfalls von ihm. Beim Aufrufen wird das Menü größer und zum Hauptfokus auf dem Bildschirm. Mit etwas vereinzelten Rauscheffekten fühlt es sich dynamisch und wie ein Hologram an, ohne dass die Effekte die Aufmerksamkeit vom Menü nehmen. Nach Öffnen des Menüs schwebt etwas Rauschen mit einem "Sandsturm"-Effekt durch das Bild. Dieser altbackene Effekt macht deutlich, dass der Spieler auf ein projiziertes Bild schaut. Allerdings darf der Effekt nicht zu sehr hervorgehoben werden, da sonst das Menü zu "retro" aussehe.

      Als nächstes war Kenta Okura an der Reihe, welcher sich hauptsächlich um das HUD, also das Head-up Display, kümmerte, allerdings auch Hand an den Menüs und die Anzeige gelegt hat. Das HUD bot einige Herausforderungen in der Animation. Denn nach Ende einer Zwischensequenz und Übergang in das normale Gameplay müssen die Einblendungen der einzelnen HUD-Elemente stimmig sein. Folgend ein Bild, um euch die Elemente zu zeigen, die im Spiel zum HUD gehören:


      © PlatinumGames

      Das HUD, anders als ein Menü, ist starr und der Spieler kann nicht mit diesem Interagieren, jedoch muss das HUD eine gewisse Anzahl an Informationen bereitstellen. Er ist sich bewusst, dass die Animationen von bestmöglicher Qualität sein müssen. Zunächst sammelte er Referenzmaterial und entschied sich für eine Designrichtung. Diesen eigentlich allgemeingültigen Prozess unterschätzte er nicht, da die Animationen sonst unterdurchschnittlich und nicht überzeugend wären.

      Zwei Tage lang hat er grobe Richtlinien für die Animationen des HUDs erarbeitet: Das Setting des Spiels durch Raster, Pixel, quadratischem Rauschen und anderer ähnlicher Effekte wiederzuspiegeln und die dritte Dimension auch voll ausnutzen, damit es nicht nur ein simples, zweidimensionales HUD ist. Dies sind die zwei Grundprinzipien seiner Arbeit daran, doch er hat noch zwei weitere verinnerlicht: Das Design soll so universell wie möglich bleiben, um bei verschiedenen Elementen zu funktionieren. Außerdem ist es nie zu früh, ein Auge auf die benötigte Prozessorleistung zu werfen. Natürlich gab es ein paar Komplikationen und Ideen, die während der Entwicklung aufkamen, doch durch die vorherigen Arbeiten sind die Animationen recht einfach entstanden.

      Als letztes schrieb Ryoko Konami über seine Arbeit, speziell über den Foto-Modus. Er selbst hat vor allem an den Icons für Items, der Karte, dem HUD und den Menüs für den Foto-Modus gearbeitet. Und auch für den Foto-Modus gab es Vorgaben vom Director des Spiels, Takahisa Taura: Die Steuerung der Kamera sowie der Kamerasucher müssen stets sichtbar sein und der Spieler muss in der Lage sein, zwischen verschiedenen Kamera-Modi zu wechseln. Neben diesen zwei Regeln muss auch das HUD in das übergeordnete Designkonzept des UI passen. Und das HUD der Kamera muss auch nützlich sein, ohne dass es in den Weg gerät. Nach einigen Recherchen erstellte er ein Platzhalter-Layout. Folgend ein Screenshot vom fertigen Kamera-HUD:


      © PlatinumGames

      Als Onishi (Lead UI Artist) und Taura (Director) das Layout bewilligten, implementierte ein Programmierer das HUD im Spiel. Danach sah sich der Fotografie-Club von PlatinumGames (zu welchem auch Taura zählt) das HUD an und es gab einige Rückmeldungen. Dadurch gibt es nun mehr Optionen und Icons als zunächst angedacht, denn am Anfang der Entwicklung sollte es nur ein simpler Modus zum Aufnehmen von coolen Screenshots sein. Der Foto-Modus entwickelte sich schnell, sodass nun verschiedene Filter im Spiel freigeschaltet werden können und alle Bilder landen auch in der Neuron-Datenbank, wodurch Charaktere, Gegner und Orte angeschaut sowie Informationen zu diesen eingeholt werden können.

      Dies war ein Einblick in die Arbeit des UI-Teams von Astral Chain. In den als Quelle verlinkten Blog-Artikeln findet ihr weitere Informationen sowie Videos zu den UI-Animationen. Ist für euch das Design eines UI im Spiel wichtig?

      Quelle: PlatinumGames (1), (2) – Newsbild: © Nintendo / PlatinumGames
    • das zweite bild erinnert stark an das menü/inventar/interface von dead space aber sowas gefällt mir passt super in so ein sci fi setting

      um ehrlich zu sein weiß ich nichtmal warum mich das spiel so anfixt ^^ hab eigentlich kaum die ganzen news gelesen immer nur schnell überflogen

      das spiel hat mich aus für mich unbekannten gründen bereits seit tag eins gehabt als ich die ersten bilder gesehen habe und später dann noch kurz 1-2 videos überflogen habe

      bei BotW war das fast genauso als ich das spiel damals auf youtube gesehen habe war innerhalb weniger sekunden klar ich brauch jetzt ne switch xD