Two new levers on a sin page. `wild[]` renders credited, linked
specimens between the explanation and the citations — first the
argument, then proof people actually publish this, then the sources.
`related[]` cross-links neighbouring sins and is resolved at build, so a
typo fails the build instead of shipping a dead link.
Both arrive with the first specimen: a Hungarian primary graphic whose
three slices read 38/22/19 — 79% — drawn as a full circle, so every
share is inflated by about 1.27x. Measured off the image, the 38% slice
occupies 173.6 degrees, or 48.3% of the pie.
Our published pie sin is about too many slices, so it didn't cover this;
"Pie Slices That Don't Sum to the Whole" is a new severity-5 page whose
before/after is two pies differing only in whether the remainder is
present. That sin is an omission, so `compareNote` replaces the standard
"same numbers, both charts" line.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ULE5RRxdQE1ebwefEd2eCM
The note said the github-pages environment allows deploys only from the
default branch, so switching the default to main should have fixed it.
It didn't — the deploy failed identically, with the annotation "Branch
main is not allowed to deploy to github-pages due to environment
protection rules."
The allow-list is pinned on the environment at creation time and does
not follow the default branch. The fix is in Settings → Environments,
and nothing in the workflow or the branch settings substitutes for it.
Also records that a zero-step deploy failure is always a rejected job
rather than a broken build, and that the environments API is blocked by
the agent proxy so this needs a human.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ULE5RRxdQE1ebwefEd2eCM
The source-request loop paid for itself immediately — two of the five
corrected something rather than confirming it.
The Economist piece settles V1, the riskiest live claim, but our note
had over-claimed: truncating the scale is its *first* example, not one
of "several." Note rewritten to quote her. The same article turned out
to contain a dual-axis chart she caught herself on, now cited.
Datawrapper's color-scale part 1 refuted the assumption behind a queued
sin outright: it makes no argument against rainbow scales and endorses
multi-hue sequential gradients. The rainbow entry is now marked as
having no verified source at all, rather than ample backing.
The dual-axis post independently draws the same line we drew last turn
— of four uses only the alternative-scale case survives, their example
being F against C — and led to two references worth more than the blog
post: the Isenberg et al. study that tested dual-scale charts, and Few's
article working through the cases. Both ship without full metadata
rather than guessed metadata; queued.
Pie and stacked posts gave verbatim support, plus one correction: a
100%-stacked chart has two readable baselines, not one.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ULE5RRxdQE1ebwefEd2eCM
Datawrapper's blog 403s, Medium is unreachable, JSTOR wants a session,
and a search snippet is a paraphrase rather than a source's words. The
failure mode is guessing, or silently writing a weaker page.
docs/source-requests.md now holds a fetch queue with the specific
question each link needs to answer, plus a register of claims already
live on the site that rest on recall rather than a page anyone opened —
starting with the riskiest, an inference about which mistakes the
Economist piece owns up to. docs/sources/ is the drop zone.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ULE5RRxdQE1ebwefEd2eCM
The pie page argued the form was the problem ("asks the reader to
compare angles") and then conceded a narrow exception; the dual-axis
page named the form in its title and rated it severity 5. Both read as
blanket bans, which is not the position — and blanket bans are how
dataviz advice turns into the folklore we're trying to replace with
citations.
The pie page now says outright that the chart type isn't the sin, the
workload is, and keeps the pie for the job it does well. The dual-axis
page is retitled for the actual misuse, drops to severity 4, and gains
a section on when a second axis is legitimate — the test being whether
you chose the alignment yourself.
Adds a severity rubric to CLAUDE.md so this stays consistent: 5 is
reserved for charts with no honest reading, and a form with legitimate
uses caps at 4.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ULE5RRxdQE1ebwefEd2eCM
"Canon" was leaking onto the public site — a nav item, a footer block, a
page title, a set of CSS class names. It was also driving content
decisions it had no business driving: the backlog was ordered around
which references were still unused, which is curation dressed up as
planning.
The page is now /references/, the list is documented as a bibliography
to grow rather than a canon to curate, and the backlog says plainly that
a sin earns a slot by being worth a page — sources are found to support
it, never the reverse.
Adds six sources (Cairo's Truthful Art, Few's Show Me the Numbers, the
Economist's audit of its own charts, Kosara's eagereyes, WTF
Visualizations, Datawrapper's dual-axis piece) and roughly doubles the
citations on the five published sins, to 5-7 each. Two of the new notes
point at sources that complicate our own position rather than back it.
The Economist essay ships without a URL rather than a guessed one.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ULE5RRxdQE1ebwefEd2eCM
Writes two sins off the backlog. The inverted y-axis is the egregious
one: the fill hangs from the top and the line descends while the values
climb, with every element individually defensible. Aspect ratio is the
quiet one: same twelve numbers, same y-range, only the shape of the box
changes.
Adds Cleveland, McGill & McGill 1988 to the canon — banking to 45 comes
from the shape-parameter paper, not the 1984 ranking already cited, so
citing the latter for it would have misattributed the claim.
Also renames sin slugs to match their retitled pages, and rewrites the
summaries that had started echoing those titles.
Gives line-chart points their mark color explicitly; "point": true was
falling back to Vega's default blue on a red or green line.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ULE5RRxdQE1ebwefEd2eCM
Titles are scanned in the gallery and recognized in a link, so they
should say what the sin is rather than pun about it. Retitles the three
published sins and the backlog's working titles, and records the rule in
CLAUDE.md: the title names the problem, the poke carries the voice.
Filenames are untouched, so existing URLs still resolve.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ULE5RRxdQE1ebwefEd2eCM
Its chart-type "what to consider" posts and four-part color-scale series
cover ground nothing else in the canon does. Adds a backlog entry it is
the leading authority on (stacked columns, where only the bottom series
shares a baseline), and closes the citation gap on the rainbow-color-scale
sin — that one now waits only on our own sequential-ramp validation.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ULE5RRxdQE1ebwefEd2eCM
Ranks the next six sins by working backwards from the references we
already vouch for: six of fifteen canon entries were uncited, and each
idle one points at a sin worth writing. Also records the candidates our
build-time Vega-Lite pipeline can't prove honestly yet, so we stop
rediscovering them.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01ULE5RRxdQE1ebwefEd2eCM
Capture the tacit decisions from this session so they survive: the
product thesis, voice/poke rules, the same-data proof rule, how to add a
sin, design/rendering conventions, OG-card satori gotchas, and the
deploy default-branch gotcha.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
- Rewrite pokes to name the sin itself, not our sample's exact numbers
(a visitor didn't "start at 90" — they mis-set the baseline)
- Remove the "cited:" line from the OG card; citations stay on the page
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
Link previews are the funnel for a "send the link" site, so give every sin
a share-optimized card.
- og/twitter meta tags on every page (poke as description, canonical URL,
summary_large_image)
- Per-sin 1200x630 card generated at build: the poke, the before/after
charts (uniform height so tall vconcat charts fit), severity meter,
category, and short citations — composed with satori, rasterized with
@resvg/resvg-js, no browser needed
- Default brand card for the homepage and canon
- Shared chart pipeline extracted to lib/renderChart.ts (used by both the
on-page component and the card generator)
- Bundle three IBM Plex TTF weights for the rasterizer
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
The public site (and DOM) shouldn't advertise our tooling choices:
- Drop the design-system credit and typeface note from the footer; replace
with visitor-useful copy ("Built to be sent" / "The canon")
- Remove the external-inspiration reference from the homepage lede
- Neutralize the meta description
- Rename the `cds-` CSS class prefix to `site-`
- Scrub internal names from source comments and the chart theme variable
Functional font-family references are kept; only the advertising is removed.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
Make each sin a self-contained page you send instead of re-explaining:
- Per-sin "poke" one-liner (the shareable callout)
- Citations system: a canonical bibliography (src/lib/references.ts) of the
field's giants — Munzner, Knaflic, Tufte, Cairo, Few, Cleveland & McGill,
Wilke, Healy, Calling Bullshit, data-to-viz, Junk Charts, Spurious
Correlations, FT Visual Vocabulary — cited per sin with a relevance note
- "Don't take our word for it" receipts block on each sin
- /canon page: the full annotated bibliography
- Share control: copy-link "send them the receipt" (progressive enhancement)
- Restructured sin page: poke -> proof -> why -> receipts -> share
- Header nav (Sins / Canon); homepage reframed to the "send the link" mission
Also fix the truncated-axis bad chart: clamp the [90,100] domain so the bar
baseline doesn't overflow thousands of pixels off-canvas.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
Adopt Carbon at the design-token level (the component libraries ship JS and
target app UIs; this is a static content site):
- IBM Plex Sans/Mono, self-hosted via @fontsource (no external requests)
- Carbon color tokens + layered White / Gray 100 themes
- 8px spacing scale, productive/expressive type, motion tokens, square
geometry, 2px focus ring
- UI-shell header, tile grid, Carbon tags, geometric severity meter,
breadcrumb, colophon crediting Carbon
- Charts themed with IBM Plex + Carbon's data-visualization palette
(validated colorblind-safe/contrast) on a fixed light canvas so the
build-time SVG stays legible in both themes
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
The Actions integration token cannot create the Pages site
("Resource not accessible by integration"), so enablement must be done
once in repo settings. Deploy works normally after that.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8
Set up the static-site tech stack: Astro 5 with Markdown content
collections, Vega-Lite specs rendered to static SVG at build time
(zero client JS), plain scoped CSS, and a GitHub Pages deploy workflow.
Includes three sample sins (truncated y-axis, dual-axis deception,
pie chart overload), each with a bad and fixed chart spec, plus a
gallery index and per-sin detail pages.
Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XPEvmMbac2fCvKXpQcovj8