EagleUp Game
Wo Tabletop-Haptik auf digitales Interface-Design trifft.
Branche: Gaming | Stack: Figma, Design Systems, Game UI | Status: In Entwicklung | Kunde: Italien
Was EagleUp Game ist#
EagleUp ist ein Tabletop-RPG- und Videospiel-Hybrid: ein Spiel, das die soziale, strategische Tiefe des physischen Tabletop-Rollenspiels bewahrt und gleichzeitig das Erlebnis in ein digitales Format mit Live-Visualfeedback, interaktiven HUDs und vernetzten Multiplayer-Lobbys überträgt.
Unser Engagement umfasste die visuelle Designebene: Style Guides, Lobby-Screen-Design, Heads-up-Display-Systeme und die Designsprache, die dem Spiel eine kohärente Identität auf jedem Screen verleiht, den ein Spieler berührt.
Dies war ein Design-Engagement, kein Full-Stack-Build. Was wir lieferten, war das visuelle und interaktive Fundament, auf dem das Entwicklungsteam aufbaut. Die Entwicklungsarbeit findet auf deren Seite statt.
Das Designproblem: Tabletop-Gefühl in einer digitalen Hülle#
Tabletop-RPGs funktionieren wegen der Haptik. Das Gewicht der Würfel, die Textur der Charakterbögen, die räumliche Anordnung von Spielfiguren auf dem Brett. Das ist nicht dekorativ. Es sind Interaktionsmuster, die Spieler über Jahrzehnte verinnerlicht haben. Wenn man ein solches Spiel in ein digitales Format überführt, ist der erste Impuls, es wie ein Videospiel aussehen zu lassen. Dieser Impuls ist falsch.
Spieler, die vom physischen Tabletop kommen, wollen kein generisches Fantasy-MMO-Interface. Sie wollen die Wärme und taktile Logik des Tabletop-Erlebnisses auf dem Bildschirm. Eine Karte sollte sich anfühlen wie eine Karte, die man falten könnte — nicht wie ein Level, in dem man respawnt. Das HUD sollte die Geschichte unterstützen, statt sich in den Vordergrund zu drängen.
Das war das Kernproblem dieses Projekts. Jeder Screen, den wir gestalteten, musste dieselbe Frage beantworten: Fühlt sich das nach EagleUp an oder nach jedem anderen Spiel?
Was wir gestaltet haben#
Style Guide und visuelle Sprache#
Wir entwickelten EagleUps Style Guide von Grund auf: Typografie-Entscheidungen, Farbpaletten, Ikonografie-Systeme, Abstandsregeln und Komponentenmuster, die sich durch jedes Interface im Spiel ziehen. Er ist das Referenzdokument für jeden Designer und Entwickler, der künftig am UI arbeitet.
Die visuelle Richtung musste zwei Dinge gleichzeitig vereinen. Wärme war wichtig: organische Texturen, handgezeichnete Elemente, gedeckte Erdtöne, die an physische Spielmaterialien erinnern. Aber ebenso Lesbarkeit: klare Typografie-Hierarchie, konsistente Abstände, interaktive Affordances, die offensichtlich sind, ohne klinisch zu wirken. Diese beiden Aspekte zur Koexistenz zu bringen, ohne dass einer dominiert, war die eigentliche Design-Herausforderung.
Lobby-Screens#
Die Lobby ist der erste Screen, den ein Spieler sieht. Wir gestalteten Lobby-Screens, die die praktischen Anforderungen abdecken (Spielerliste, Spieleinstellungen, Session-Management, Einladungsabläufe) und gleichzeitig die Identität des Spiels verstärken. Die visuelle Gestaltung schöpft aus der Tabletop-Kultur. Es sollte sich anfühlen, als setze man sich mit Freunden an einen Tisch — nicht als betrete man eine Matchmaking-Warteschlange.
HUD-Design#
Das HUD ist der Bereich, in dem Kompromisse teuer werden. Während des Spiels konkurriert jedes Element auf dem Bildschirm um die Aufmerksamkeit des Spielers. Zu viele Informationen brechen die Immersion. Zu wenige lassen Spieler mitten in der Session orientierungslos zurück.
Wir gestalteten EagleUps HUD danach, was der Spieler in jedem Moment des Spiels braucht: Gesundheit, Ressourcen, Zugreihenfolge, verfügbare Aktionen. Erzählerische Momente bekommen mehr Freiraum; aktive Züge erhalten ein dichteres Layout. Die Informationshierarchie ändert sich kontextabhängig, statt statisch zu bleiben.
Komponentensystem für die Entwickler-Übergabe#
Jeder Screen, den wir lieferten, wurde aus einer strukturierten Komponentenbibliothek in Figma aufgebaut: Buttons, Karten, Modals, Eingabefelder, Statusanzeigen und Navigationselemente — alle mit ihren Zuständen (Standard, Hover, Aktiv, Deaktiviert) und Nutzungsrichtlinien dokumentiert. Das Entwicklungsteam erhält ein System, das es konsistent implementieren kann, nicht nur einen Satz statischer Mockups zur Interpretation.
Zentrale Kompetenzen#
- Style Guide mit Typografie, Farbe, Ikonografie, Abständen und Komponentenmustern.
- Lobby-Screens: Session-Management, das gleichzeitig als erster Eindruck des Spiels dient.
- HUD-Systeme, aufgebaut um kontextsensitive Informationsdichte.
- Komponentenbibliothek mit dokumentierten Zuständen, Varianten und Übergaberichtlinien.
- Visuelles und Interaktionsdesign, abgestimmt auf Spieler mit physischem Spielhintergrund.
Ergebnisse#
EagleUp befindet sich in Entwicklung. Die Design-Liefergegenstände sind abgeschlossen und das Entwicklungsteam baut jetzt darauf auf.
Dieses Projekt ist repräsentativ für eine bestimmte Art von Engagement: reine Designarbeit, bei der die visuelle und interaktive Ebene feststehen muss, bevor die erste Zeile Game-Code geschrieben wird. Wir haben so schon zuvor gearbeitet, und die Übergabe ist wichtiger, als es klingt. Entwickler arbeiten schneller, wenn das System klar ist. Sie treffen weniger Interpretationsentscheidungen, weniger „Ich frage den Designer später"-Entscheidungen. Genau das leistet eine gut dokumentierte Komponentenbibliothek.
Benötigen Sie UI/UX-Design für ein Produkt, Spiel oder eine Anwendung? Unsere UX/UI-Design-Services ansehen oder ein kostenloses Automation Audit buchen.
