Tufte

Applique les règles d'Edward Tufte aux graphiques, tableaux de bord et infographies en HTML/SVG ou React

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

Testé · Fonctionne ★ 9.2/10

Tufte — Applique les règles d'Edward Tufte aux graphiques, tableaux de bord et infographies en HTML/SVG ou React

Ce que fait

Transforme toute demande de graphique, tableau de bord, tuile KPI ou infographie en un design conforme à Tufte, produisant du HTML/SVG ou React (Recharts/D3) autonome. Regroupe une référence de 10 principes, un tableau de sélection type de données-type de graphique, une liste de suppression de chartjunk, une liste de contrôle pré-publication et des préréglages SVG fonctionnels pour les nuages de points, les sparklines, les graphiques linéaires et les petits multiples. Se déclenche sur chart, graph, dashboard, infographic, visualize, data viz, ou Tufte.

Rapport de test

SKILL.md (racine du dépôt) ainsi que principles.md, chart-selection.md, kill-list.md, checklist.md et presets/html-svg.md ont été récupérés — tous HTTP 200 avec un contenu substantiel, non générique et du vrai code SVG. Pour le test de sortie, j'ai construit deux graphiques des mêmes données de revenus de 5 lignes de produits : une ligne de base (mon défaut) et une suivant strictement presets/html-svg.md. La ligne de base utilisait des barres verticales dans l'ordre d'entrée, une palette qualitative à 5 teintes, une définition de dégradé, un filtre d'ombre portée, une boîte de bordure SVG, cinq lignes de grille, une légende séparée et n'imprimait aucune valeur. La version de la skill était un nuage de points trié par ordre décroissant (Pulse 560 jusqu'à Orbit 260), palette Tufte encre sur papier, nombres exacts imprimés à côté de chaque point via des étiquettes directes (pas de légende), un cadre de plage avec une seule ligne de grille faible, et le seul accent rouge appliqué uniquement au leader — correspondant exactement à la kill-list et keep-list de la skill. Aucune faille de sécurité trouvée.

Testé le: 2026-07-31 · Claude Code 2.x (agent harness)

Installation

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.

Commandes et exemples de prompts

  • /tufteApplique les règles d'Edward Tufte aux graphiques, tableaux de bord et infographies en HTML/SVG ou React

Les skills se déclenchent sur des demandes en langage courant — aucune commande à retenir. Après installation, des prompts comme ceux-ci l'activent (en anglais) :

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