Mock Me

landing page

About the Project – Mock Me? Yes Please

Inspiration

I’ve always felt nervous before interviews and wanted a realistic, low‑pressure way to practice. That inspired me to create “Mock Me? Yes Please” — a friendly AI coach that turns your resume into tailored mock interviews and helps you prepare with actionable feedback.

What it does

Analyzes your resume (image or PDF) and generates role‑specific questions
Guides you through a structured interview (behavioral + technical)
Evaluates your answers and produces a detailed performance report
Adds a Recruiter Mode to review reports and send one‑click email invites for real interviews

How we built it

Backend: Django REST Framework powering endpoints for resume upload, interview flow, analysis, and reporting
AI: Google Gemini (Vision for resume parsing; Text for evaluation and email drafting)
Frontend: React + Vite + Tailwind with clean, accessible components for the full flow
Reports: Persisted via Django models; combined behavioral + DSA summaries
Email Invites: Gmail SMTP with Gemini‑drafted messages triggered on recruiter acceptance

For score normalization and recommendations, we use a simple aggregation function. For example, an overall score can be computed as:

[\text{overall} = \min\big(10,\; 0.4\cdot s_{comm} + 0.35\cdot s_{tech} + 0.25\cdot s_{prob}\big)]

Where (s_{comm}), (s_{tech}), and (s_{prob}) are the communication, technical, and problem‑solving subscores (0–10).

Challenges we ran into

Extracting clean text from varied resume formats (images vs. PDFs)
Ensuring consistent JSON‑only AI responses and handling fallbacks gracefully
Designing prompts that balance specificity with robustness to edge cases
CORS and local dev ergonomics across two servers (React/Vite + Django)
Securely sending emails via Gmail (App Passwords) and handling deliverability

Accomplishments that we’re proud of

End‑to‑end MVP: resume upload → interview → report → recruiter decision → email invite
Clean, modern UI/UX that’s approachable for non‑technical users
Strong fallback logic when AI output is inconsistent (always returns useful feedback)
Extendable architecture to add future modes (e.g., Proctor Mode) without rewrites

What we learned

Prompt design and schema‑constrained outputs dramatically improve reliability
Small UX touches (loading states, micro‑animations, helpful errors) reduce friction
Clear separation of concerns (API services, pages, utilities) speeds iteration
The importance of environment‑driven configuration for local/prod parity

What’s next for “Mock Me? Yes Please”

Proctor Mode with AI recognition (face/voice/engagement signals) and live alerts
Richer question banks, role packs, and adaptive difficulty
Multi‑turn design interviews with structured follow‑ups
Exportable/shareable reports and recruiter collaboration tools
Fine‑tuned models for domain‑specific interviews (e.g., data, security, mobile)

Quick Start

Backend

cd backend
python -m venv venv
source venv/bin/activate
pip install -r requirements.txt
python manage.py migrate
python manage.py populate_demos
python manage.py runserver  # http://localhost:8000

Frontend

cd frontend
npm install
npm run dev  # http://localhost:5173

Tech Stack (Summary)

Backend: Django 5 + Django REST Framework, CORS Headers
AI: Google Gemini (Vision + Text), PyPDF2, pdf2image
TTS: ElevenLabs HTTP API
DB: SQLite (dev) or PostgreSQL via dj-database-url (prod)
Frontend: React 19, Vite, Tailwind CSS

Key Backend API Endpoints

Base URL: http://localhost:8000/api/

Demos: GET /demos/
Interview Flow:
- POST /upload-resume/
- POST /submit-answer-and-get-next/
- POST /get-final-feedback/
DSA (optional):
- POST /get-dsa-question/
- POST /submit-pseudocode/
- POST /continue-pseudocode/
- POST /get-combined-report/
Text-to-Speech: POST /text-to-speech/
Reports (Recruiter):
- GET /reports/, GET /reports/{id}/, POST /reports/create/
- GET /reports/statistics/, DELETE /reports/{id}/delete/
- PATCH /reports/{id}/decision/

Frontend Details (Summary)

Pages: LandingPage, ResumeUpload, InterviewPage, ReportPage, RecruiterDashboard, loginpage
Typical routes: /, /upload, /interview, /report/:id?, /recruiter
API base URL: set VITE_API_BASE_URL or default http://localhost:8000
Build: npm run build → outputs to frontend/dist/

Recruiter Mode (Overview)

Recruiters can browse candidate reports, view details, and Accept/Decline. On Accept, the system drafts and sends an interview invite email with a meeting link.

UI: RecruiterDashboard.jsx
Invite service: backend/api/email_service.py (Gemini‑drafted email, Gmail SMTP)
Env vars: SENDER_EMAIL, SENDER_PASS, RECRUITER_NAME, MEETING_LINK

Example decision payload:

{ "decision": "Accepted" }

Environment Variables (Brief)

GEMINI_API_KEY, SECRET_KEY, DJANGO_ENV, DATABASE_URL
ELEVEN_LABS_API_KEY, ELEVEN_LABS_VOICE_ID
Recruiter email: SENDER_EMAIL, SENDER_PASS, RECRUITER_NAME, MEETING_LINK