Inspiration

I've always been a big fan of "dle" games like Wordle, geography guessing games, and trivia games.

What it does

Trivattle is a multiplayer trivia-based trading card game powered by Wikipedia. Players open packs, collect cards of different rarities, trade with friends, and compete in real-time 5v5 battles.

Every card represents a Wikipedia article with unique attacks, abilities, and types. During battles, players answer trivia questions to reduce incoming damage, combining knowledge with strategy.

How we built it

I used React, Vite, and TypeScript for the frontend, alongside a backend for accounts, inventories, and multiplayer battles.

I built a pipeline using Wikimedia APIs and AI to transform Wikipedia articles into cards, generate thematic attacks, and create article-specific trivia questions. Everything is generated ahead of time and cached for fast gameplay. I used DeepSeek to generate trivia questions, and jev to classify cards and attacks into types.

Challenges we ran into

One of the biggest challenges was the speed of generating Wikipedia cards. Each card required fetching article data, generating attacks and abilities, and creating and validating trivia questions using AI. Processing cards sequentially was too slow, so I implemented concurrency to generate multiple cards simultaneously, significantly speeding up the process.

Accomplishments that we're proud of

I'm mostly happy that it actually works well. I showed it to a few friends and they enjoyed playing it which made me proud.

What we learned

I learned a lot about using AI to generate structured game content, working with Wikimedia APIs, building real-time multiplayer systems, and balancing gameplay. I also learned the importance of generating and validating AI content beforehand to keep gameplay responsive.

What's next for Trivattle

I want to add an auction House, allowing players to bid on collectible cards using in-game currency.

Built With

Share this project:

Updates

Submission history