The Human Heart , Anatomy and Blood Flow Direction Figure 41.1 , The Human Heart , Anatomy and Blood Flow Direction

An Illustration Diagram is a graphic that pairs a visual representation of an object, system, or concept with structured annotations , labels, callouts, leader lines, legends, and sometimes enlarged cross-sections. It is not a statistical chart: no data is plotted on axes. Its purpose is explanatory rather than comparative. The perceptual mechanism it exploits is spatial correspondence: a label attached to a specific location on the image inherits the visual context of that location, allowing complex multi-part systems to be understood simultaneously rather than sequentially.

The human heart is a canonical subject for illustration diagrams: it has discrete named structures, directional flow logic, and meaningful spatial relationships between parts that cannot be communicated through any tabular or statistical format. A written list of chambers and valves conveys the same facts but severs their spatial relationships , the reader cannot infer that the left ventricle wall is thicker because it pumps against higher systemic pressure without seeing the cross-section. The illustration diagram makes that inference automatic.

A flowchart could represent the sequence of blood flow , right atrium to right ventricle to pulmonary artery and so on , but it would lose all spatial information about where each chamber sits relative to the others. A viewer reading a flowchart of cardiac circulation cannot develop intuition about why the pulmonary and systemic circuits are physically separate, or how the septum prevents mixing. A table of structure names and descriptions preserves the vocabulary but destroys the geometry.

FRAMEWORK FT Visual Vocabulary category: Concepts / How things work , "Show mechanisms, processes, and objects where spatial arrangement carries the meaning." The one design decision worth knowing: callout dots are placed at the anatomical boundary of each structure, not at its centroid , boundary placement mimics how a real dissection label is pinned, and tells the viewer precisely which edge or wall is being named rather than gesturing at a region.

Paste this into Claude Code to generate a working version of this chart, plus its data file. The result will not be a perfect replica , the goal is that the reader can run the prompt, get a chart of this type, and read its source. Generate a complete, self-contained illustration diagram in D3 v7. Two files:

The ideas in this chapter didn't appear from nowhere. Otto Neurath invented the Isotype pictogram system in 1920s Vienna , a visual language of stick-figure icons that could communicate statistical and social information across languages and literacy levels. His goal was an internationally legible visual language for working-class audiences. Otto Neurath, circa 1930. AI-generated portrait based on a public domain photograph (Wikimedia Commons).

The ideas in this chapter didn't appear from nowhere. Otto Neurath invented the Isotype pictogram system in 1920s Vienna , a visual language of stick-figure icons that could communicate statistical and social information across languages and literacy levels. His goal was an internationally legible visual language for working-class audiences. Otto Neurath, circa 1930. AI-generated portrait based on a public domain photograph (Wikimedia Commons).