Ezra the Tutor
An AI tutor you talk to. It explains in small spoken beats and draws on a live whiteboard as it teaches.
Stack: React 19, Vite, TypeScript, Node.js, Express, Groq, Server-Sent Events, Web Speech API, Web Audio API, SVG
The problem
Most AI study assistants answer with one long block of text and leave the student to work out whether they understood. A good human tutor diagnoses first, explains in small pieces, checks understanding, and changes approach when the student is confused.
How it works
The student talks or types. The teaching engine, running Llama 3.3 70B on Groq, follows a Diagnose, Explain, Check, Adapt loop. Each response is split into "beats": one or two spoken sentences paired with the whiteboard actions that go with them. Beats stream to the browser over Server-Sent Events, are spoken through the Web Speech API, and are drawn on an SVG whiteboard.
Decisions
Decisions worth explaining
Streaming beat parser
Standard JSON parsers fail on partial JSON, so I wrote a state machine that tracks string boundaries and brace depth and emits each beat the moment its closing brace arrives. Speech and drawing begin within about 100 ms of generation.
A small drawing language instead of generated images
The model emits actions (writeText, drawBox, drawArrow, clearSection) describing relationships, and a deterministic layout engine computes positions. This is fast, predictable, and animatable.
Browser-native speech
Zero cost and no audio round trips, with a text-input fallback for browsers without full support.
One central persona file
One central persona file so the tutor's voice stays consistent.
Status
What's not finished
Session memory resets when a lesson ends. Speech works best in Chromium browsers. The whiteboard draws boxes, arrows, and text, not freehand illustration. Voices depend on the system's installed voices. The repository has 20 integration test scripts covering streaming, voice, and session behavior.
Next project