Steam Roulette

First Step (Add Steam IDs)
Second step (Playtime Filter)
Third Step (Spin the Roulette)
Fourth Step (Winner Modal)

Inspiration

This project actually began with a completely different idea. Initially, we were planning to build an intelligent alert system for a grocery store's inventory. The concept was to integrate an AI model—like Eleven AI from Eleven Labs—through an MSP (Managed Service Provider), which would then interact with our existing API: Saleshow. That API already handled inventory by branch, sales by supplier, and their respective products.

However, due to limited documentation on the AI model and tight deadlines, we pivoted. My co-founder and I started brainstorming and asked ourselves: “What have we been excited about lately?”

Personally, I love downloading new games on my Steam Deck. But at some point, you end up with so many games that it feels like you have nothing to play. That feeling is even more common when you're trying to game with friends who also have massive libraries. Often, the problem isn’t the lack of games—but not being aware of what we already own.

So I pitched the idea of a roulette-style app: something fun, dynamic, and a bit silly, where we let luck decide what to play. No more wasting time scrolling endlessly through everyone’s library—just spin and play.

What it does

SteamRoulette uses the Steam Web API to fetch the game libraries of one or multiple players and selects one game randomly through a roulette-style interface. It allows you to:

Enter your Steam username (numeric ID or Vanity URL).
Apply filters by playtime (any game, 2+, 10+, or 50+ hours).
Spin the roulette, which mimics CS:GO’s case-opening animation.
Click "Play Now", which opens the game in Steam or installs it if needed.

🔗 How to find your Steam ID 🔒 How to make your profile public

How we built it

Frontend: Built as a Single Page Application (SPA) in React, styled with Tailwind CSS, deployed on Netlify.
Backend: Hosted independently on Render, connects to Steam Web API.
Sound Design: Sound effects generated using Eleven Labs to replicate the case-opening suspense in CS:GO.
Music: Custom, copyright-free background music created using Suno.

Sometimes you'll land on a game you've already played... other times, you’ll rediscover a hidden gem you forgot you even owned.

Challenges we ran into

Local API access: Initially, it worked well locally on bolt.new, but failed on Netlify, as local instances aren't supported there. We solved this by migrating the API to Render and configuring environment variables.
Vanity URL issues: Some Steam usernames didn’t resolve properly. We provided support links and guidance to help users locate their Steam IDs and set profiles to public
Limited game lists: With fewer available games, especially among friends, the roulette appeared visually underwhelming.

Accomplishments that we're proud of

Enhanced randomization: We realized the Steam API returns game lists in alphabetical order, making the outcome predictable. So we added logic to shuffle the game list on every spin, enhancing unpredictability.
Dynamic experience: To enhance the visual experience with fewer games, we duplicated entries, making spins feel longer and more satisfying.

What we learned

Working with third-party APIs like Steam's requires thoughtful UX design, particularly when handling privacy settings and incomplete data.
Compelling UX can sometimes involve adding artificial complexity—such as duplicating entries—to enhance fun.

- Sound and music significantly elevate simple interactions, like spinning a roulette wheel.

What's next for Steam Roulette

Implement genre or tag filtering (e.g., co-op games only, horror, etc.).
Improve detection of shared games across libraries and provide smarter recommendations, like if multiple users are in the group only games everyone can play.