In-game
Gamemode Selection
Pack Selection
Hotels as cards collection
Buy that card's hotel with stay22!
Opening a pack
In-game currency

Project Story

About the project

Check-In Champions is our answer to Stay22's Peak Unhinged Big Brain Use of the Stay22 API challenge: build anything except another booking carousel. Built over the final weekend of the FIFA World Cup 2026, four strangers took hotel data where it has no business being and dressed it up like a FIFA Ultimate Team pack. Open a pack of hotels pulled live from Stay22's booking data and get five cards, each rated across six stats, then send them through a group stage and knockout bracket until one champion stands: a real, bookable property with a transparent, metric-by-metric case for why it won. It feels less like scrolling a list and more like scouting a World Cup squad.

Inspiration

FIFA video games, and the ritual of ripping open a pack to see who you got
The 2026 World Cup, and the tournament drama that comes with it
GitFut, which turns GitHub profiles into player cards
Stay22's prize track challenge: build anything except another booking carousel

What it does

Check-In Champions turns hotels into football players. You open a pack — a Trip Pack pulled from a live Stay22 search for your actual trip, or a Global Pack of random hotels worldwide — and get a 5-card squad, each with an overall rating, six skill stats (Luxury, Comfort, Location, Amenities, Value, Service), and a rarity tier. Those cards enter a tournament that mirrors World Cup group stages and knockout rounds, so discovery feels like scouting a squad and watching a competition unfold.

Two ways to pack. Trip Packs draw from a live Stay22 search for your real trip, so every card is something you could actually book; Global Packs pull random hotels worldwide for pure discovery.
Player cards from Stay22 inventory. Each hotel becomes a card with an overall rating, six skill stats, and a rarity tier, so users can size up strengths at a glance.
Group stage to knockout bracket. Cards compete in group matches and advance through knockout rounds — up to 16 teams, scaling down to 8 or 4 if the pool is smaller — creating a familiar tournament flow with upsets and underdogs.
Explainable champion, semi-random undercard. The engine's #1 recommendation is guaranteed to win the tournament, with a clear metric-by-metric explanation across six weighted factors: quality, location, group fit, flexibility, data confidence, and value. Every other matchup adds a small amount of seeded, bounded randomness on top of each hotel's real score — lopsided quality gaps stay decisive, but close matchups can upset.
Match highlights on the pitch. Matches play out like a mini broadcast: a spinning ball, a live scorebug, goal animations, and a trophy lift for the champion.
Actionable champion. In Trip mode, the winner is drawn from the same live search as your trip, so the champion is a real, bookable property with a live booking link and the data that earned it the crown.
Multiplayer match-ups. For a twist unrelated to hotel recommendations, two players duel over a best-of-three. The right to call the stat alternates each round regardless of who won the last one, so each player picks exactly one round's stat from the six available; whoever's card actually scores higher on that stat wins the round, with a coin-flip only breaking an exact tie. There's also a secret karaoke mode.

How we built it

AI-assisted, plan-first workflow. Built with Claude Code and Codex, running plan mode before every feature so all four of us stayed aligned on approach and could jump into any part of the codebase — essential on a 36-hour clock. Prototyped the core MVP loop fast with Claude Fable 5, then built out the full product from there.
Modern, managed stack. Next.js, React, TypeScript, and Tailwind on the frontend; Prisma and PostgreSQL for persistence; Supabase for storage, realtime, serverless functions, and background jobs.
Accounts and a coin economy. Auth0 handles sign-up and login; Stripe powers a coin economy so players can buy coins to open more packs.
One endpoint, one source of truth. A single Stay22 call feeds a deterministic comparator that turns raw hotel fields — distance, price, star rating, and review count — into six football-style stats, so every card and match result traces back to real, bookable data.
Layered on the spectacle. Two pack types (Trip Pack from a live trip search, Global Pack of random hotels), a group-and-knockout bracket that scales from 16 teams down to 8 or 4 depending on the pool, and match-by-match playback — pitch, momentum-driven ball, scorebug, goal animations, trophy-lift celebration. Gemini writes the questionnaire copy and commentary; ElevenLabs voices it and powers the karaoke minigame.

Challenges we ran into

Coming up with something genuinely unhinged but still meaningful took more time than coding.
Translating hotel data into football stats meant deciding what each field should represent — turning quality, location, group fit, flexibility, data confidence, and value into six skill stats that read like a scouting report instead of a spec sheet.
We split "what the player sees" from "what actually decides the match" — the card's overall rating is a cosmetic number shaped partly by rarity, while match outcomes run on the engine's real personalized score underneath. It works, but it means a lower-rated card can beat a higher-rated one and still be the correct result, which is a design tension we're still deciding how to surface to players.
For the multiplayer mode, with a toy demo scope, WebSockets seemed like overkill, but getting polling to work correctly across multiple devices was harder than expected.

Accomplishments that we're proud of

Assembled a team of four strangers and shipped a finished, playable product during the hackathon.
Met the brief by taking hotel data somewhere it has no business being and making it both surprising and useful.
Built a reproducible recommendation flow that is entertaining, transparent, and actionable.

What we learned

A small, well chosen data surface can support a rich user experience when you change the frame.
Gamification only works when it helps people decide, not when it distracts.
Tight scope and rapid iteration are essential in a short build window.

What's next for Check-In Champions

Test with real users and measure whether the gamified discovery flow improves engagement and conversions.
Tune the comparator for different event themes like football tournaments, music festivals, and conferences.
Explore other absurd frames where hotel data can surprise people, such as reality-show brackets, museum curation, or fantasy drafts.
Scale the idea into themed promotions for major events and see how far we can push the "wtf, that works" reaction.