InterviewMate — Voice-First AI Mock Interview Platform

Overview

InterviewMate is an AI-powered mock interview platform that lets users practice realistic interviews through live voice conversations, then receive structured feedback and performance analysis after the session ends.

The platform is designed to solve a simple but important problem: most interview prep tools are static, generic, and disconnected from how real interviews actually feel. InterviewMate makes the experience more realistic by combining a voice-based AI interviewer, dynamic interview setup, transcript capture, and asynchronous analysis. The codebase uses a MERN architecture with custom JWT authentication, Vapi for live voice interactions, OpenRouter for LLM routing, Google Gemini for evaluation, and React 19 + Vite on the frontend.

Problem

Interview preparation usually fails in one of three ways:

• It is too shallow and only gives question lists.
• It is too expensive to practice consistently with a human coach.
• It gives vague feedback instead of clear, actionable improvement points.

That creates a bad outcome: candidates go into interviews underprepared, anxious, and blind to their weak spots.

Solution

InterviewMate solves this by giving users:

• a real-time voice interview experience
• interview setup based on role, level, type, and context
• live transcript capture
• asynchronous AI evaluation after the interview ends
• per-question feedback and overall scoring
• interview history and progress tracking

The important architecture decision is that the interview session and the analysis pipeline are separated. The interview stays responsive, while the AI analysis runs after the session is complete. That avoids blocking the user while the AI is thinking.

Screenshots

Landing Page & Voice Sandbox

Performance Evaluation Dashboard

Setup Room & Active Session Workspace

Why This Project Matters

This project is strong for portfolio and hiring purposes because it shows more than just CRUD or UI work.

It demonstrates:

• full-stack architecture
• real-time user flows
• authentication and protected routes
• asynchronous processing
• long-running AI jobs
• transcript handling
• reliability and recovery thinking
• analytics-driven product design

That combination is especially relevant for YC-backed companies, remote startups, and AI product teams.

Features

Real-Time Voice Interview

Users can speak to an AI interviewer in a live interview session powered by Vapi.

Dynamic Interview Setup

Users select:

• role
• experience level
• interview type
• interviewer persona
• resume or job description context

Transcript Capture

The full conversation is streamed, normalized, and saved for later analysis.

Async AI Evaluation

After the interview ends, the transcript is sent to OpenRouter and evaluated by Gemini models.

Multi-Model Fallback

If one model fails or rate-limits, the system falls back to the next one.

Secure Authentication

The app uses custom JWT auth with protected routes and session restoration.

Interview History

Users can revisit past interviews, view reports, and track progress.

Performance Analytics

The dashboard shows trends and feedback across multiple sessions.

Tech Stack

Frontend

• React 19
• Vite
• Tailwind CSS
• Recharts

Backend

• Node.js
• Express.js
• Mongoose
• MongoDB

AI / Voice

• Vapi
• OpenRouter
• Google Gemini

Authentication

• Custom JWT
• HTTP-only session handling on protected routes

Tooling

• Docker
• Async utilities
• Custom error handling
• API route organization

This matches the actual codebase, which uses React + Vite on the frontend, Express + Mongoose on the backend, custom JWT auth, Vapi for voice sessions, and OpenRouter → Gemini for analysis.

Interview Processing Flow

Interview execution flow from session creation through voice interaction, transcript persistence, asynchronous AI evaluation, and final report generation.

Core Engineering Decisions

1. Voice Interview Is Separate From Analysis

The live interview must stay responsive. AI evaluation is expensive and slow, so it runs after the interview ends.

2. Transcript Is the Source of Truth

The transcript is stored and reused for report generation. That makes the analysis step deterministic and recoverable.

3. Multi-Model Fallback Improves Reliability

If one Gemini endpoint fails or rate-limits, the system can move to the next model instead of breaking the workflow.

4. Custom JWT Keeps Auth Simple and Controlled

The codebase uses custom JWT-based auth rather than a hosted auth provider, which gives you full control over route protection and session restoration.

5. Frontend and Backend Are Cleanly Separated

The project keeps the React frontend and Express backend as independent applications in the same codebase. That is a sensible structure for a solo-built product.

Product Flow

1. User signs up or logs in.
2. User configures an interview.
3. User starts a live voice interview.
4. Vapi runs the conversation.
5. Transcript is captured and saved.
6. Backend sends transcript to OpenRouter.
7. Gemini generates structured feedback.
8. Report is saved in MongoDB.
9. User reviews the result in the dashboard.
10. User checks interview history and progress.

Project Structure

interviewmate/
├── backend/
│   ├── config/
│   ├── controllers/
│   ├── middleware/
│   ├── models/
│   ├── routes/
│   ├── services/
│   └── utils/
├── frontend/
│   ├── src/
│   │   ├── components/
│   │   ├── context/
│   │   ├── constants/
│   │   ├── layout/
│   │   └── pages/
│   └── public/
├── .env.example
└── README.md

This matches the actual codebase layout, which includes backend route/controller/service layers and a Vite-based React frontend with pages for sign-in, interview setup, live sessions, results, and history.

Main Pages

Public Pages

• Home
• Sign In
• Sign Up

Authenticated Pages

• Dashboard Overview
• Create Interview
• Interview Session
• Interview Result
• Past Interviews

Why this structure is good

It gives the user a clear journey:

• enter
• configure
• interview
• analyze
• improve

That is the product loop.

Environment Variables

Backend

NODE_ENV=development
PORT=5000
MONGODB_URI=your_mongodb_connection_string
JWT_SECRET=your_secure_jwt_secret
JWT_EXPIRES_IN=7d
VAPI_PUBLIC_KEY=your_vapi_public_key
OPENROUTER_API_KEY=your_openrouter_api_key

Frontend

VITE_BACKEND_URL=http://localhost:5000
VITE_VAPI_PUBLIC_KEY=your_vapi_public_key

How to Run Locally

1. Clone the repository

git clone https://github.com/sultanxdev/interviewmate.git
cd interviewmate

2. Install dependencies

cd backend && npm install
cd ../frontend && npm install

3. Create environment files

Create .env files in both backend and frontend using the values above.

4. Start the backend

cd backend
npm run dev

5. Start the frontend

cd frontend
npm run dev

6. Open the app

http://localhost:5173

Challenges

• Building live voice interview sessions
• Capturing partial and final transcript updates
• Preventing blocked UI during AI analysis
• Handling rate limits and fallback logic
• Designing a clean interview session lifecycle
• Showing actionable report data instead of generic text
• Keeping authentication and route protection stable

Learnings

• Voice AI systems need strong state management.
• Long-running AI jobs should be decoupled from the user interaction path.
• Transcript structure matters more than raw audio.
• AI output is only useful when it is parsed into structured feedback.
• Product design matters as much as model quality.
• Good architecture makes the app easier to extend later.

Future Roadmap

Voice Infrastructure

• Deepgram STT integration
• ElevenLabs TTS integration
• Real-time interruption handling

AI Evaluation

• Resume-aware interviews
• Company-specific interview tracks
• Adaptive follow-up questioning

Analytics

• Historical score tracking
• Skill trend analysis
• Personalized improvement plans

Platform

• PDF report exports
• Team dashboards
• Subscription management