30+ Minigames, 4 Rooms, 1 Immersive Experience

Designing for Speed and Usability in High-Pressure, Multiplayer Game Environments

Client:

Gateways Creative

Role:

UX Research

UX Design

Visual/UI Design

Interaction Design

Sprints/Time

5 sprints
4 months

Sector:

Gaming, Interactive, Immersive, Experiential

Target Users

Young adults (ages 20–34) seeking social, immersive entertainment experiences
Secondary audiences: families and mixed-age groups.

Tools:

Figma, FigJam, Adobe CC, Adobe Firefly and Chat GPT for AI image generation

Deliverables:

Research, Competitive Analysis, Sitemap, User Flows, Low-fidelity Wireframes, Prototype

Optimizing scalable interfaces in a fast-paced, 90-second immersive game environment

🎮 Game Structure

Gateways Cinescape is an immersive, real-world gaming experience where players step into themed environments and compete in interactive challenges across 4 physical rooms. Each experience supports up to five players, split between a solo role and an ensemble team. These roles operate in separate spaces with distinct control systems, creating an asymmetric gameplay experience.

First Festival: Experience Overview & UX Design Challenge

🐲 My team worked on First Festival, where players progress through a board-game-style experience across four distinct environments—the Tavern, Shrine, Shacks, and Griffin’s Room (solo player). These spaces are enriched with interactive screens and thematic details to immerse players in the experience. Gameplay centers around completing a series of mini-game challenges, incorporating mechanics tied to physical interaction, timing, and coordination.

⚙️ While the experience relies heavily on physical environments and props, digital screens play a critical role in gameplay, responsible for communicating real-time instructions, feedback loops, and game states. Each mini-game lasts only 90 seconds, leaving little time for users to learn gameplay systems or understand their roles. Many players are first-time participants, which increases the need for clear guidance without relying on prior knowledge.

💪 The challenge was to communicate essential information—such as rules, timing, scoring, and feedback, while prioritizing clarity, speed of comprehension, and seamless integration. At the same time, the interfaces had to scale across multiple game types, player roles, and environments, maintaining consistency while adapting to different gameplay scenarios (2v2, 4v1, FFA).

Competitive Insights: Strategy Games vs Real-Time Experiences

We conducted a competitive analysis of Mario Party and Wii Party to identify patterns in successful multiplayer game experiences. This research revealed key opportunities around rapid onboarding, including the use of simple tutorials, clear visual cues, and immediate feedback.

🎯 Research Insight: Players need to learn mechanics instantly in short-form games
Design Direction: Design rapid onboarding flows with minimal instructions, visual cues, and learn-by-doing interactions

🎯 Research Insight: Cluttered UI makes it hard to track progress at a glance
Design Direction: Prioritize information hierarchy, highlighting only essential elements (timer, objective, feedback) for quick decision-making

🎯 Research Insight: Lack of role differentiation reduces engagement
Design Direction: Introduce asymmetric roles, giving players distinct responsibilities to encourage collaboration and replayability

🎯 Research Insight: Fast-paced environments can feel chaotic
Design Direction: Create guided interaction patterns and simplified UI to reduce cognitive load

Information Hierarchy Exploration: Prioritizing Timers, Scores, and Player States

✍️ Multiple sketches were explored for the main screens and conveyor screens to figure out where to put the timer, instructions, player scores and how to show solo vs. ensemble play. In the sketches below, the timer is prominently displayed for quick visibility, while player scores are positioned along the bottom to avoid interference with gameplay. A large “Time’s Up” message signals the end of the mini-game, with scores updating immediately to provide clear feedback.

Recommendation

Prioritize large, highly legible typography for key information so it can be seen across the room. For the conveyor screens, position a smaller timer within the interface to reinforce time constraints without dominating the potion displayed.

From Entry to Outcome: Designing a Seamless, Feedback-Driven Game Experience

🎲 The main flow for all games begins when guests enter and encounter an idle screen, which helps orient them and build anticipation. This quickly transitions into an instruction screen where key information—such as game guidance and win conditions—is communicated. This stage is critical for rapid onboarding before a short countdown signals the shift to gameplay action.

⏱️ Once the game begins, players enter a timed, round-based gameplay loop where quick decision-making is essential. Immediate feedback is provided through visual and audio cues, reinforcing player actions and helping them adjust in real time. At the end of each round, a winner is announced, followed by a prompt that moves players to the next experience. This structured flow—learn, play, receive feedback, and transition—creates a predictable and efficient loop that supports engagement across multiple games.

⚔️ The solo room flow centers on one player competing against the ensemble team. The solo player sends signals and patterns, while the ensemble interprets and responds—driving both collaboration and competition. Real-time feedback helps players quickly understand outcomes and adjust. Scores are tracked separately for each role and compared at the end of the round to determine a winner before returning to the main game board.

Low Fidelity: Reducing Cognitive Load Through Function-Driven UI Design

These low-fidelity wireframes prioritize clarity, hierarchy, and rapid comprehension—critical for a 90-second game loop.

🎮 The instruction screen establishes the foundation of the experience by clearly separating “How to Play” and “Winning” conditions. The use of simple language and bullet points reduces friction, while visual mapping of controls (up = ice, down = fire, center = none) introduces interaction patterns.

