Inspiration

I love raids. A whole community shows up at once and the chat explodes. But I kept noticing the same thing: raiders land in the middle of the story. The streamer is on attempt three, chat is spamming some joke from an hour ago, and the new people have no idea what is going on. A lot of them just leave.

TV figured this out decades ago with "Previously on...". So I wanted to give every Twitch stream its own.

What it does

Previously On keeps a live memory of your stream and uses it to catch every newcomer up.

  • Live stream memory. The dashboard records the streamer's mic in 30 second chunks and transcribes them. Together with chat, an AI keeps a running summary: what is happening right now, the moments worth remembering, and the running jokes.
  • !catchup. Any viewer can type it and get a short, specific recap of the last 30 minutes right in chat.
  • !lore [term]. Explains a channel inside joke and where it came from. Lore is saved across streams, and the streamer can edit or delete entries.
  • Raid recap. When a raid lands, the OBS overlay plays a TV style "Previously on [channel]..." with a narrator voice, subtitles and moments (and Twitch clips) from earlier in the stream, then welcomes the raiders by name.
  • Raider briefing. The streamer instantly sees who raided, how many people came, and what they were streaming, plus a quick idea for how to greet them.

How I built it

Everything was built with OpenAI Codex in one thread. I wrote the plan and the constraints, and Codex did the building phase by phase: scaffolding, Twitch auth and EventSub, the memory, chat commands, the raid recap and overlay, hardening, and the design pass.

  • Next.js (App Router, TypeScript, Tailwind) running as one long lived Node process, with Docker Compose for judges
  • Twitch: OAuth, EventSub over WebSocket for chat messages and raids, the Chat API for replies, the Clips API for moment clips, and Helix for channel info
  • OpenAI: gpt-4o-mini-transcribe for the mic, gpt-5.6-luna with structured outputs for summaries, catch-ups, lore and recap scripts, and gpt-4o-mini-tts for the narrator
  • A transparent 1920x1080 overlay page for OBS, animated with anime.js, plus a streamer dashboard and a landing page

Challenges I ran into

  • Speed. A raid needs a recap now, not in 13 seconds. Generating the script and the voice after the raid took too long, so the app now prepares a standby recap in the background every time the summary changes. When a raid lands, it plays instantly, and only the short "welcome in" line is generated live.
  • Making the AI honest. The model loved inventing lore. For unknown terms it now has to quote an exact line from the real transcript or chat as evidence, and the code rejects the answer if that quote is not there.
  • Recording audio in the browser. MediaRecorder chunks after the first one cannot be decoded on their own, so the dashboard records a fresh 30 second file each time instead.
  • Real world mess. Token refresh, EventSub reconnects, two raids arriving close together, OBS crashing on my Mac. Each one needed a real fix, and the app now has 29 tests.

What I learned

How EventSub really behaves (keepalives, reconnects, duplicate messages), how much a good prompt plan matters when an agent is writing the code, and that the best UX for a streamer tool is showing less, not more.

What's next

Better clip timing for moments, multi-language recaps, and letting streamers pick the narrator voice and style so the recap feels like their channel.

Built With

Share this project:

Updates

Submission history