Inspiration

As avid speedrunners, we wanted to apply our skillset into everyday life in the form of a social media platform. Monotonous tasks are something everybody has to do in their lives, and we wanted a way to make these tasks fly by.

What it does

Any% is a web app that organizes everyday tasks into various categories to help motivate people to do the things in their lives that feel slow. Users can navigate through different Zones (Kitchen, Washroom, Outdoor) to find specific Categories and Runs. The app features a functional "LiveSplit" style timer with real-time splits, global leaderboards, and a social "Following" system to compete with friends.

How we built it

We built Any% with a focus on high-performance modern aesthetic.

  • Frontend: Built using React with the BRAND NEW Vite 8 with Oxc to compile
  • Styling: We used Tailwind CSS 4 to create a custom UI featuring glassmorphism and background effects.
  • Backend: We chose Firebase for its real-time capabilities. Firebase Authentication handles secure user logins (including Google OAuth), and Cloud Firestore acts as our NoSQL database for storing user profiles, following relationships, and thousands of runs.

Challenges we ran into

One of the biggest problems we ran into was managing in a NoSQL environment. Because Firestore doesn't support "Joins," we had to denormalize our data, storing usernames directly on documents to make sure that leaderboard loading times were fast. This created another issue though, when a user changes their display name, we had to write a script to go back and update all their past run submissions across the entire database.

We also encountered a lot of bugs due to using the latest versions of these technologies, specifically a parsing error in the new Vite Oxc compiler for nested template literals, which required us to refactor our styling logic.

Accomplishments that we're proud of

We are proud of the LiveSplit Timer; it feels like a competitive tool. The integration of hardcoded splits for specific chores (like "Paste Prep" or "Scrape Plates") makes the "gameplay" of doing chores feel legitimate. Additionally, we implemented a Followers vs. Following system that allows users to create their own private leaderboards, turning a solo chore into a social competition (with friends, coworkers or family).

What we learned

We learned the intricacies of Firestore Composite Indexing, more specifically how to optimize queries that require both specific filtering (by Run ID) and specific ordering (by Total Time). We also gained a deeper understanding of mobile-first UI/UX, learning how to use h-[100dvh] and overflow-hidden to create an app that feels like a native iOS/Android application despite being a web app.

What's next for Any%

Our vision for Any% is to eventually get sponsored challenge runs monthly that can encourage people to buy a company's product, then speedrun with it. We would also like to make a fully fledged mobile application that would be available on all devices. In the future, we'd like to add language support and to combine with other databases to have a more comprehensive leaderboard.

Built With

Share this project:

Updates