Individual skill
folio
Build a museum-style exhibition plate that explains a technical idea - an invented scientific instrument drawn as a live, engraved isometric figure in three views (SVG, WebGL light, and a 3D bench you can turn through 360 degrees) with internal parts that really rotate and interact, with numbered specimen pins, a catalogue key, a working model behind every number, and wall texts that walk through the formula term by term. Use for explanatory figures, interactive explainers, "how does X work" visuals, or technical illustrations for docs, courses, posts and landing pages, even when the request never mentions museums, plates or isometric drawing.
SKILL.md
Source commit 3fdd974eb19bf66cf27c8a5723a9e8486e60e25f
What was checked
- Matches the observed repository HEAD
- Yes
- Scanner rules are current
- No
- Repository scan complete
- No
- Skill scan complete
- No
- Observed behavior
- Not checked yet
- Last checked
- Nov 4, 2026
These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.
Install this skill
Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.
An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.
Repository context
- Repository stars (not skill ratings)
- 11
- Repository last updated
- Oct 13, 2026
- License
- MIT
Observed agent integration: No specific integration evidence. Standard SKILL.md installation does not imply verified compatibility.
- claude Repository topic
- claude-ai Repository topic
- claude-code Repository topic
- claude-code-skill Repository topic
- claude-skills Repository topic
- docs Derived category
- research Derived category
Files and excerpt
File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.
Browse files
.gitignoreasset · 37 bytesLICENSEasset · 1,078 bytesREADME.mddoc · 11,814 bytesSKILL.mdcore · 58,013 bytesSKILL.mdcore · 58,013 bytesSKILL.mdcore · 58,013 bytesdocs/attention.htmlasset · 117,784 bytesdocs/embed-attention.htmlasset · 101,913 bytesdocs/embed-grid.htmlasset · 109,290 bytesdocs/embed-hashmap.htmlasset · 121,960 bytesdocs/embed-heart.htmlasset · 107,601 bytesdocs/grid.htmlasset · 129,186 bytesdocs/hashmap.htmlasset · 147,358 bytesdocs/heart.htmlasset · 130,411 bytesdocs/img/detail.pngasset · 92,073 bytesdocs/img/grid-turned.pngasset · 120,831 bytesdocs/img/grid-webgl.pngasset · 212,402 bytesdocs/img/inspect.pngasset · 371,642 bytesdocs/img/loupe.pngasset · 311,715 bytesdocs/img/plate-i-dark.pngasset · 429,911 bytesdocs/img/plate-i-light.pngasset · 448,289 bytesdocs/img/plate-i.gifasset · 677,882 bytesdocs/img/plate-i.pngasset · 409,001 bytesdocs/img/plate-ii-dark.pngasset · 431,909 bytesdocs/img/plate-ii-light.pngasset · 448,479 bytesdocs/img/plate-ii.pngasset · 406,891 bytesdocs/img/plate-iii-dark.pngasset · 438,440 bytesdocs/img/plate-iii-light.pngasset · 452,478 bytesdocs/img/plate-iii.pngasset · 416,961 bytesdocs/img/plate-iv-dark.pngasset · 330,926 bytesdocs/img/plate-iv-light.pngasset · 344,558 bytesdocs/img/plate-iv.pngasset · 297,866 bytesdocs/img/view-3d.pngasset · 208,422 bytesdocs/img/view-svg.pngasset · 172,177 bytesdocs/img/view-webgl.pngasset · 274,042 bytesdocs/img/wall-text.pngasset · 243,304 bytesdocs/index.htmlasset · 62,759 bytesexamples/attention/model.jsruns · 3,806 bytesexamples/attention/page.htmlasset · 10,528 bytesexamples/attention/page.jsruns · 7,287 bytesexamples/attention/plate.jsruns · 32,200 bytesexamples/grid/model.jsruns · 5,302 bytesexamples/grid/page.htmlasset · 12,437 bytesexamples/grid/page.jsruns · 9,382 bytesexamples/grid/plate.jsruns · 38,102 bytesexamples/hashmap/model.jsruns · 5,597 bytesexamples/hashmap/page.htmlasset · 14,936 bytesexamples/hashmap/page.jsruns · 12,635 bytesexamples/hashmap/plate.jsruns · 50,227 bytesexamples/heart/model.jsruns · 6,256 bytesexamples/heart/page.htmlasset · 13,219 bytesexamples/heart/page.jsruns · 11,523 bytesexamples/heart/plate.jsruns · 35,450 byteskit/folio-kit.jsruns · 12,622 byteskit/folio-live.jsruns · 19,380 byteskit/folio-page.cssasset · 30,006 byteskit/folio-theme.jsruns · 1,868 bytespackage.jsonruns · 531 bytesscripts/build-site.mjsruns · 4,336 bytesscripts/build.mjsruns · 1,302 bytesscripts/capture.mjsruns · 2,339 bytesscripts/new-plate.mjsruns · 1,059 bytessite/embed.htmlasset · 1,653 bytessite/index.htmlasset · 30,766 bytes
Read excerpt
# Folio
A Folio plate explains an idea the way a natural history museum explains a specimen. There is one object on a mount, a numbered key beside it, and wall texts that tell you how to look at it. The object here is an instrument you invent, such as a bench, a balance, a loom or a still, whose working parts perform the idea. Readers can poke it, and every reading on it is computed.
## Three commitments
1. **Mechanism, not metaphor.** The instrument has to *perform* the idea, not stand beside it as an illustration. Before drawing, write one line: "When the reader does X, part Y moves, and that movement is Z in the idea."
2. **A single source of numbers.** A small pure model computes everything: needle angles, fluid levels, the readout, the key, the tables. The page only displays what the model returns, so no two places can disagree.
3. **A guided reading.** A good drawing still needs a guide. Each plate ships with a key, a term-by-term reading, the full working, and an honest account of what was simplified.
## Getting started
- Three reference plates ship with the repo. **Plate I** (`examples/attention/`, attention as an assay bench) is the model for ideas made of discrete steps and a formula. **Plate II** (`examples/heart/`, the human heart as a double pump) is the model for anything that runs in time: a simulation integrated every frame, continuous flow, phases, and charts redrawn after each cycle. **Plate III** (`examples/grid/`, a power grid in miniature) is the model for electricity, magnetism and energy flows, and for a bench built from free-standing machines rather than bands: a turbine, a generator with a spinning rotor, transformers, pylons and a town. **Plate IV** (`examples/hashmap/`, a hash map as a sorting office) is the model for algorithms and data structures, where the idea is a sequence of discrete operations: each operation (insert, look up, resize) expands into a short list of timed acts (lift, carry, dip to compare, fly every card to a new place), played one after another, so the reader watches the algorithm take each step. Open the closest one first.
- The fastest start is to copy a reference plate: `node scripts/new-plate.mjs <name>` makes `examples/<name>/` from Plate I. Then replace its model, scene and texts. Building from a working plate is quicker and safer than starting blank.