DJ Duel

DJ Duel

In-Arena Showdown — Arcade XR Immersive Gaming Experience for Toronto Raptors

In-Arena Showdown — Arcade XR Immersive Gaming Experience for Toronto Raptors

Read More ↓

(My Role)

I owned and led design of DJ Duel for the Toronto Raptors, sponsored by Sirius XM. My responsibilities encompassed establishing game flow, crafting user journeys, and designing mobile UX/UI, projection mapping design, jumbotron animations, and core visual identities, playing a pivotal role in the project's realization.

I owned and led design of DJ Duel for the Toronto Raptors, sponsored by Sirius XM. My responsibilities encompassed establishing game flow, crafting user journeys, and designing mobile UX/UI, projection mapping, jumbotron animations, and core visual identities, playing a pivotal role in the project's realization.

CLIENT

Toronto Raptors, SiriusXM

YEAR

2024

ROLE

Design Lead

TEAM

MLSE Arcade, MLSE Digital Labs Developer Team

MLSE Arcade,
MLSE Digital Labs Developer Team

Duration

2 months

(Goal of the Project)

Boost sign-ups and enhance brand recognition
Boost sign-ups and enhance brand recognition

DJ Duel, presented by Sirius XM, transforms fan engagement at live Raptors Games with an immersive gaming experience. It utilizes state-of-the-art projection systems to bring games directly onto the court. DJ Duel is a multiplayer game designed for brief 2-3 minute sessions during intermissions, encouraging fans to compete and fostering camaraderie and friendly rivalry in the arena. The project aims to boost sign-ups and enhance partner brand recognition by offering an engaging digital experience that captivates fans.

DJ Duel, presented by Sirius XM, transforms fan engagement at live Raptors Games with an immersive gaming experience. It utilizes state-of-the-art projection systems to bring games directly onto the court. DJ Duel is a multiplayer game designed for brief 2-3 minute sessions during intermissions, encouraging fans to compete and fostering camaraderie and friendly rivalry in the arena. The project aims to boost sign-ups and enhance partner brand recognition by offering an engaging digital experience that captivates fans.

(Target Audience)

The target audience consists of females and males aged around 20 to 60, who are present in the arena during the intermission of Raptors games and are eager to participate in prize-winning opportunities.

For the game play, the arena is divided into two groups: the Upper Bowl represented by "DJ High Fly presented by Mixtape North" and the Lower Bowl represented by "DJ Get Low presented by HIPHOP Nation." Each team is equipped with distinct colour controllers symbolizing their teams. During gameplay, teams aim for the highest tap timing accuracy, attracting the crowd to their DJ's respective side of the court. The first DJ to capture all the fans' attention or have the most fans on their side of the court after 60 seconds wins the game.

The target audience consists of females and males aged around 20 to 60, who are present in the arena during the intermission of Raptors games and are eager to participate in prize-winning opportunities.

For the game play, the arena is divided into two groups: the Upper Bowl represented by "DJ High Fly presented by Mixtape North" and the Lower Bowl represented by "DJ Get Low presented by HIPHOP Nation." Each team is equipped with distinct colour controllers symbolizing their teams. During gameplay, teams aim for the highest tap timing accuracy, attracting the crowd to their DJ's respective side of the court. The first DJ to capture all the fans' attention or have the most fans on their side of the court after 60 seconds wins the game.

(Sketches)

The first step of this project was to share the game idea with the client, SiriusXM. Recognizing that this was our inaugural attempt to create a projection mapping game for live game intermissions, we carefully considered the optimal representation of both SiriusXM's and the Raptors' branding.

After deciding on the theme of the game and brainstorming gameplay mechanics, we presented a rough sketch outlining the plan for the DJ Battle game. In the presentation, we showcased how animations and logos would be strategically placed on the court to help the audience visualize the concepts more clearly.

Once we obtained approval from SiriusXM, we began designing the visual identities, characters, and creative components, integrating elements from the Raptors' 2024 toolkit. Using Cinema4D, I animated 3D models of the characters and constructed assets for the DJ booth.

The first step of this project was to share the game idea with the client, SiriusXM. Recognizing that this was our inaugural attempt to create a projection mapping game for live game intermissions, we carefully considered the optimal representation of both SiriusXM's and the Raptors' branding.


