Explaining Technical Concepts Is a Metaphor Problem, Not a Drawing Problem
I've spent years delivering technical projects, and I keep running into the same thing: when a concept fails to land, it's rarely because the diagram was bad. It's because the metaphor was wrong. Here's a concrete case. Explaining caching, I'd draw the usual boxes: request comes in, check cache, hit

I've spent years delivering technical projects, and I keep running into the same thing: when a concept fails to land, it's rarely because the diagram was bad. It's because the metaphor was wrong. Here's a concrete case. Explaining caching, I'd draw the usual boxes: request comes in, check cache, hit returns early, miss goes downstream. Correct — and useless. Clients would nod, then ask: "so where exactly do we save?" Boxes and arrows describe what, not why. If the listener doesn't already understand the mechanism, the diagram doesn't help. Anatomy (7459 stars, MIT) takes the opposite route. Instead of a flowchart, it builds a real, working physical device that behaves like the concept — then renders it as an interactive isometric figure. To explain "cache hit skips the computation," what does it draw? A pin tumbler lock. A row of pins inside the cylinder. Only when every pin is lifted to the same height will the lock turn. One mismatch and nothing moves. That's a cache hit: all keys must match to take the shortcut. And it's interactive — you can manipulate the pins and watch the mechanism respond. Same pattern elsewhere: Token bucket rate limiter → a bucket that actually leaks Cache eviction → a conveyor belt with sorting gates Concurrency control → interlocking gears Output is SVG, optionally with WebGL shaders or full 3D. npx skills add wheresryan22/anatomy -g -a claude-code /anatomy explain how a token bucket rate limiter works, interactive It's an agent skill — works in Claude Code, OpenCode (/anatomy), and Codex ($anatomy). No API key, no npm install (Node built-ins only). Before a solution review, I run the key mechanisms through it and pick the figure whose metaphor lands best. One practical tip: don't ship the first output. Ask for several variants of the same concept — the third metaphor is usually the one that clicks. Same as asking a person to explain something; the first answer tends to be the rehearsed one. The bigger point: this step (abstract → concrete) used to depend entirely on someone's inspiration. Now it can be iterated cheaply. It's an explanation tool, not a drafting tool — the output is stylized isometric art, not engineering drawings Heavy stylization means formal materials may still need manual adjustment Requires an agent environment (not standalone software) It explains how a mechanism works — it doesn't decide whether you should do it Chinese localization with a quick-start section: https://github.com/yangshun2005/anatomy-cn If it's useful, a star on the original repo helps the author.
Key Takeaways
- •I've spent years delivering technical projects, and I keep running into the same thing: when a concept fails to land, it's rarely because the diagram was bad
- •This story was reported by Dev.to, covering developments in the dev space.
- •AI advancements continue to reshape industries — read the full article on Dev.to for complete coverage.
📖 Continue reading the full article:
Read Full Article on Dev.to →


