Tufte

Applica le regole di Edward Tufte a grafici, dashboard e infografiche in HTML/SVG o React

di aref-vc · aref-vc/tufte-claude-skill

Promosso ★ 9.2/10

Tufte — Applica le regole di Edward Tufte a grafici, dashboard e infografiche in HTML/SVG o React

Cosa fa

Trasforma qualsiasi richiesta di grafico, dashboard, riquadro KPI o infografica in un design conforme a Tufte, producendo HTML/SVG o React (Recharts/D3) autonomi. Include un riferimento a 10 principi, una tabella di selezione da dati a tipo di grafico, una kill-list di chartjunk, una checklist pre-pubblicazione e preset SVG funzionanti per dot plot, sparkline, grafici a linee e small multiples. Si attiva su chart, graph, dashboard, infographic, visualize, data viz o Tufte.

Rapporto di test

Recuperato SKILL.md (root del repo) più principles.md, chart-selection.md, kill-list.md, checklist.md e presets/html-svg.md — tutti HTTP 200 con contenuto sostanziale, non placeholder e codice SVG reale. Per il test di output ho costruito due grafici degli stessi dati di ricavo di 5 linee di prodotto: un baseline (il mio predefinito) e uno che seguiva strettamente presets/html-svg.md. Il baseline usava barre verticali nell'ordine di input, una palette qualitativa a 5 tonalità, una definizione di gradiente, un filtro drop-shadow, una casella di bordo SVG, cinque griglie, una legenda separata e non stampava valori. La versione della skill era un dot plot ordinato in modo decrescente (Pulse 560 fino a Orbit 260), palette Tufte inchiostro su carta, numeri esatti stampati accanto a ogni punto tramite etichette dirette (nessuna legenda), un range frame con una debole griglia e l'unico accento rosso applicato solo al leader — corrispondente esattamente alla kill-list e keep-list della skill. Nessun problema di sicurezza trovato.

Testato il: 2026-07-31 · Claude Code 2.x (agent harness)

Installazione

git clone --depth 1 https://github.com/aref-vc/tufte-claude-skill.git /tmp/tufte-src
mkdir -p ~/.claude/skills/tufte
cp -R /tmp/tufte-src/. ~/.claude/skills/tufte/
# SKILL.md is at the repo root; the copy above places it at ~/.claude/skills/tufte/SKILL.md
# No external deps, API keys, or scripts. Reference files (principles.md, chart-selection.md,
# kill-list.md, checklist.md, presets/*.md) and assets are read on demand by the skill body.

Comandi e prompt di esempio

  • /tufteApplica le regole di Edward Tufte a grafici, dashboard e infografiche in HTML/SVG o React

Gli skill si attivano con richieste in linguaggio naturale, senza comandi da ricordare. Dopo l'installazione, prompt come questi lo attivano (in inglese):

  • Critique this chart using Tufte's principles
  • Redesign this dashboard to cut chartjunk
  • Build a Tufte-style sparkline table