WhoCautious developer about to install a viral agent skill from a days-old repo
The problemNew skills run code with your agent's access, and a trending repo can still hide risky scripts.
The outcomeA checked install where you have read the install scripts and hooks and ran it in an isolated environment first.
Steps
Clone or download the repo and read SKILL.md and any install scripts first.
Look for auto-run hooks, odd obfuscation or hidden characters in the files.
Install in a throwaway project or sandbox: npx skills add wheresryan22/anatomy
Only install globally with -g after you are comfortable.
Prompt for your agent
Review the wheresryan22/anatomy repo for install scripts, auto-run hooks, hidden Unicode and obfuscation, and summarize anything risky before I install it. List the files you checked.
Caveat. A review is only as good as what you read, and the README says the kit uses no npm dependencies, so confirm that yourself.
Turn a technical flow, like a message hopping across a radio mesh, into an animated page people can explore.
Intermediate
1 hour
Claude Code
Codex
Seen in the wild
Evidence (similar to what people reported): Reddit
WhoCommunity organizer or maintainer who wants newcomers to understand how their network moves a message
The problemNewcomers do not grasp what happens between pressing send and the message arriving.
The outcomeA public interactive explainer page, in more than one language if you ask for it.
Steps
Install the skill: npx skills add wheresryan22/anatomy -g
Describe the flow you want explained with /anatomy and ask for a standalone HTML page.
Test the page and fix unclear labels with follow-up requests.
Host the HTML file on any static site.
Prompt for your agent
Using wheresryan22/anatomy, build an interactive explainer of how <message or data flow> travels through <network>. Output a hostable HTML page and verify each step in the flow is clickable.
Caveat. Review the technical claims in the figure before publishing, since the agent may simplify or misstate protocol details.
Replace a long written explanation with a rotatable, clickable figure of the process.
Beginner
45 minutes
Claude Code
Seen in the wild
Evidence (similar to what people reported): X, Oct 2026
WhoConsultant or architect who struggles to explain a process to a client in words
The problemClients lose the thread in text-only explanations of multi-step systems.
The outcomeAn interactive figure the client can rotate and click through, shared as an HTML page.
Steps
Install the skill: npx skills add wheresryan22/anatomy -g -a claude-code
Describe the process in one sentence with /anatomy and name the key stages.
Open the generated page and walk the client through the parts.
Export or share the HTML page after checking the labels.
Prompt for your agent
Use wheresryan22/anatomy to build an interactive figure that explains <client process> as a machine with clickable parts. Confirm every stage is labeled and the readout makes sense to a non-technical viewer.
Caveat. Invented metaphors can mislead a client if a detail is wrong, so review each label against your real process before showing it.
WhoCurious learner or teacher who wants to see how a real machine works after reading a trending post
The problemText explanations of engines, locks and other mechanisms are hard to picture.
The outcomeA standalone interactive HTML page showing the machine in cutaway, with parts you can inspect and a live readout.
Steps
Install the skill: npx skills add wheresryan22/anatomy -g -a claude-code
Open Claude Code in an empty folder.
Run: /anatomy explain how a door lock works, interactive
Open the generated HTML page in your browser and hover or click the parts.
Prompt for your agent
Use the anatomy skill from wheresryan22/anatomy to build an interactive isometric figure explaining how <machine, e.g. a turbofan engine> works. Save it as a standalone HTML page, then check that hovering a part updates the live readout.
Caveat. Long runs are reported, so expect around half an hour for a detailed figure, and the model's idea of how the machine works is not an engineering reference.
Describe a vehicle or device and its spec numbers, and get an exploded isometric figure with live values.
Intermediate
45 minutes
Claude Code
Seen in the wild
Evidence (similar to what people reported): X, Oct 2026
WhoTech blogger or hobbyist who read a launch claim and wants a visual explainer of what is inside
The problemSpecs and press claims about internals are hard to follow without a picture.
The outcomeAn interactive isometric figure of the device with its main parts, built from the specs you supply.
Steps
Install the skill: npx skills add wheresryan22/anatomy -g
Run: /anatomy <the machine you want>, listing the parts and spec numbers you want modeled.
Open the page and use the exploded view to inspect the assemblies.
Ask for fixes where a part or number looks wrong.
Prompt for your agent
Use the anatomy skill from wheresryan22/anatomy to build an exploded interactive figure of <product>, using these specs: <specs>. Verify every number shown in the figure matches the specs I gave.
Caveat. The figure is an illustration based on the specs you provide and the model's guesses, not a verified engineering drawing.
Use the skill's look to design the interface of a small control panel, like a web remote.
Advanced
2 hours
Claude Code
Seen in the wild
Evidence (similar to what people reported): X, Oct 2026
WhoHobbyist building a small web remote or dashboard who wants a distinctive visual style
The problemPlain buttons and sliders make a hobby project look generic.
The outcomeA web interface where controls look like parts of an isometric machine, built with the skill's shading and camera.
Steps
Install the skill: npx skills add wheresryan22/anatomy -g
Ask Claude Code to use /anatomy to design the control panel for your project.
Wire the generated figure to your app's real actions.
Test each control and fix mismatches between the drawing and behavior.
Prompt for your agent
Use the anatomy skill from wheresryan22/anatomy to design an isometric control panel for <my small app>. Make sure each drawn control triggers the right action.
Caveat. The skill makes figures to explain things, so connecting it to real app logic is custom work by you and the agent.
Generate a figure once and ship it as a lone SVG file or React and Next.js components.
Intermediate
1 hour
From the README
Claude Code
Codex
WhoFrontend developer adding an interactive diagram to a docs site or landing page
The problemA diagram made in a design tool is static and hard to keep in sync with the page.
The outcomeA figure delivered as an SVG file with embedded styles, or as React components you drop into your site.
Steps
Install the skill: npx skills add wheresryan22/anatomy -g -a claude-code
Run /anatomy with your idea and ask for the output format you need, SVG or React.
Place the exported file or components in your project.
Load the page and check the figure renders and responds to hover.
Prompt for your agent
Use wheresryan22/anatomy to create a figure explaining <idea> and export it as <SVG or React components>. Verify it renders correctly inside <my site or framework>.
Caveat. The README lists HTML, SVG and React and Next.js outputs, but how a figure fits into your build setup is up to you.
Describe a concept like a cache key or rate limiter and get a figure built as a mechanism that behaves the same way.
Intermediate
45 minutes
From the README
Claude Code
Codex
WhoDeveloper or technical writer preparing docs or a blog post on an abstract concept such as a token bucket
The problemAbstract ideas like caching or rate limiting are hard to show in a plain diagram.
The outcomeAn interactive figure where a physical mechanism (the README gives a pin-tumbler lock for a cache key) stands in for the concept, ready to embed.
Steps
Install the skill: npx skills add wheresryan22/anatomy -g
In Claude Code run: /anatomy explain how a token bucket rate limiter works, interactive
Interact with the result and check that the figure's numbers change as you play with it.
Ask the agent to adjust the metaphor if it does not match your concept, then regenerate.
Prompt for your agent
Using wheresryan22/anatomy, build an interactive figure that explains <software concept> as a physical mechanism. Output a single HTML page and verify the live readout matches the concept's real behavior.
Caveat. The mechanism is an invented analogy, so review it for accuracy before publishing it as documentation.
Ask for a figure that needs exhaust, ripples or glow and get WebGL effects inside the isometric drawing.
Intermediate
1 hour
From the README
Claude Code
WhoEducator or designer making a physics or engineering explainer that needs motion effects
The problemFlat vector drawings cannot show fire, fluid or light in motion.
The outcomeA figure whose WebGL layer draws the effect in the same isometric camera as the SVG parts, like the README's engine plume and ripple tank.
Steps
Install the skill: npx skills add wheresryan22/anatomy -g
Describe a machine that needs an effect, for example a rocket engine firing.
Open the page and trigger the effect; check it sits inside the drawing.
Test in a browser with WebGL enabled, since the SVG alone shows no effect.
Prompt for your agent
Use wheresryan22/anatomy to build a figure of <machine with fire, water or light> with a WebGL effect layer. Verify the effect lines up with the SVG parts and the figure still reads without WebGL.
Caveat. Shader effects need a browser with WebGL and can be slower on weak hardware.
Who it is forAnyone who explains technical ideas or physical systems and wants an interactive diagram instead of a static chart, mainly people already using Claude Code or a similar coding agent.
Why it is hotabout +1,523 stars a day since launch, 17k total, launched 11 days ago, picked up by one AI source we track
DEDUPED