After deciding on the theme of the game and brainstorming gameplay mechanics, we presented a rough sketch outlining the plan for the DJ Battle game. In the presentation, we showcased how animations and logos would be strategically placed on the court to help the audience visualize the concepts more clearly.


Once we obtained approval from SiriusXM, we began designing the visual identities, characters, and creative components, integrating elements from the Raptors' 2024 toolkit. Using Cinema4D, I animated 3D models of the characters and constructed assets for the DJ booth.

(Key Challenges)

(Projection Mapping)

The projection mapping was crafted to visually depict the progress of the game and convey essential information about prizes and gameplay instructions to participants. Throughout the game, two DJs are animated, dancing on each side of the court, creating an engaging atmosphere. Fans emerge from portals to join the crowd and dance together. The team with higher accuracy attracts more fans to gather in front of their DJ.

Sign up challenge

In response to feedback that some users were unable to scan the QR code within the 30-40 second window, we are planning for the next iteration to address this issue. One consideration is to display the QR code on the jumbotron screen for the entire duration of the game. This approach ensures that users have ample time to scan the code without missing the opportunity.

In-game screen challenge

We've chosen to develop a rhythm game to complement the DJ battle theme, emphasizing simplicity for easy understanding among fans. In this mobile game iteration, a bar rotates around a circle, prompting players to tap the center when it aligns with the top section. Teams compete for the highest tap timing accuracy, with real-time accuracy reflecting on the projection mapping displayed on the court. This interactive element enhances engagement and brings the excitement of the game directly to the arena.

Game play challenge

We encountered a challenge where players were primarily focused on accurately tapping the screen, leading to a lack of attention towards the projection mapping and jumbotron. To address this in future iterations, our objective is to simplify the game mechanics further, eliminating the need for players to constantly look at their phones. This adjustment aims to enhance the overall game experience by ensuring that players remain engaged with both the gameplay and the immersive elements displayed on the court.

(Research Conducted)

We conducted internal research to test the gameplay and mechanics of the game. Our focus was on keeping the game flow simple, ensuring that users can grasp how to play within seconds without any guidance.

We conducted internal research to test the gameplay and mechanics of the game. Our focus was on keeping the game flow simple, ensuring that users can grasp how to play within seconds without any guidance.

(Mobile Design)

(Key Challenges)

Our primary challenge revolved around crafting a mobile UX design that prioritized simplicity and ease of understanding. While the gameplay itself is straightforward on mobile devices, our aim was to ensure that users remained engaged with the projection and jumbotron displays while playing. Managing three screens simultaneously and encouraging effective gameplay was our most significant hurdle.

We encountered a challenge where players were primarily focused on accurately tapping the screen, leading to a lack of attention towards the projection mapping and jumbotron. To address this in future iterations, our objective is to simplify the game mechanics further, eliminating the need for players to constantly look at their phones. This adjustment aims to enhance the overall game experience by ensuring that players remain engaged with both the gameplay and the immersive elements displayed on the court.

We encountered a challenge where players were primarily focused on accurately tapping the screen, leading to a lack of attention towards the projection mapping and jumbotron. To address this in future iterations, our objective is to simplify the game mechanics further, eliminating the need for players to constantly look at their phones. This adjustment aims to enhance the overall game experience by ensuring that players remain engaged with both the gameplay and the immersive elements displayed on the court.

In response to feedback that some users were unable to scan the QR code within the 30-40 second window, we are planning for the next iteration to address this issue. One consideration is to display the QR code on the jumbotron screen for the entire duration of the game. This approach ensures that users have ample time to scan the code without missing the opportunity.

Sign Up Challenge
In-Game Screen Challenge
Game Play Challenge

(Jumbotron Design)

The jumbotron screens play a crucial role in showcasing prizes, QR codes, and game statistics. Positioned 360 degrees around the arena, these screens capture the attention of nearly everyone in the arena. My aim was to ensure clear communication of the ongoing game events and to represent the characters distinctly, so that I was able to enhance the overall experience for all viewers.

