1 · Setup (about 15 minutes, once)
- Install Claude Code: the coding agent that builds the app for you.
- Install Node.js 20 or newer: the free runtime the app runs on.
- Get a Claude API key: then add a few dollars of API credit (billed separately from a Claude subscription).
- Get a Fish Audio API key: then add API credit with the 80%-off link above.
- Paste the build prompt into Claude Code, in an empty folder.
- Add your keys yourself. Claude Code makes a
.env file: paste both keys there, not into the chat, and never share it. - Run it in Chrome with the command Claude Code gives you.
2 · The build prompt (paste into Claude Code)
THE BUILD PROMPT · QUIZBuild me a local web app called Study Podcast: it turns my lecture notes into a two-tutor podcast that stops to quiz me.
How it works:
1. I paste my lecture notes.
2. Claude writes a 10 to 16 turn conversation between two tutors. Maya asks what a confused student would ask and lights up when it clicks. Leo explains clearly and warmly, with small concrete examples.
3. At least once, Leo turns to me with a quiz question, followed by a line that just says YOUR TURN. The player pauses there with a visible countdown (2 seconds by default, adjustable) so I can think. Then Leo gives the answer and explains it. The app doesn't listen to me or grade me.
4. Every line is voiced, then the episode plays like a podcast with no gaps. Click any line to play from there; space pauses, the arrow keys skip.
5. Save every episode so it replays for free.
The tutors (Fish Audio voice ids, from the "Fish Official" voices in the public library):
- Maya: 933563129e564b19a115bedd57b7406a (Sarah)
- Leo: 536d3a5e000945adb7038665781a4aca (Ethan)
Tech:
- Node 20+, one small server, plain HTML/CSS/JS, no build step. Read ANTHROPIC_API_KEY and FISH_API_KEY from a .env file and never send the keys to the browser.
- Claude writes the episode, using the official @anthropic-ai/sdk with model claude-opus-5-5 (make it a setting; claude-sonnet-5-5 is cheaper). Stream it onto the page as it's written.
- Format: a TITLE: line, then one line per turn: MAYA: [direction] words, LEO: [direction] words, or YOUR TURN. Directions like [confused], [curious], [excited], [warm, explanatory], [slower, deliberate], with a second tag partway through a line when the feeling changes. Short sentences, numbers written the way people say them, only facts from my notes, and double-check every calculation.
- Voice each line with Fish Audio: POST https://api.fish.audio/v1/tts with the headers "Authorization: Bearer FISH_API_KEY" and "model: drama-3", JSON body {"text": the line with its brackets, "reference_id": the voice id, "format": "mp3"}. Drama 3 reads the brackets as delivery directions.
- Cache every voiced line on disk (hash of text + voice) so replays are free.
Screen:
- Two speaker cards that light up while that voice plays, with "Voice generated by Fish Audio" showing, and the current line large in the middle.
- The full script underneath, directions visible.
- A cost estimate before anything is voiced (Drama 3 bills per character, brackets included) and a running "spent so far".
Make it clean, dark and modern. When it's done, give me the command to start it and the URL to open in Chrome.3 · Direct the voices
Write the emotion in brackets at the start of a line, and add a second tag where the tone should change:
MAYA[confused] Wait. [curious] So I earn interest on the interest?
LEO[excited] Exactly! [slower, deliberate] Now, you try. A hundred dollars grows ten percent a year. How much after two years?
LEO[warm, explanatory] One hundred and twenty-one dollars. That extra dollar is interest on last year's interest.
Those are the lines from my video. The quiz line slows down on the second tag, so the question lands. Tags to try: [warm], [skeptical], [excited], [slower], [firm], [sigh], [pause]. Fish Audio's Drama 3 page also shows tags that wrap words, like <whisper>…</whisper>.
4 · Tips
- One episode per lecture. Short and specific beats one giant episode for the whole course.
- Answer out loud. The pause is for you. Saying the answer beats thinking it.
- Check the facts. Claude is told to use only your notes, but read the script once before an exam.
5 · If something breaks
- No sound: Click Play once first. Browsers block audio until you interact with the page.
- 401 from Fish Audio: The key is wrong. Re-copy it into .env and restart the app.
- 402 from Fish Audio: No API credit yet. API credit is separate from the Fish Audio app plans.
- Changed .env, nothing happened: Stop the app and start it again. Keys are read when it starts.
Each episode costs real money, about 5 cents for me. The app doesn't hear or grade your answer; the pause is just time to think. AI can still get a fact wrong, so check anything you'll be tested on against your notes. Paid partnership with Fish Audio. The Fish Audio link is my affiliate link. Offer details are from Fish Audio's Drama 3 launch post (checked Nov 2, 2026) and can change, so check the price before you buy.