7 Commits

Author SHA1 Message Date
Shayan Rais b667fc5234 restructure llm-animation-tokenids.svg for projector legibility
Same pattern as 13f7ca9 (llm-basic.svg). Title and subtitle removed from
the SVG; both promoted to the slide-level heading and caption on slide 13.
The math-notation subtitle (f: ℤᵏ → ℝⱽ ; next_id = argmax(f(ids))) was
removed entirely — not promoted anywhere, since it doesn't help PMs and
there's no good place for it after the bottom section was simplified to
a single line.

Iteration counter relocated from y=83 (top) to y=550 (bottom, just above
the feedback caption), font size 13 → 20.

Entire diagram shifted upward by 80px to reclaim the space freed by the
removed title and subtitle. Feedback path arc shifted accordingly:
M 1090 510 Q 680 568 270 510 → M 1090 430 Q 680 488 270 430. Feedback
caption pushed slightly: y=565 → y=575. Footnote about illustrative
response IDs shifted: y=588 → y=613.

ViewBox extended 600 → 630 at the bottom. Background rect height bumped
to 630 to match.

The decorative f: ℤᵏ → ℝⱽ label *inside* the LLM black box was preserved
as visual texture (too small to read at projector distance, just signals
"math is happening here") — distinct from the removed top subtitle.

All 7 <animate> blocks on iteration elements preserved verbatim.

Co-Authored-By: Claude <noreply@anthropic.com>
2026-05-07 12:48:04 +05:00
Shayan Rais 33cd221a91 restructure llm-advanced.svg for projector legibility
Same pattern as 13f7ca9 (llm-basic.svg). Title and subtitle removed from
the SVG (now promoted to the slide-level heading and caption on slide 12).
Iteration counter relocated from y=83 (top) to y=480 (bottom, just above
the feedback caption), font size 13 → 20.

Entire diagram shifted upward by 80px to reclaim the space freed by the
removed title and subtitle (panels, LLM box, all token rows, arrows,
animated circles, output panel, feedback path control point).

ViewBox extended 540 → 570 at the bottom to accommodate the relocated
iteration counter. Background rect height bumped to 570 to match.
Feedback path arc shifted: M 990 410 Q 620 480 250 410 →
M 990 330 Q 620 400 250 330. Feedback caption stays at y=510 — the
upshift creates enough clearance.

All 7 <animate> blocks on iteration elements preserved verbatim.

Co-Authored-By: Claude <noreply@anthropic.com>
2026-05-07 12:47:48 +05:00
Shayan Rais 13f7ca9e48 restructure llm-basic.svg for projector legibility
Title and subtitle removed from the SVG (now promoted to the slide-level
heading and caption). Iteration counter relocated from the top of the SVG
(y=85) to the bottom (y=480), just above the feedback caption, with font
size increased from 13 to 20 for projector readability.

The whole diagram (panels, LLM box, arrows, animated circles, feedback
path) shifted upward by 80px to reclaim the space freed by the removed
title and subtitle — the diagram now fills more of its viewBox rather
than leaving empty space at the top.

ViewBox extended 500 → 530 at the bottom to accommodate the relocated
iteration counter and pushed-down feedback caption (y=488 → y=510).
Background rect height bumped to 530 to match (otherwise the new bottom
strip would render transparent).

All 7 <animate> blocks on iteration elements preserved verbatim — only
the parent <text> y and font-size attributes changed.

Co-Authored-By: Claude <noreply@anthropic.com>
2026-05-07 12:34:51 +05:00
Shayan Rais 9a2657c431 add llm-animation-tokenids.svg — advanced tokenization view with integer IDs
Animated SVG showing what the LLM actually receives: integer token IDs (one
layer deeper than llm-advanced.svg). Each of the 32 input tokens displays the
ID prominently with the token text in small italic underneath (e.g., 28133
"Does", 17554 " Chat", 162016 "GPT", 97481 " Claude", 29683 " Anth", 71571
"ropic"). Same 7-iteration autoregressive loop; generated tokens also shown
as IDs. Vocab size labeled V ≈ 200,000. Title formula: f: ℤᵏ → ℝⱽ;
next_id = argmax(f(ids)). ViewBox 1360×600 (wider than the other LLM SVGs).

Co-Authored-By: Claude <noreply@anthropic.com>
2026-05-07 11:58:57 +05:00
Shayan Rais a05c791c41 add llm-advanced.svg — combined BPE tokenization + autoregressive diagram
Animated SVG showing the same BPE-tokenized prompt from tokens.jpg (32 colored
subword tiles, e.g., "Anthropic" → "Anth"+"ropic", "Perplexity" →
"Per"+"plex"+"ity") feeding into the LLM and generating "Yes, they all use
BPE." token-by-token across 7 iterations. Combines tokenization and
autoregressive generation into one view.

Co-Authored-By: Claude <noreply@anthropic.com>
2026-05-07 11:45:16 +05:00
Shayan Rais faa82716b0 add tokens.jpg — OpenAI tokenizer screenshot for tokenization slide
Screenshot of platform.openai.com/tokenizer showing the sentence "Does ChatGPT,
Claude, Anthropic, Llama, Mistral, Gemini, and Perplexity all use Byte-Pair
Encoding (BPE)?" tokenizing to 32 tokens / 105 characters. Visible tabs:
GPT-5.x & O1/3, GPT-4 & GPT-3.5 (legacy), GPT-3 (legacy) — illustrates that
different model generations use different tokenizers.

Co-Authored-By: Claude <noreply@anthropic.com>
2026-05-07 11:45:09 +05:00
Shayan Rais e53739367a add llm-basic.svg — animated autoregressive generation diagram
Three-panel SVG (input context, LLM black box, predicted next token) with
7-iteration loop generating "The capital of Japan is Tokyo." from the prompt
"What is the capital of Japan?". Includes purple feedback loop showing each
predicted token appended back into the input.

Co-Authored-By: Claude <noreply@anthropic.com>
2026-05-07 11:45:00 +05:00