HopQuest

Mission control contains real-time map, leaderboard, activity log, players list, and tag management—all in a clean split-view layout.
Join HopQuest by selecting your role and entering your name. Organizers require a password to manage games and tags.
Organizers can view tag status and activate tags for the current game, with the option to save the tag’s location for tracking.
Players can track their progress, view the next tag’s clue, check their ranking on the leaderboard, and see all available tags in the game.
When a player finds a tag out of sequence, the system notifies them that earlier tags must be claimed first before continuing.
Once a player locates the correct tag in sequence, they can confirm and claim it to advance in the game.
SpacetimeDB dashboard showing live database activity, reducers for managing game logic, and tables for tracking players and tags.
logo

Inspiration

Scavenger hunts have always been a fun and engaging way to bring people together, but most digital versions lose the thrill of being physically present. At HopHacks, we wanted to bridge the physical and digital worlds by combining NFC tags, live multiplayer tracking, and real-time databases to create a game that feels immersive, competitive, and community-driven. Our goal was to build something that wasn’t just a static app, but a living experience that updates instantly as players explore the campus.

What it does

The HopQuest game is split into two phases,

Setup Phase
1. Organizers register each NFC tag and assign it a clue.
2. Once registered, a tag is activated by scanning it through the Organizer account on a phone.
  - The idea is that organizers activate the tag when they are physically at the spot where it will be placed.
3. Activating the tag stores the organizer’s current location on the NFC tag.
4. After all tags are activated, the organizers can officially launch the game, moving into the next phase.
Game Phase
1. Players follow the clues provided in the dashboard.
2. Tags must be scanned in order—if the second clue isn’t solved, the third tag cannot be activated.
3. Each successful scan updates the Admin dashboard, where organizers can track player progress and view the leaderboard.
4. The Admin dashboard also shows the location of every tag, making post-game cleanup simple.
5. Players can see the location where they discovered each tag, adding to the interactive and immersive experience.

What it has

HopQuest is a multi-user, live scavenger hunt game powered by SpacetimeDB. Players receive clues, locate NFC cards placed around the campus, tap them with their phones, and instantly claim the tag. Each claim updates in real time across all connected players and the admin dashboard.

Interactive Map: Built with Leaflet and OpenStreetMap, showing player progress and tag locations.

NFC Integration: Physical tags act as checkpoints, bringing a tangible aspect to digital gameplay.

Real-Time Backend: Using SpacetimeDB hosted on Maincloud, ensuring game state is synchronized instantly.

Admin Portal: Live dashboard to track player progress, activate/deactivate tags, and manage the leaderboard

Game Flow: The first player to scan all NFCs and solve the chain of clues wins the hunt.

Tech stack: Next.js, TypeScript, SpacetimeDB, Rust, NFC, Leaflet (maps), Vercel (frontend hosting), Maincloud (backend hosting).

How we built it

Unlike traditional apps, HopQuest required synchronizing physical interactions (NFC scans) with a live digital map while keeping multiple users’ data consistent. We had to design a system where every player’s action instantly propagated across all devices without lag. Achieving this real-time synchronization at scale is where SpacetimeDB truly shined.

Challenges we ran into

SpacetimeDB Learning Curve: None of us had used it before, so setting up schemas, handling WebAssembly builds in Rust, and integrating with Next.js was a steep but rewarding challenge.

NFC Integration: Encoding and testing NFC cards on campus came with device compatibility and scanning limitations.

Real-Time State Updates: Ensuring that every NFC scan instantly updated player progress across devices without collisions or delays required careful database design.

Hosting & Deployment: Getting SpacetimeDB deployed on Maincloud while managing the frontend on Vercel tested our debugging skills.

Accomplishments that we're proud of

Built a complete end-to-end game in 36 hours from backend database setup to frontend gameplay and admin dashboard.

Seamless real-time synchronization across multiple players using SpacetimeDB, with no noticeable lag in updates.

Physical + digital integration by connecting NFC tags on campus to live game logic, making HopQuest interactive and immersive.

Live admin portal that allows organizers to track player progress, manage tags, and monitor the leaderboard in real time.

Successful multi-platform deployment backend hosted on Maincloud and frontend hosted on Vercel for reliable accessibility.

Engaging user experience that combines exploration, problem-solving, and competition, bringing hackathon participants together in a unique way.

What we learned

How to leverage SpacetimeDB for real-time, multi-user experiences. Hands-on experience integrating hardware (NFC tags) with modern web technologies. Designing a system that can handle instant synchronization and concurrency in gameplay. The importance of building clean admin dashboards to make live game management possible.