⏱️ The gameplay screen centers around a highly visible timer, reinforcing urgency and making time the focal point. The control mappings remain anchored at the bottom of the screen, ensuring they are always accessible during gameplay. On the right, a vertical player scoreboard displays real-time performance. The time’s up screen provides a clear end to the game and transition out of gameplay.

🏆 The results screen reinforces outcome and reward by centering the winner and displaying all player scores below for context, creating a clear information hierarchy.

Crafting an Immersive Visual System for High-Energy Gameplay

🎨 This mood board draws inspiration from Legends of the Hidden Temple, capturing an adventurous, mystical tone through an ancient jungle temple setting. Weathered stone, overgrown ruins, and carved details create a sense of history, while glowing pathways, potions, and UI elements add fantasy and interactivity. Tension and urgency are emphasized through bold timers and fiery progress indicators, reinforcing fast-paced, high-stakes gameplay. A grounded palette of greens, grays, and earth tones is contrasted with vibrant accents of blue, red, and gold to highlight key interactions and game states. Symbolic elements—relics, potions, dice, and temple figures—support a narrative of ancient magic and hero-driven quests, creating an immersive world that feels both playful and epic.

Designing a Consistent Visual Experience Across Roles and Interactions

🐺 The player and statue icons establish a clear visual identity for each role. Each character—dragon, eagle, elephant, and wolf—is paired with a distinct color and sculptural form, making it easy for players to quickly recognize themselves and others in-game. The griffin, highlighted in red, is set apart as the solo role, reinforcing its unique gameplay function. Extending these into statues helps bridge the digital UI with the physical environment, strengthening immersion and spatial recognition.

🪄 The wand and potion assets define the core interaction system. Wands represent solo player inputs (fire, ice, air), while potions visualize outcomes and game states. Strong color coding and elemental symbolism make interactions intuitive and readable at a glance.

Putting It Together: Interactive Prototype for Real-Time Gameplay

🕹️ The main gameplay screens and prototype for the solo player bring these elements together. The central timer creates urgency and anchors attention, while the environmental styling reinforces the temple theme. The progress bar labeled “Ensemble” and “Solo” simplifies team scoring into a single, glanceable element, replacing more complex score breakdowns. Placing the wand selection vertically on the side prioritizes accessibility for the solo player, ensuring inputs are easy to reach and interact with during rapid gameplay.

💥 Conveyor screens below the prototype demonstrate how potions appear to the ensemble who must fil physical glasses with the correct potion or it explodes. The conveyor screen comes into play in the Tavern room and is a separate screen experience.

Reducing Cognitive Friction Through Better Feedback and Focused Interaction Design

✅ Top: Feedback for Actions

In the initial wireframe, correct and incorrect actions were communicated through small indicators placed at the bottom of the screen, making them easy to overlook and forcing players to divert attention away from the main gameplay. The high-fidelity solution addresses this by leveraging the central timer as a dynamic feedback mechanism. By briefly transforming the timer into a green checkmark (correct) or red X (incorrect), depending on action, the design delivers immediate feedback without requiring additional cognitive load.

🦸 Bottom: Modifying for the Solo Player

This iteration adapts to better support the unique needs of the solo player. In the initial wireframe, the interface treated the solo experience similarly to multiplayer modes by displaying a vertical list of individual player scores. This approach added unnecessary complexity and did not align with the solo player’s primary function of sending patterns quickly and accurately to the ensemble team. In the high-fidelity design, the wand controls are repositioned vertically along the side of the screen, creating larger, more accessible touch targets for faster interactions. This improves usability by aligning the interface with the solo player’s core task while reducing visual clutter.

Color-Coded Progress Indicators As A Scalable Scoring Mechanism

💎 Game points are represented visually through a progress bar at the bottom. Each time a player gets a point a colored jewel is awarded on their side. The leading player or team shows green jewels, while the player or team that is behind acquires red. This color-coding provides an immediate, at-a-glance understanding of who is winning without needing to read detailed scores. The colored jewels change in real-time. If both teams have the same number of points, the jewels will present yellow.

👉 By tying points directly to board progression and using clear visual states, the system reinforces player performance in a way that is intuitive, competitive, and easy to interpret during fast gameplay. At the end of each mini-game, a leaderboard displays player scores and rankings, providing a clear snapshot of individual placement.

Designing a Thematic and Accessible Color System for Gameplay

🎨 This color system was designed to support both the thematic world-building and the functional needs of the experience. Inspired by an ancient jungle temple aesthetic, the palette combines earthy tones—chocolate brown, forest green, and tan—to ground the environment. These darker and medium tones serve as the foundation for backgrounds and environmental elements, allowing the interface to feel integrated with the physical space rather than layered on top of it.

🔴 Brighter accent colors, including red and gold, are used strategically to communicate game states, urgency, and interaction feedback. Lighter tones provide contrast for text and UI elements, ensuring readability across varying lighting conditions within the room.

🌗 Accessibility was a key consideration. Each color pairing was tested for contrast, with ratios meeting or exceeding accessibility standards to ensure that critical information remains legible from a distance and across different viewing angles.