InterviewRoyale

Where interviews meet the arena.

Comment

Inspiration

The tech interview process is notoriously stressful, and most people don't get enough practice with behavioral questions under pressure. We wanted to create something that makes interview prep actually fun by gamifying it. We took inspiration from battle royale games like Fortnite and PUBG—what if preparing for interviews felt more like competing in a game show than grinding through flashcards? The idea of seeing yourself as a stick figure avatar competing against others for the best interview answers seemed both hilarious and genuinely useful.

What it does

InterviewRoyale is a battle royale-style mock interview platform where you compete against bots (and potentially friends) to give the best answers to behavioral interview questions. Here's how it works:

  1. Join the Arena - Create or join a room using a room code, and you'll appear as a stick figure avatar with your actual face on it
  2. Answer Questions - Record video responses to classic behavioral questions like "Tell me about a time you failed" or "Describe a conflict with a coworker"
  3. Get Graded - Our simulated AI grading system evaluates your answers and gives you feedback
  4. Climb the Leaderboard - Compete for the top spot against other players (or bots) based on your interview performance

The app creates a low-stakes, fun environment to practice what's typically one of the most anxiety-inducing parts of job hunting.

How we built it

We built InterviewRoyale as a frontend-focused application with a modern tech stack:

  • Next.js 14 with the App Router for the core framework and routing
  • TypeScript for type safety and better development experience
  • Tailwind CSS for rapid, responsive styling
  • Zustand for lightweight state management across components
  • shadcn/ui components (built on Radix UI) for accessible, beautiful UI primitives
  • Browser APIs for video recording using MediaRecorder and Canvas for avatar manipulation

Everything runs client-side with simulated server logic in fakeServer.ts. When you create a room, bots automatically join to fill out the competition. The video recording uses your browser's native capabilities to capture and process footage locally without any backend infrastructure.

Challenges we ran into

Browser video processing - Working with MediaRecorder and Canvas APIs for local video capture and avatar overlays was more complex than expected. Making it visually appealing - Balancing a polished, professional UI with fun, game-like elements took many iterations. Getting stick figure avatars to look good while maintaining performance was tricky.

Accomplishments that we're proud of

We're particularly proud of several achievements:

  • The avatar system - Seeing your actual face on a stick figure body is unexpectedly delightful and immediately makes the experience more personal and fun
  • Smooth UX flow - Despite the complexity, we created an intuitive flow from lobby to recording to results that feels polished
  • It actually reduces interview anxiety - Several people who tested it said the gamification made them less nervous about practicing interview questions
  • No backend required - Building a convincing multiplayer experience entirely client-side was a technical achievement we're proud of
  • Clean, modern interface - The UI feels professional and contemporary thanks to shadcn/ui and thoughtful design decisions

What we learned

  • Browser APIs are powerful enough for sophisticated media processing entirely client-side
  • TypeScript's type safety pays off even in fast-paced development
  • User testing reveals assumptions that aren't intuitive

What's next for InterviewRoyale

We envision InterviewRoyale becoming the go-to platform for interview prep—the place where anxiety turns into confidence through gamification. Our next big move is bringing the experience to mobile with native iOS and Android apps, so you can practice your answers on the bus, in a coffee shop, or wherever inspiration strikes. We're also planning to add comprehensive progress tracking with analytics and personalized improvement recommendations, turning each practice session into measurable growth. Imagine seeing your communication skills level up like a video game character—that's the future we're building.

Share this project:

Updates