Trailblazer

Trailblazer: Splatoon meets Strava. Run through Boston, paint territory in your school colors. BU vs MIT vs NEU vs... claim the city, one stride at a time. Fitness meets live multiplayer conquest!

Comment 1

Inspiration

The retro Internet theme inspired us to look at games from our childhood, and we remembered the era of .io games. We loved the ideas of internet games/experiences like slither.io, paper.io and r/place. Some members of the team are avid runners (and the rest are looking to get into running!) so making the link between this beloved era of internet games and physical activity/movement came naturally.

What it does

Users make an account and log in using their .edu email in order to match the user with their University team. We connect to the user's Strava API to get their run data. Each time they track their run activity with Strava, we collect it and draw it on the map. The objective for players is to cover as much of Boston's territory as possible. Players can conquer over unexplored territory and territory claimed by other players, and see their efforts reflected on the player leaderboard. Every two weeks, the server resets, and the teams are ranked by the percentage of the map they covered. At the end of the semester, the University with the most biweekly wins is crowned the winner of the Trailblazer semester.

How we built it

The Strava API gives us all the run information, which is then processed by the EC2 AWS backend server. For every run of each user, we take the run's stream information (GPS coordinates, velocities, time, among other values) and quantize its latitude and longitude to fit in our map grid. The run is painted onto the map with the user's corresponding University colors, conquering either unconquered land or other teams' land. All communication from the backend to the frontend is done through internal API calls.

Challenges we ran into

  • Coming up with the dimensions of the map, grid pixel density, and resolution. This was paramount to get right because the entire functionality of the project relies on accurate map readings.
  • As always with any project built on dividing and conquering with a team, stitching each individual part together was quite difficult (but very rewarding as we saw each feature boot up!)

Accomplishments that we're proud of (as a team)

  • Creating a fully-functional multiplayer experience that we would love to use (seriously, the non-runners of the group have said multiple times that this is the app they were waiting for that could inspire them to start running)
  • Setting up a very clean and easy to work on database model and API.

Individual accomplishments that we're proud of

Felix: Building the back-end processing for the SVG file that we overlay on the React Leaflet. Letitia: Integrating the code my teammates made with the internal API. Temi: Engineering the database schema and populating it with real data. Evan: Giving my teammates a good front-end foundation to work with, and making sure everything is connected.

What we learned

  • We had learned in previous hackathons that planning the idea and tech stack integrations is the most important part of the entire project. We truly saw the value of good planning in this hackathon, because working on each part of the project felt effortless after all of the initial foundation we set.
  • We learned how to set up an EC2 server, Supabase database, and work with API authentication.
  • And we learned how important taking breaks is in events like these. We used each break as an opportunity to run around the area surrounding the GSU in order to get more data into our Strava accounts.

Possible Monetization

  • Companies can sponsor biweekly/semesterly tournaments and give coupons to the winning university and top players.
  • Companies can add a 'hot-spot' where a certain area is worth more points or powers up your path size (this would boost people in the area, leading to more customers!).

What's next for Trailblazer

  • We are seriously excited about continuing to work on Trailblazer. We feel this could become the next hit social media trend. With a city that runs as much as Boston does, we believe Trailblazer could get some serious traction and would motivate people to run harder and faster.
  • Next steps include getting on a premium plan for Supabase, and building out our already solid infrastructure so that we can manage more users, all being tracked live.
  • We are also considering moving past the Strava API, and building our own GPS service so that we can collect better data to make the games more fun.
  • A natural next step with this would also be to develop a mobile app with Swift or React Native.
  • Finally, allow users to create their own private parties and games for endless fun and cardio with friends!
Share this project:

Updates