# Explorable explanations · Explaining with interaction

<!-- https://learn-ui.com/chapters/explaining/explorable-explanations -->

[ciechanow.ski](https://ciechanow.ski) has no about page: a name, a blog, an [archive](https://ciechanow.ski/archives/), and links to Patreon, X, Instagram, e-mail, and RSS. The archive holds seventeen interactive articles from 2019 to 2024 and five “earlier articles” from 2014 on iOS and graphics programming (Mesh Transforms, Exposing NSDictionary, Exposing NSMutableArray, Drawing Bezier Curves, Exploring GPGPU on iOS). Maggie Appleton’s [A Collection of Design Engineers](https://maggieappleton.com/design-engineers) lists him tenth, “Not a Design Engineer as a profession, but a good example of blending design and engineering for educational content.” The genre is called explorable explanations: the reader operates the subject instead of reading about it.

### The demo comes first

Every one of the seventeen opens with a working model and an instruction to touch it. [Mechanical Watch](https://ciechanow.ski/mechanical-watch/) (May 2022): “You can drag the device around to change your viewing angle, and you can use the slider to peek at what’s going on inside.” [Moon](https://ciechanow.ski/moon/) (December 2024) opens the same way, with the slider controlling date and time.

The explanation then ramps from simple to real: GPS will “step-by-step improve upon it,” Cameras and Lenses builds a camera “from first principles,” Bicycle starts with a wooden box and a force slider, Exposing Floating Point starts “at the shallow end of the pool.” He says when the model lies: Sound “simplifies things a little,” Bicycle removes friction and air resistance, and Lights and Shadows keeps a flawed ray analogy because “despite its flaws, it will serve us as a valuable tool.”

Source

Article list and dates are from the archive page; opening lines from the first screens of Mechanical Watch and Moon; ramp quotes from GPS, Cameras and Lenses, Bicycle, and Exposing Floating Point.

### What your hands are asked to do

The task varies by subject. In [Gears](https://ciechanow.ski/gears/) (February 2020) a slider sets a desk fan’s speed, then you scrub time on a disc while painted points trace their paths. In [Curves and Surfaces](https://ciechanow.ski/curves-and-surfaces/) you drag control points and tap one to see its influence, “the redder the section of the curve the more influenced it is by that control point.” In [Airfoil](https://ciechanow.ski/airfoil/) you tap a flow to drop a marker.

Moon’s “cosmic playground” lets you aim a planet’s velocity arrow and release it with predicted trajectories drawn. [Sound](https://ciechanow.ski/sound/) has keyboards played with the W, E, and R keys. In [GPS](https://ciechanow.ski/gps/) you move a yellow figurine around three landmarks while its area of uncertainty grows, on the way to **trilateration** (The process of calculating a location of a point using measurement of distances is called trilateration.). Color Spaces refuses the textbook opening: “A dry definition of a color space is not a good way to kick things off.”

The subjects range widely; the method does not. The run starts in January 2019 with [Exposing Floating Point](https://ciechanow.ski/exposing-floating-point/) (companion to his tool float.exposed), then [Color Spaces](https://ciechanow.ski/color-spaces/), Alpha Compositing, Earth and Sun, and Tesseract; 2020 Gears, [Lights and Shadows](https://ciechanow.ski/lights-and-shadows/), and [Cameras and Lenses](https://ciechanow.ski/cameras-and-lenses/); 2021 Internal Combustion Engine, Naval Architecture, and Curves and Surfaces; 2022 GPS, Mechanical Watch, and Sound; 2023 [Bicycle](https://ciechanow.ski/bicycle/); 2024 Airfoil and Moon. The first three are a graphics programmer’s concerns, like the 2014 posts; after that the subjects are machines, natural phenomena, and geometry, each given a model you can hold, a promise of scope, and a slow build.

### Legibility is engineered

Your hands do the noticing: “Notice that as soon as you let go of the arbor by releasing the slider, the mainspring will turn the arbor right back.” Airfoil scales arrow lengths to stop overlap but keeps them proportional, so twice as long is twice as fast. Moon toggles between real and ten-times-larger body sizes, Sound slows time and flashes colliding particles red, and numbers are waved away when they do not matter.

He also respects the reader’s machine: animations pause globally “if you find them distracting, or if you want to save power,” units switch between imperial and metric, copy swaps between click and tap, and Moon uses geolocation only “If your browser allows it.” Every article ends in Final Words that hand the subject back to daily life (bicycle riders will “conceptualize some of those invisible forces”) and a line pointing at [Patreon](https://www.patreon.com/ciechanowski), which in August 2026 listed 543 paid members at tiers “Starting at $3 /article.” Airfoil’s close justifies the genre: “by seeing how all the pieces fit together, you’ll find the whole thing even more magical.”

### Hand them the controls

Gears is the article to start with if you want the method small: from **angular velocity** (Angular velocity describes how quickly an object rotates relative to some point.) through transmission and torque to the shape of a tooth. The figure below is this book’s homage in that spirit, not a reproduction: two gears, two tooth counts, one input speed. Drag the tooth sliders and watch the ratio follow; give the driven gear fewer teeth than the driver and it outruns the input. The model is two lines, and the rest is controls and drawing.

> Figure. TypeScriptIllustration

> Figure 1. A gear pair you can change. Drag the tooth sliders and watch the ratio follow the tooth count: every tooth that passes the contact point on one gear moves exactly one tooth on the other, so the gear with more teeth turns slower. Give the driven gear fewer teeth than the driver and it spins faster than the input. The spoke on each gear marks one revolution.Illustrative numbers

A diagram of two gears with an arrow tells you the ratio is a fact; the figure lets you find it. That is why this book’s figures are meant to be operated, with the prose saying what to do and what to notice, as his articles do. Next time you explain a behaviour, notice whether you are drawing a picture of the answer or handing over the controls. A slider, a handle, and a number that responds teach what a paragraph cannot: a model, a set of controls, and a promise that what you see is true enough to learn from.
