02

Cafe Noir

An Augmented Reality mystery experience that seamlessly integrates the University interchange to boosts students' sense of community

CLIENT

UNIVERSITY OF NOTTINGHAM

ROLE

SOLE DESIGNER

RESPONSIBILITIES

XR GAME DESIGN, CONCEPT DEVELOPMENT, PROTOTYPE

PROJECT DURATION

APRIL - MAY 2024 (1 MONTH)

APRIL - MAY 2024 (1 MONTH)

AR mobile mystery game mockup
AR mobile mystery game mockup
AR mobile mystery game mockup
AR mobile mystery game mockup

INTRO

Social engagement is low in the University Hub


Cafe Noir groups students together, and challenges them to work as a team to unravel an AR mystery. Teams will use AR visual markers, digital cards, and interactive audio to encourage spatial exploration in the Hub, breaking the ice between strangers and igniting friendships.

100

100

100

%

CUSTOMER REFERRALS

60

60

60

%

INCREASED ENGAGEMENT

90

90

90

%

OVERALL SATISFACTION

RESEARCH

The architectural layout & traffic circulation are the foundation of the game narrative


Research involved analysing the Exchange Building's layout, functions, and user flow to identify circulation and high activity zones. Using Mixed Reality Ideation Cards, game concepts were crafted around room divisions, functions, and existing props, to encourage physical interaction within the space.

DESIGN

Interactive design system were designed around the grand piano


Site analysis informed core gameplay concepts and storyboards, defining the mystery and user journey. A consistent design system featured character profiles, a navigation map, hidden clues, and visual markers. Prototyping with Meta Spark AR added immersive features like interactive UI elements, audio cues, and social media integration to expand engagement beyond the game.

SOLUTION

Using social media integration for further digital outreach


Spark AR allows users to share experiences on Instagram and Facebook, promoting the university's brand. This fosters a digital community, encouraging student engagement both on campus and online, aligning with the goal of enhancing campus life and increasing student engagement.

design process game navigation with visual markers and map
design process game navigation with visual markers and map
screen mockup of game character profiles
screen mockup of game character profiles

"

Solving the mystery was rewarding and the experience reminded me of childhood games, making it a perfect break between lectures – I'd definitely play a sequel!

Solving the mystery was rewarding and the experience reminded me of childhood games, making it a perfect break between lectures – I'd definitely play a sequel!

  • SOPHIE (PARTICIPANT 2)

  • SOPHIE (PARTICIPANT 2)

"

AR game screens mockup
AR game screens mockup

EVALUATION

Richer storyline and clues can enhance ongoing game adaptations


Usability testing with participants were conducted via think-aloud protocols and post-game surveys. Key insights revealed likability towards interactive audio and visuals but suggested deepening game narrative, improvements in clue placements, and opportunities for dynamic voice acting to enhance the mystery immersion further, playing into the detective role.

users playing AR game mockup
users playing AR game mockup





REFLECTION

AR design principles & combining physical-digital spaces


Reflecting on the HCI challenges of marker recognition, placement, and user interface alignment, I identified areas for improvement in the experience by expanding future iterations that incorporate 3D visuals, richer narratives, and immersive features like timed markers and expanded environments for exploration in the game. This project deepened my understanding of AR design, blending storytelling, technology, and user-centred principles to create immersive experiences.