Backlog Quest: Building my own game completion tracker.

After a summer break, I'm back writing about a side project I've been building. Backlog Quest is a React Native and Supabase app for tracking my ever-growing game backlog, with a bit of gamification thrown in along the way.

Sep 22, 20266 min read
Backlog Quest: Building my own game completion tracker

After taking a bit of a summer break, I'm back to write about a project I've been working on quietly on the side.

The idea came to me after writing about my never-ending game backlog at Christmas last year. I'd been recording everything I play in a Google Spreadsheet, and at some point it occurred to me that tracking my games that way felt a bit old fashioned when I could build my own mobile app to do it properly instead.

The Concept

The idea itself is simple. You add games to your backlog using the IGDB API, Twitch's video game database, and set a start date for when you begin a game. It's the same API I already use to pull cover art for the Now Playing feature on my homepage, so it was a natural fit to build around here too. From there a timer runs until you mark it complete, with daily push notifications nudging you along the way so a game doesn't quietly get forgotten about halfway through.

Once you finish a game you mark it complete and take a screenshot as proof, then share that win with friends. There's a genuine social side to this too, seeing what your friends are playing and completing, and being able to celebrate finishing something together, rather than it just being a private log only you ever look at. Looking back over a full year of what you've actually played and finished is part of the appeal as well.

To add a bit of fun to it, I've built in a rewards system. The more games you complete in a given year, the more your rank climbs, working through titles like Coin Collector up to Legendary Hero. It also tracks stats across everything you've played, what genres you gravitate towards, which platforms you use most, that kind of thing. It's the sort of detail that turns a simple tracker into something you actually want to open and look at.

The whole idea came from wanting to do this in a genuinely fun way that felt different to what's already out there, rather than just another spreadsheet or a bare bones tracking app.

Why React Native, Again

I decided to build this using React Native. It had been a while since I last properly looked at it, and I wanted to see what had changed, particularly with Expo. I'd given Expo a go a couple of years back building an e-commerce proof of concept for an employer at the time, and I wanted to know if it had genuinely improved since then.

It has, and it's changed for the better. Building with Expo this time round felt noticeably more intuitive and straightforward than I remembered. I was also able to take advantage of some genuinely useful native features with very little friction, barcode scanning being the standout, which lets you scan a game's barcode to add it to your backlog rather than searching for it manually every time.

Why Supabase for the Backend

For the backend I went with Supabase Postgres. I don't do a huge amount of backend work day to day, so this was as much about learning as it was about building. I wanted to properly understand what Postgres could offer as a modern relational database, and Supabase gave me a good way into that.

Beyond the database itself, it meant I could take advantage of built in security features like user sign ups without having to build that from scratch, along with their APIs, bucket storage for things like game cover art, and cloud functions for anything that needed to run server side. It's been a genuinely good way to get hands on with a relational database and proper backend tooling without needing to stand up and maintain my own server.

Where It's At

Right now Backlog Quest is about halfway built, but the core of it is already up and running. The main dashboard shows a quick overview of games beaten, what I'm currently playing, and an overall completion percentage, alongside my current rank, Coin Collector, with a progress bar showing how many quests until the next tier. Below that sits a log of recently completed games with cover art, platform, and completion date, and a currently playing section for whatever I'm working through at the time.

Backlog Quest dashboard showing rank progress and recently completed games
Backlog Quest dashboard showing rank progress and recently completed games

It's a solid foundation to build on, but there's still a fair amount of work ahead to get it feeling the way I want it to.

Design, Polish and a Super Nintendo Throwback

The UI is fairly basic at the moment, and there's a lot still to fill in, both in terms of content and overall design. I want a lot more animation throughout, and I'm working on getting button sizing right, one of the more annoying quirks I've found with React Native is that everything can end up feeling and looking a bit small by default. That might just be how I've approached my own CSS, but it's something I'm actively working through.

The design direction I'm going for is a proper Super Nintendo throwback, with little nods and easter eggs to famous games from the 90s scattered throughout. Alongside that I'm working through various bugs and making sure the overall UX flows properly, so the user always has the information they actually want in front of them at the right moment.

One feature I've already added that I'm pleased with is notes. You can attach a note to any game in your backlog, so if something happens during a playthrough that feels worth remembering, a boss fight, a plot twist, whatever it is, you can jot it down against that game rather than losing the thought.

What's Next

Looking further ahead, there's one feature I'm genuinely excited about. I'd like to add the ability to scan a screenshot of a game and have AI work out what it actually is, then suggest adding it straight to your backlog. The same idea could extend to a future backlog too, games that haven't been released yet that you'd like to pre-order, with links through to the relevant online stores. There's an obvious affiliate angle there as well, which doesn't hurt.

That's further down the line though. For now the focus is finishing the core experience properly.

The Finish Line

I'm hoping to have Backlog Quest wrapped up by the end of this year. It's a project I want to look back on and genuinely be happy with, both in terms of what I've learned along the way and as a reflection of having a strong background in mobile app development. I'll follow this post up as it progresses, and I'm looking forward to sharing more of the build, particularly the barcode scanning implementation and how the Supabase side has held up as the app has grown.