MockCode

Opening screen
Phase: Clarification
Phase: Feedback

Inspiration

As third-year Computer Science students planning for Summer 2026 internships, we quickly realized how unprepared and confused we were in the process of interviews. There are many LeetCode resources out there, but none with direct feedback from our future employers. We decided to leverage the power of Gemini AI and ElevenLabs speech tool to build MockCode.

What it does

MockCode is a web-app that simulates 1-on-1 technical software engineering technical interviews with a hiring manager from any company (e.g. Amazon, Meta, and Google). Our app provides instant feedback scores across problem solving, communication, confidence, and presence to help students build interview skills and land internships.

How we built it

Voice Integration (ElevenLabs TTS)

We integrated ElevenLabs text-to-speech to give the interviewer a natural voice, with server-side TTS processing to keep API keys secure. The backend sanitizes technical notation (like O(n), nums[i], 10^5) into speakable text before sending to ElevenLabs, ensuring the audio sounds natural even when discussing algorithms.

Frontend (React + TypeScript + Vite)

The UI is built with React 19 and uses the Web Speech API for real-time voice recognition. We implemented a continuous recording loop that auto-restarts after silence (browser speech recognition auto-ends) to maintain a "live interview" feel. The Monaco editor integration lets candidates write code during the Coding phase, with language selection (Python/C++/Java/JavaScript) and syntax highlighting.

"Put on the spot" behaviour: Recording auto-starts immediately after the interviewer finishes speaking, mimicking real interview pressure
Company branding: Visual logos pulse during the interviewer's speech to reinforce the "realistic company interview" experience
Feedback modal: Multi-dimensional scoring (Problem Solving, Communication, Confidence, Presence) with strengths/improvements/notes presented clearly after interview completion.

The Backend (FastAPI & Python)

We built a stateful interview engine that orchestrates realistic technical interviews through multiple phases, such as: Intro -> Clarification -> Approach -> Coding -> Edge Cases -> Follow-Up -> Feedback

Challenges we ran into

Learning how to use ElevenLabs was a big learning curve. Another tricky challenge was creating a true "interview" environment where the user is "put on the spot." We designed the MockCode with an auto-recording feature to meet this specific logic choice.

Accomplishments that we're proud of

Creating a complete tool that is directly beneficial to students in the same situation as us. It's an accomplishment to resolve an issue by leveraging our knowledge and skills. We are proud of winning the Desjardins treasure hunt challenge while simultaneously hacking this project. ($200 reward)

What we learned

Elevenlabs can be challenging to implement, but with practice, it's surprisingly efficient.
Building complex design systems with real-time input from a live voice
Designing a meaningful scoring system that is actively looking for solutions.

What's next for MockCode

Improvement of simulator realism and more company-specific interview questions/styles. Alternate version with system design interview focus over technical software interview questions.