Anwar Bouilouta

Anatomy: Get Claude to Draw the Machine, Not the Boxes

Install the free Claude Code skill that turns one line about an idea into a live, working machine you can turn, press and read.

A free guide by Anwar Bouilouta 3 min read

Back to all free guides

So in the reel I showed Anatomy, the free Claude Code skill that draws the real machine instead of another slide of boxes and arrows. Here's the install line, the first prompts I'd try, and the maker's tips for getting a figure that actually explains something.

What it does

  • It's free and open source. MIT licence, made by Ryan, and past 20,000 stars on GitHub.
  • You name an idea in one line. Claude invents a machine that does it and draws it as a live figure you can turn, press and read.
  • It's built from real parts. Every figure is dozens to hundreds of small solid parts that actually move.
  • It checks its own work. It zooms in on every joint, and every number a figure shows comes from the same small model that moves its parts.
  • The gallery is worth a look. The maker has 33 live figures up, including a Rolls-Royce Trent 970 where you drag the thrust lever and watch the thrust climb.

Before you start

You'll need Claude Code set up and signed in, plus:

  • Node.js 20.10 or newer. The skills installer itself asks for 22.20 or newer, so check with node -v first.
  • Chrome or Chromium. Anatomy uses it for the checks it runs on its own drawings.

Install it

Paste this into your terminal. The -a claude-code part skips the question about which agents to set up.

Run this in your terminal
npx skills add wheresryan22/anatomy -g -a claude-code

There's no API key and nothing else to install.

Your first figure

Start with the README's own first prompt. It's a good test because a rate limiter is exactly the kind of thing people normally draw as boxes and arrows.

Paste this into Claude Code
/anatomy explain how a token bucket rate limiter works, interactive

If you already know the machine you want, name it and say what should move:

Name the machine
/anatomy a heat-exchanger espresso machine with the side panel off: boiler, heat-exchanger tube, group head, pump, steam wand and gauge. Show the water flowing when you pull a shot. Standalone HTML, light theme.

Explain your own idea

This is the one I'd use for a product or a process you have to explain at work. Fill in the two lines at the end:

Your own idea
/anatomy explain how the idea below works, as an interactive figure on a standalone HTML page, light theme. Use the real numbers I give you for anything the figure shows.

Idea:
Real numbers:

The maker's tips

  • Name the idea, not the drawing. Say what it should explain, and let Claude pick the machine.
  • Give it the real numbers. The figure's readouts come from them.
  • Say where it'll live. A standalone HTML page, an SVG file or a React component, light or dark.
  • Let it take its time. It builds slowly on purpose, so set a figure going and come back to it.

Community now open

My AI Growth Room on Skool is free to join, and the Claude editing skill I use for my reels is in there.

Join free

Where to next

Three ways to get it done

Do it yourself

Free

Every guide points you at one AI tool that's worth your time, with the prompt or checklist to set it up yourself.

See all free guides

Done with you

Community now open

Go from watching AI videos to using AI in your own work every week, with live help and a group doing it alongside you.

Join free

Done for you

With ABAI

For owners of B2B businesses with a bottleneck that's costing them clients. We find it, then build the AI growth system that fixes it, in your own tools and on a fixed fee.

Book a strategy call