Diva Detective is an interactive vault experience where players must follow a series of steps to unlock a vault and steal a diamond without triggering a bomb. The game combines physical components controlled by microcontrollers with a digital interface built using JavaScript, creating an engaging and immersive gameplay experience. It ends in an intense bomb defusion with explosive results.
Game DesignJavaScriptArduinoPhysical FabricationTeam Project
Featured At
UT SDCT Inside Out Showcase — Spring 2024
Project Video
Overview
Technical Implementation
The project was built in p5.js for the digital interface, while the physical components were controlled using Arduino microcontrollers. Serial communication was established between the p5.js application and the Arduino boards to facilitate real-time interaction between the digital and physical elements of the game.
Key systems
- Frame-by-frame animation: Animations were implemented by a custom system that matches animation frames to pre-recorded voice lines in the game. Dialogue branches depending on what actions you take.
- Serial communication: Two Arduinos using many sensors for input and output were connected to p5.js through serial communication, which was read by JavaScript code that detected each physical input and sent data to physical outputs.
- Fabrication: A cardboard vault was constructed with a latched door, a fake diamond used as a copper switch, a “bomb” with a timer on the back, and buttons on top. All wires were hidden inside the build, with only a USB cord to plug into the computer exposed.
Technical challenges
One of the main challenges was ensuring reliable serial communication between the p5.js application and the Arduino microcontrollers. I had to carefully manage the data being sent and received to prevent any lag or miscommunication that could disrupt the gameplay experience.
Another challenge was designing the physical components to be both functional and engaging. We had to consider the placement of sensors and outputs to ensure that players could easily interact with the game while maintaining the immersive experience.
Code architecture
The code architecture is modular, with separate components for handling serial communication, game logic, and animation. The p5.js application manages the overall game state and user interface, while the Arduino code handles sensor input and output control. This separation of concerns allows for easier debugging and future expansions of the game.
Reflection
This project provided valuable experience in integrating physical computing with digital interfaces, as well as designing engaging gameplay experiences that combine multiple interaction modalities. I gained a deeper understanding of serial communication, microcontroller programming, and the challenges of creating immersive physical-digital experiences.