PitchSlapped

Landing page

Inspiration

We've all watched Shark Tank and thought "I could pitch better than that." But could you really? Most people never get to practice a high-stakes pitch with real-time pushback, tough questions, and the pressure of someone grilling your financials on the spot.

We wanted to build something that gives anyone - a student with a dorm-room idea, a first-time founder, or someone prepping for a real investor meeting - the experience of pitching to a brutal, opinionated, and occasionally hilarious panel of AI judges. Not a chatbot. Not a form. A live conversation where three distinct personalities interrupt you, debate each other, and decide whether your idea is worth their (fictional) money.

What it does

PitchSlapped drops you into a virtual Shark Tank. You speak your pitch out loud, and three AI-powered judges - James (finance hawk), Vidya (product-market fit expert), and Layla (tech goddess) - listen in real time and fire back tough questions. At the end you get a detailed report card - a score breakdown across Clarity, Persuasion, Market Knowledge, Confidence, and Financials - plus written feedback and a verdict on how many investors made you an offer.

How we built it

Frontend: React + Vite with React Router for a multi-page flow (Landing → Pitch Prep → Pitch Room → Report). All styling is custom CSS — no component libraries — with hand-crafted animations for judge speaking states (radiating circles, spotlight glow, scale transitions).
Real-time voice: ElevenLabs Conversational AI over WebSocket for bidirectional audio streaming. One AI agent is prompted to role-play all three shark personas using speaker tags (<James></James>, <Vidya></Vidya>, <Layla></Layla>), which we parse on the frontend to attribute turns and activate the correct judge's visual state.
AI evaluation: Claude API (Anthropic) powers the pitch summary extraction during the session and generates the scored report card at the end using structured output.
Backend: Node.js/Express server handling auth token generation for ElevenLabs and proxying evaluation requests to Claude.
Transcript architecture: Committed transcripts accumulate in a ref-based payload throughout the session, combined with partial (in-progress) transcripts for a seamless live-text display with a CSS blinking cursor effect and auto-scroll-to-bottom behavior.

Challenges we faced

Single-agent, multi-persona illusion: ElevenLabs Conversational AI is a single agent - making it convincingly act as three distinct personalities who careful prompt engineering and a real-time parser that reads speaker tags from the streamed response to swap which judge is visually "speaking."
Live text display: Off-the-shelf typing animation libraries (TypeIt, Typed.js) are built for scripted strings, not live-streaming transcripts. We had to abandon them and build a custom solution using React state separation (committed vs. partial text), a scroll-to-bottom ref, and a pure CSS blinking cursor.
UI atmosphere: Making the pitch room feel like a high-stakes TV set required layering translucent background images, spotlight effects, radial gradients, and animated judge states - all in plain CSS without a design framework.

What we learned

WebSocket-based real-time AI is fundamentally different from REST API thinking
- there's no request/response cycle, just a continuous open pipe.
Prompt design is genuinely half the product. The difference between a mediocre and a great demo came down to how well the system prompt defined debate rules, personality voice, and offer/opt-out logic.
Vibe coding is GOAT 🐐

What's next

Distinct AI agent for each investor: a different brain and domain knowledge for each investor
Video upload: using multimodal input to let the AI understand video demos; extract frames with ffmpeg, describe via Claude Vision, inject into judge context
Persistent leaderboard with real scores stored in a database
Multiplayer mode: multiple pitchers, audience voting