The jumbotron screens play a crucial role in showcasing prizes, QR codes, and game statistics. Positioned 360 degrees around the arena, these screens capture the attention of nearly everyone in the arena. My aim was to ensure clear communication of the ongoing game events and to represent the characters distinctly, so that I was able to enhance the overall experience for all viewers.

(Projection Mapping)

(Mobile Design)

The projection mapping was crafted to visually depict the progress of the game and convey essential information about prizes and gameplay instructions to participants. Throughout the game, two DJs are animated, dancing on each side of the court, creating an engaging atmosphere. Fans emerge from portals to join the crowd and dance together. The team with higher accuracy attracts more fans to gather in front of their DJ.

Our primary challenge revolved around crafting a mobile UX design that prioritized simplicity and ease of understanding. While the gameplay itself is straightforward on mobile devices, our aim was to ensure that users remained engaged with the projection and jumbotron displays while playing. Managing three screens simultaneously and encouraging effective gameplay was our most significant hurdle.

(Results)

2000 + sign ups under 2.5 minutes

Despite the challenges mentioned earlier, we successfully garnered approximately 2000 sign-ups through the mobile application across three game nights. This achievement underscores the effectiveness of our efforts. However, it also provided valuable insights into areas that can be enhanced for future iterations. This feedback will be instrumental in refining the experience and maximizing engagement moving forward.

Despite the challenges mentioned earlier, we successfully garnered approximately 2000 sign-ups through the mobile application across three game nights. This achievement underscores the effectiveness of our efforts. However, it also provided valuable insights into areas that can be enhanced for future iterations. This feedback will be instrumental in refining the experience and maximizing engagement moving forward.

(Key Takeaways)

Not to overcomplicate the gameplay

Taking a strategic approach to gameplay design involves carefully considering what information should be presented on each screen. Understanding how users interact with each screen allows us to adopt a more human-centric perspective and cater to the users' needs effectively. This thoughtful approach enhances the overall user experience and maximizes engagement.

Taking a strategic approach to gameplay design involves carefully considering what information should be presented on each screen. Understanding how users interact with each screen allows us to adopt a more human-centric perspective and cater to the users' needs effectively. This thoughtful approach enhances the overall user experience and maximizes engagement.

Cross-functional members should be involved from the start of the project

This approach ensures that the project progresses holistically, effectively addressing both strategy and technical feasibility from the outset. By considering these aspects early on, we can better align our goals, optimize resources, and mitigate potential challenges as the project evolves.

This approach ensures that the project progresses holistically, effectively addressing both strategy and technical feasibility from the outset. By considering these aspects early on, we can better align our goals, optimize resources, and mitigate potential challenges as the project evolves.

Next Work

Next Work

DJ Duel

In-Arena Showdown
— Arcade XR Immersive Gaming Experience for Toronto Raptors

Read More

(My Role)

I owned and led design of DJ Duel for the Toronto Raptors, sponsored by Sirius XM. My responsibilities encompassed establishing game flow, crafting user journeys, and designing mobile UX/UI, projection mapping, jumbotron animations, and core visual identities, playing a pivotal role in the project's realization.

View Project

CLIENT

Toronto Raptors, SiriusXM

YEAR

2024

ROLE

Design Lead

TEAM

MLSE Arcade,
MLSE Digital Labs Developers

Duration

2 months

(Goal of the Project)

DJ Duel, presented by Sirius XM, transforms fan engagement at live Raptors Games with an immersive gaming experience. It utilizes state-of-the-art projection systems to bring games directly onto the court. DJ Duel is a multiplayer game designed for brief 2-3 minute sessions during intermissions, encouraging fans to compete and fostering camaraderie and friendly rivalry in the arena. The project aims to boost sign-ups and enhance partner brand recognition by offering an engaging digital experience that captivates fans.

Boost sign-ups and enhance brand Recognition

[Target Audience]

The target audience consists of females and males aged around 20 to 60, who are present in the arena during the intermission of Raptors games and are eager to participate in prize-winning opportunities.

