SideQuestr

Framing the Problem

What is the problem you are trying to solve? Who does it affect?

Almost every event in the past experience of this team had more or less issues when it comes to bring certain key points of their event across. "Where are the restrooms?", "how does the local pickup of access items (badges, welcome packages, wifi credentials…) work?", "how do I reserve a spot in the big auditorium to make sure I make it to the talk I really want to see?". Usually, the facts are there and organizers give their best to compile every essential info into lists, documents and elongated FAQ sections.

Usually, that comes down to a pile of information that is hard to process at once and also hard to connect to the actual location. SideQuestr takes this challenge by taking out the formality of orientation and also feed info in a context aware manner. Giving attendees the info on a topic right when they need it and can make a phsyical connection to it. This increases the chance of essential information getting noticed, internalized and remembered. Also, being in the room where it happens while reading about it makes the "aha"-effect of a new insight bigger than reading alone ever could.

Idea Explanation

What is your idea? How does it fix the problem?

SideQuestr takes the adventurous approach and takes users on a journey through your event by giving them a set of tasks that you define. Inspired by fantasy RPGs, the tone is meant to wake the player in each user and make them discover key elements and activities of your event.

Organizers create a set of quests and quest lines that attendees pursue. Quests can be outlining venue details that need to be discovered ("…find the additional water fountain on the second floor"). Quests can hint to essential people ("…the person who hands out the badges gives you a free granola bar if you say «Bananarama» while he passes your badge to you". The granola bar is equipped with a QR-Code to scan that unlocks a follow-up quest). Quests can guide attendees to a specific booth and ask for specific knowledge (enabling interest based exploration to bring people together that pursue the same goals).

If you like to bring the attendees of your event together, you might also add a made up storyline and make attendees pursue a shared set of goals that is hard enough to require teamwork. Creating shared goals that need to be discovered makes you ask around, creating opportunity to meet like-minded people

For a lack of NFC tags or similar, the app sticks to QR-Codes as a means of interaction with the real world

Implementation

How do all the pieces fit together? Does your frontend make requests to your backend? Where does your database fit in?

As requested, KendoReact had been used to use basic components with Kendo UI and have a viable prototype with decent style without doing everything from scratch. The connection to the data is achieved via HTTP/REST API that brings the react client together with a fastify server that runs on NodeJS. Data is stored in memory. For the purposes of this demo this is enough, but it will mean that all quest progress is lost everytime the server restarts. Quest data gets primed via .yaml file. An admin UI for creating and updating quests had been considered, but deemed out of scope to prioritize the main app. User data and quest progress gets stored in a SQLite db in a non-persistent manner.

Challenges

What did you struggle with? How did you overcome it?

• Multiple nodejs versions around dev machines -> use nix shell to syncronize and pin node version to 24

• Finding a good way to mark quests as in progress. When a quest has a single task, it would be automatically completed once that first task is completed. When beginning a quest by starting one of its tasks, then it's completed right away. Solution: prepare UI that no intermediate state is necessary for a quest to be complete.

• How would organizers get a hold of the QR-codes? -> Created a generator and print-to-code section for quest tasks

• Admin CRUD Ui to create and maintain the actual quests was too ambitious to also tackle -> quest data gets initialized via yaml file

Accomplishments

What did you learn? What did you accomplish?

• Onboard with KendoReact

• Typebox that helps you design the desired REST API

Next Steps

What are the next steps for your project? How can you improve it?

• Admin backend to have more high-level option to edit and update quest data per event

• Add geolocation and map to discover things that need to be found across a bigger area

• What if the hidden items are hidden too well? -> Add hint system with popovers to each task that gives additional help and clarify what's to do (requiring a re-iteration of the mockup)

• Add more incentives to use the app

  • XP / Level-up system RPG style

  • Badges for your avatar

  • Leaderboard

  • Stats

  • Skilltree

  • Summary of pursued goals