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>
New slide plants the model-as-horse metaphor before the LLM mechanics arc
(slides 10–13: tokens, autoregression, IDs, statelessness). Stripped-down
version of the existing harness slide: horse body only, no harness elements,
no callouts. Two text lines:
"A horse. A model."
"The model is the horse. Raw power, no direction." (red)
The full harness reveal with all 5 callouts (Control loop, Tool allowlist,
Context management, Evaluator, State persistence) and etymology footnote
remains intact at its later position.
Mechanical changes:
- viewBox tightened to "110 25 340 345" (was wider to accommodate callouts)
- <defs> block dropped (no arrow markers needed without callouts)
- former slides 9–54 renumbered to 10–55 (the original harness slide moved
from position 18 to 19)
- Total slide count: 54 → 55. data-level distribution preserved.
Co-Authored-By: Claude <noreply@anthropic.com>
New slide goes one level deeper than slide 13 — shows the integer token IDs
the model actually receives, not just the colored subword tiles. Uses
llm-animation-tokenids.svg with figure max-width 960px (vs 860px for the
narrower LLM SVGs) since the asset's viewBox is 1360×600.
Caption translates the math notation deliberately left in the SVG:
- "The model never reads text — it reads a sequence of integers, each one
an index into a vocabulary of ~200,000 entries."
- "Notice the comma is always ID 11 — the same punctuation mark maps to
the same integer, everywhere, every time."
Renumbering: former slides 14–53 shifted to 15–54. Total slide count
53 → 54. data-level distribution preserved.
Co-Authored-By: Claude <noreply@anthropic.com>
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>
New slides introduce LLM fundamentals before the Claude Code content for a PM
and beginner-technical audience:
- Slide 11 "One token at a time" — autoregressive generation (llm-basic.svg)
- Slide 12 "Tokens, not words" — tokenization basics (tokens.jpg)
- Slide 13 "Tokens in, tokens out" — combined view (llm-advanced.svg)
Renumbering: former slides 11–50 shifted to 14–53 by incrementing data-slide
attributes and updating SLIDE-N banner comments. data-level groupings
(agents/claude-md/skills/context/workflow) preserved. Total slide count
50 → 53. Asset path: ../assets/llm/.
Co-Authored-By: Claude <noreply@anthropic.com>
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>
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>
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>
Adds the same Old French etymology line ("The origin is Old French
harneis — gear, equipment, armor.") that was added to the canonical
best-practice deck, so the horse-harness analogy slide reads
identically across both decks. The line sits below the existing red
subtitle as a muted footnote (0.95rem, #666), with `text-align:
center` added for this deck because the GDG caption block relies on
flex centering rather than inherited text alignment.
Co-Authored-By: Claude <noreply@anthropic.com>
Adds a styled-HTML dialog diagram (User vs Model bubbles, dashed amber
divider labeled "new session — context wiped", and a two-line caption
strip) to make the stateless behavior of LLMs visible. Drawn rather than
imported as PNG, mirroring slide-12's inline-diagram conventions. Old
slides 10..48 shifted to 11..49 via sentinel-replacement; banner
comments updated in the same pass to keep the deck's zero-drift state.
No new CSS classes — all layout via inline styles consistent with
surrounding slides.
Co-Authored-By: Claude <noreply@anthropic.com>
The slide titled "Tool Calling" / "How the Harness Reaches the World" was
added to the deck after the GDG Kolachi event on Apr 25, 2026, so it doesn't
belong in the historical record of what was actually presented. Reverting
the GDG deck to as-presented state.
The slide is preserved in the new claude-code-best-practice fork (which is
the canonical living reference owned by presentation-claude-code), so no
content is lost overall — this is a deliberate divergence between the two
decks.
Slide had no data-level, so the journey bar is structurally unaffected.
Renumbered slides 15..53 → 14..52 via sentinel-replacement. Final count: 52.
Co-Authored-By: Claude <noreply@anthropic.com>
Forked from presentation/2026-04-25-gdg-kolachi-cli-claude-code-gemini/index.html
on 2026-04-30 to serve as the ongoing main reference deck. Renamed and decoupled
from GDG/Gemini-specific branding:
- title tag, slide-1 H1, subtitle, and HTML banner all read "Claude Code Best Practice"
- favicon swapped from gemini-jumping.svg to claude-jumping.svg
- right-corner global Gemini mascot removed (left Claude mascot kept)
- GDG event badge replaced with neutral GitHub repo badge
- four trailing Gemini-comparison slides removed (49, 50, 51, 52)
- co-presenter intro slide removed
- inline <!-- SLIDE N: ... --> banners fully repaired (1:1 with data-slide values)
Final deck: 48 slides ending with "Thank you" closing slide.
Co-Authored-By: Claude <noreply@anthropic.com>
- Swap intro-slide logos from disrupt-logo.png to disrupt.svg (lines 190 and 260)
- Wrap each disrupt logo in <a href="https://disrupt.com" target="_blank" rel="noopener noreferrer"> so the logo opens disrupt.com in a new tab
- Update model-limitation.jpg path from assets/model/ to assets/harness/ to match the asset move
- Insert new "Tool Calling" slide using assets/harness/tool-calling.png; cascading data-slide renumber for all 40 slides at index >= 13 (totals: 52 -> 53)
- Reorder slides 12-14 so the narrative reads Limitations -> Horse+Harness metaphor -> Tool Calling mechanism
Co-Authored-By: Claude <noreply@anthropic.com>
Visual aid showing how the model issues tool calls and the harness executes
them against the outside world. Used by the new Tool Calling slide.
Co-Authored-By: Claude <noreply@anthropic.com>
Vector replacement for the previous disrupt-logo.png raster, keeping crisp
rendering at any projection scale.
Co-Authored-By: Claude <noreply@anthropic.com>
Reorganize the screenshot under harness/ alongside other harness-limitation
assets. File contents unchanged (rename detected as 100% similarity).
Co-Authored-By: Claude <noreply@anthropic.com>
Shayan Rais