Riddles net

AI generated riddles, than you try to guess, and ai checks it, ai model that used is gemini

Comment

About RiddlesNet

Inspiration

I wanted to create a fun, interactive way for users to challenge their minds with AI-generated riddles—combined with gamification like leaderboards and accounts—using modern web tech and the power of the Google Gemini API.

What it does

RiddlesNet generates smart, AI-powered riddles in English. Users try to guess the answers, get instant feedback, and reveal correct solutions. They can log in (via Google or username), track their score, view their ranking on the global leaderboard, and access their account info. The design is clean, mobile-friendly, and dark-themed.

How we built it

  • Frontend: React with SCSS modules for component styling
  • Authentication: Firebase (email/password and Google login)
  • Database: Firebase Realtime Database (user accounts, scores, leaderboard)
  • AI Integration: Google Gemini API (for real-time riddle generation)
  • Routing & Navigation: React Router, custom NavMenu styled for mobile/desktop
  • Tooling: Vite (for dev speed), npm, Firebase CLI

Challenges we ran into

  • Handling API security and CORS with Gemini
  • Real-time Firebase structure and user syncing
  • Keeping the design unified and responsive across components
  • Navigation UX between riddle/chat, account, and leaderboard screens

Accomplishments that we're proud of

  • Live AI riddle generation + answer validation
  • Firebase-authenticated user flow with persistent scores
  • Leaderboard with live ranking and clean UI
  • Fully styled dark-mode interface with mobile-first nav menu
  • Clear file structure and modular SCSS

What we learned

  • Full-stack thinking using Firebase from auth to data
  • How to securely work with generative AI from the frontend
  • Best practices for component styling and conditional rendering
  • Responsive layout handling for mobile-first design

What's next for RiddlesNet

  • User profile customization (avatars, bios)
  • Riddle difficulty filters (easy, medium, hard)
  • Support for AI-generated riddles in different languages
  • Multiplayer mode or daily riddle challenges
  • Social features: share your riddle, challenge friends

Built With

Share this project:

Updates