Lecture Life

LectureLife — Turning Boring Lectures Into Live Experiences

What Inspired Us

It started four days ago in a marketing class. Slides full of bullet points, professor reading off the screen, half the room on their phones. We thought — why can't learning actually hit different? That one moment of zoning out became the entire idea. We wanted to build something that made students actually want to show up.

What We Built

LectureLife is a real-time lecture presentation platform where professors upload their PDF slides, AI transforms them into engaging content instantly, and students join live on their phones by scanning a QR code. Once connected, students see slides update in real time and can ask anonymous questions without the awkwardness of raising their hand.

We built four interactive modes that turn any slide into an experience:

• Quiz Mode — timed multiple choice and true/false knowledge checks with score tracking
• Game Mode — Kahoot-style buzzer rounds, spin the wheel, and a live leaderboard
  
• Explore Mode — flashcard flips, drag and match, and click to reveal
• Story Mode — real-world decision trees where students step into scenarios and make choices

How We Built It

Frontend: React 19 + Vite + Tailwind CSS + Socket.io Client

Backend: Express + Socket.io + DuckDB

AI: Mastra agents + Claude API — two agents run on every upload. Agent 1 extracts key concepts and learning objectives from the slides. Agent 2 rewrites each slide using pedagogical frameworks, adding real-world examples and hooks.

Deployment: Vercel (frontend) + Render (backend)

The real-time sync between professor and student screens runs entirely through Socket.io. When the professor advances a slide, every connected student phone updates instantly — no refresh, no delay.

What We Learned

• How to build and orchestrate multi-agent AI pipelines with Mastra in a production setting
• How Socket.io handles real-time broadcasting across multiple connected clients
• How to design for two completely different user experiences — professor and student — within one cohesive product
• How fast you can move when the idea genuinely matters to you

Challenges We Faced

The biggest challenge was getting the student phone to receive live slide updates reliably. The frontend was initially pointing to localhost instead of the deployed Render backend URL, which meant the Socket.io connection worked locally but broke completely on any external device. Once we updated the server URL to the Render deployment, everything clicked.

PDF parsing was another challenge — extracting clean, structured text from uploaded slides for the AI agents to process required careful handling of different PDF formats and layouts.

Finally, designing for mobile students while simultaneously building the professor desktop view meant we were essentially building two products at once under a 24-hour deadline.

The One Line That Sums It Up

Boring lecture. Half the room on phones. We built LectureLife — AI slides, live QR sync, anonymous questions, and four interactive modes. Learning that actually slaps.

Built With

• claude-api-(anthropic)-database-duckdb-deployment-&-cloud-render-other-tools-pdf.js
• css-frameworks-react-19
• express.js-real-time-socket.io-ai-&-agents-mastra
• html
• languages-javascript
• qr-code-library
• tailwind-css
• vite