While You Were AFK

The stream’s story in one studio: goals, milestones, rules, and inside jokes become a catch-up card for late arrivals.
Broadcasters can add a goal, milestone, rule, or inside joke directly in the studio.
A viewer’s nomination waits in the community review queue. Pending suggestions stay out of the catch-up.
An approved nomination joins the timeline and catch-up, keeping its original timestamp and contributor credit.
With replies enabled, !catchup returns the approved goal, milestone, rule, and inside joke directly in Twitch chat.
The OBS overlay brings the approved story onto the stream, with timestamps and a !catchup reminder for late arrivals.

Inspiration

Joining a Twitch stream late can feel like walking into the middle of a conversation. Everyone knows the goal, the rules, and the joke—except you.

I wanted to help newcomers catch up without making the streamer repeat the backstory. While You Were AFK gives the community a shared memory of the stream, shaped by the people watching it.

What it does

While You Were AFK keeps four kinds of context:

Goals: what the streamer is trying to accomplish.
Milestones: what has happened so far.
Rules: challenges or constraints viewers should know.
Inside jokes: why chat keeps repeating that phrase.

Broadcasters and moderators publish context through Twitch commands or the broadcaster’s studio. Viewers can suggest moments with !moment, but those suggestions stay in a review queue until approved.

A late arrival types !catchup to request the approved story so far. With optional replies enabled, the recap appears directly in Twitch chat. A read-only OBS overlay displays the same approved context on stream.

Each moment retains its timestamp and contributor credit. Streams are saved in the broadcaster’s browser and can be restored after reconnecting Twitch.

How I built it

The application uses vanilla JavaScript, HTML, and CSS, with a Node.js server handling Twitch authorization and chat events.

Twitch OAuth verifies the broadcaster’s identity, and Twitch EventSub delivers chat messages over a WebSocket. Server-sent events update the studio and OBS overlay.

The catch-up uses deterministic rules: it selects the latest approved goal, milestone, rule, and inside joke. It does not watch the video or invent a summary of events.

I used OpenAI Codex throughout development, directing the concept and reviewing the implementation. Codex helped build the timeline, command handling, moderation workflow, recap selection, Twitch integration, browser storage, overlay, and automated tests.

The hosted application runs on Render, without a database or persistent server disk.

Challenges I faced

The main challenge was deciding what should become part of the stream’s shared story. Letting every viewer publish directly would make the recap unreliable. I separated viewer nominations from approved moments so the community could contribute while moderators retained control.

Another challenge was preserving the meaning of a moment during review. Approval keeps the nomination’s original timestamp and contributor credit, rather than treating approval time as the moment it happened.

Hosting introduced questions about privacy and isolation. Different Twitch channels needed separate studios, chat connections, and archives. OBS also needed access to approved content without gaining access to studio controls, so I added a separate read-only overlay URL.

For storage, I chose browser-local archives to keep the demo lightweight. Restoring them safely required validating the broadcaster’s identity and preventing an older browser backup from overwriting a studio already active on the server.

What I learned

I learned that a useful catch-up does not need to summarize everything. A clear goal, an important milestone, a rule, and an explanation of the current joke can give newcomers enough context to participate.

I also learned that moderation is part of the product experience. Showing a suggestion move from nomination to approval makes the community’s contribution visible while keeping the recap trustworthy.

Working with Codex helped me move from an idea to a testable workflow. Real Twitch testing was essential: it let me check the complete path from a viewer’s command to moderator approval, the updated recap, and an actual reply in chat.