For the game play, the arena is divided into two groups: the Upper Bowl represented by "DJ High Fly presented by Mixtape North" and the Lower Bowl represented by "DJ Get Low presented by HIPHOP Nation." Each team is equipped with distinct colour controllers symbolizing their teams. During gameplay, teams aim for the highest tap timing accuracy, attracting the crowd to their DJ's respective side of the court. The first DJ to capture all the fans' attention or have the most fans on their side of the court after 60 seconds wins the game.

[Sketches]

The first step of this project was to share the game idea with the client, SiriusXM. Recognizing that this was our inaugural attempt to create a projection mapping game for live game intermissions, we carefully considered the optimal representation of both SiriusXM's and the Raptors' branding.


After deciding on the theme of the game and brainstorming gameplay mechanics, we presented a rough sketch outlining the plan for the DJ Battle game. In the presentation, we showcased how animations and logos would be strategically placed on the court to help the audience visualize the concepts more clearly.


Once we obtained approval from SiriusXM, we began designing the visual identities, characters, and creative components, integrating elements from the Raptors' 2024 toolkit. Using Cinema4D, I animated 3D models of the characters and constructed assets for the DJ booth.

(Key Challenges)

Sign up challenge
Game play challenge
In game challenge

In response to feedback that some users were unable to scan the QR code within the 30-40 second window, we are planning for the next iteration to address this issue. One consideration is to display the QR code on the jumbotron screen for the entire duration of the game. This approach ensures that users have ample time to scan the code without missing the opportunity.

We encountered a challenge where players were primarily focused on accurately tapping the screen, leading to a lack of attention towards the projection mapping and jumbotron. To address this in future iterations, our objective is to simplify the game mechanics further, eliminating the need for players to constantly look at their phones. This adjustment aims to enhance the overall game experience by ensuring that players remain engaged with both the gameplay and the immersive elements displayed on the court.

We encountered a challenge where players were primarily focused on accurately tapping the screen, leading to a lack of attention towards the projection mapping and jumbotron. To address this in future iterations, our objective is to simplify the game mechanics further, eliminating the need for players to constantly look at their phones. This adjustment aims to enhance the overall game experience by ensuring that players remain engaged with both the gameplay and the immersive elements displayed on the court.

(Research Conducted)

We conducted internal research to test the gameplay and mechanics of the game. Our focus was on keeping the game flow simple, ensuring that users can grasp how to play within seconds without any guidance.

(Jumbotron Design)

The jumbotron screens play a crucial role in showcasing prizes, QR codes, and game statistics. Positioned 360 degrees around the arena, these screens capture the attention of nearly everyone in the arena. My aim was to ensure clear communication of the ongoing game events and to represent the characters distinctly, so that I was able to enhance the overall experience for all viewers.

(Mobile Design)

Our primary challenge revolved around crafting a mobile UX design that prioritized simplicity and ease of understanding. While the gameplay itself is straightforward on mobile devices, our aim was to ensure that users remained engaged with the projection and jumbotron displays while playing. Managing three screens simultaneously and encouraging effective gameplay was our most significant hurdle.

(Projection Mapping)

The projection mapping was crafted to visually depict the progress of the game and convey essential information about prizes and gameplay instructions to participants. Throughout the game, two DJs are animated, dancing on each side of the court, creating an engaging atmosphere. Fans emerge from portals to join the crowd and dance together. The team with higher accuracy attracts more fans to gather in front of their DJ.

(Key Takeaways)

This approach ensures that the project progresses holistically, effectively addressing both strategy and technical feasibility from the outset. By considering these aspects early on, we can better align our goals, optimize resources, and mitigate potential challenges as the project evolves.

Taking a strategic approach to gameplay design involves carefully considering what information should be presented on each screen. Understanding how users interact with each screen allows us to adopt a more human-centric perspective and cater to the users' needs effectively. This thoughtful approach enhances the overall user experience and maximizes engagement.

Not to overcomplicate the gameplay
Cross-functional members should be involved from the start of the project

(Results)

Despite the challenges mentioned earlier, we successfully garnered approximately 2000 sign-ups through the mobile application across three game nights. This achievement underscores the effectiveness of our efforts. However, it also provided valuable insights into areas that can be enhanced for future iterations. This feedback will be instrumental in refining the experience and maximizing engagement moving forward.

2000 + sign ups under 2.5 minutes

Next Work