outofcontext
Created: May 14, 2026
Last commit: June 15, 2026
TypeScript86.6%
CSS12.9%
HTML0.5%
README.md
outofcontext
Drop into any video without the prerequisite context.
A browser extension that overlays minimal frosted-glass concept bubbles on videos — lectures, podcasts, vlogs, news clips. Bubbles surface quietly as concepts come up; click one and it morphs into a glass card with an on-demand LLM explanation and a link back to where the concept was first introduced in your library. A home page aggregates everything you've annotated.
- Spec: SPEC.md
- Design: Figma — outofcontext (file
wJS1H6oi3yn4AWTbkDN9Aa; "Extension Overlay" + home page frames) - Stack: WXT · React 19 · TypeScript · motion (framer-motion) · Dexie · Anthropic API (claude-opus-4-8)
Status
- M0 — overlay skeleton: done. Shadow-DOM overlay, glass tokens, concepts pill, right-rail bubbles driven by
currentTime, and the bubble→cardlayoutIdmorph. - M1 — transcript + concept pass: done. YouTube caption fetch, background worker, a provider-agnostic LLM layer (Anthropic / OpenAI / custom OpenAI-compatible), options page (provider · key · model · density), structured pass-1 concept mapping, and Dexie persistence.
- M2 — streaming on-click explanation: done. Click a bubble → grounded 2–3 sentence explanation streamed over a
Port(shimmer → fading chunks), with prompt caching of the transcript block, an explanation cache keyed by(videoId, conceptName), and a retry affordance if the stream is interrupted. - M3 — home / annotated library: in progress. Toolbar button opens
home.html: a Library grid (search · filters) where selecting a video opens its connection neighborhood (videos sharing concepts, ranked), and a Concepts index (search · sort) that drills into where each concept was first introduced and every video it appears in. Connections are derived from shared concepts — scales by rendering one ego-network at a time.
LLM provider is configurable — bring your own model. See SPEC.md §8 for the full milestone list.
