CtrlK
BlogDocsLog inGet started
Tessl Logo

claude-d3js-skill

This skill provides guidance for creating sophisticated, interactive data visualisations using d3.js.

35

Quality

32%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./plugins/antigravity-bundle-data-analytics/skills/claude-d3js-skill/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

42%Scale 1-3

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

The skill provides highly actionable, executable d3.js code examples covering many visualization types, which is its primary strength. However, it is severely bloated — most of the chart-specific implementations and the scales reference should live in the referenced files (d3-patterns.md, scale-reference.md) rather than inline, and Claude already knows basic d3 patterns. The content would benefit enormously from being restructured as a concise overview with pointers to detailed reference files.

Suggestions

Move complete chart implementations (chord diagram, heatmap, bar chart, etc.) into the referenced `d3-patterns.md` file and keep only a single representative example inline with pointers to the rest.

Move the scales reference section entirely into the referenced `scale-reference.md` file, keeping at most a 2-3 line summary with a link.

Remove explanations of what d3.js is and when to use it — Claude knows this. Start directly with the integration patterns and structure.

Create the actual bundle files (references/ and assets/) so the progressive disclosure structure works in practice, not just in theory.

DimensionReasoningScore

Conciseness

The skill is extremely verbose at ~500+ lines, with extensive inline code examples for common chart types (bar, line, scatter, chord, heatmap, pie, force-directed) that Claude already knows how to create. The scales reference section duplicates d3 API documentation. Much of this content could be in referenced files rather than inline.

1 / 3

Actionability

The code examples are fully executable, copy-paste ready, and cover a wide range of visualization types with complete implementations including data validation, scales, axes, and element binding. Data format expectations are clearly documented with comments.

3 / 3

Workflow Clarity

The 4-step core workflow (setup, choose pattern, structure code, responsive sizing) provides a clear sequence, but there are no validation checkpoints or feedback loops. For a visualization skill this is less critical than for destructive operations, but there's no guidance on verifying output correctness or debugging rendered output.

2 / 3

Progressive Disclosure

Despite referencing external files (references/ and assets/ directories), the skill dumps massive amounts of content inline that should be in those referenced files — complete chart implementations, scales reference, colour schemes, and interactivity patterns are all in the main SKILL.md rather than being split into the referenced materials. No bundle files were provided, suggesting the references may not even exist.

1 / 3

Total

7

/

12

Passed

Description

22%Scale 1-3

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

The description is too vague and lacks concrete actions, explicit trigger guidance, and natural keyword coverage. While mentioning 'd3.js' provides some distinctiveness, the description reads more like a tagline than a functional skill selector. It would benefit significantly from listing specific capabilities and adding a 'Use when...' clause.

Suggestions

Add a 'Use when...' clause with trigger terms like 'Use when the user asks about d3, d3.js, SVG charts, interactive graphs, custom data visualizations, or building charts from scratch'.

List specific concrete actions such as 'Creates bar charts, line graphs, scatter plots, force-directed network diagrams, choropleth maps, and animated transitions using d3.js'.

Include common user-facing keywords and file types like 'charts', 'graphs', 'plots', 'SVG', 'D3', 'interactive dashboard', and 'data-driven documents'.

DimensionReasoningScore

Specificity

The description says 'creating sophisticated, interactive data visualisations' which is vague and uses buzzword-like language ('sophisticated'). It does not list concrete actions like 'create bar charts, line graphs, scatter plots, force-directed graphs'.

1 / 3

Completeness

The description partially addresses 'what' (creating data visualisations with d3.js) but lacks any explicit 'when' clause or trigger guidance. Per the rubric, a missing 'Use when...' clause caps completeness at 2, and the 'what' is also weak, so this scores a 1.

1 / 3

Trigger Term Quality

It includes 'd3.js' and 'data visualisations' which are relevant trigger terms, but misses common variations users might say like 'charts', 'graphs', 'plots', 'SVG', 'd3', 'interactive chart', or specific chart types.

2 / 3

Distinctiveness Conflict Risk

Mentioning 'd3.js' specifically helps distinguish it from general charting or visualization skills, but 'data visualisations' is broad enough to overlap with skills for other charting libraries like Chart.js, Plotly, or Vega.

2 / 3

Total

6

/

12

Passed

Validation

81%

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 9 / 11 Passed

Validation for skill structure

CriteriaDescriptionResult

skill_md_line_count

SKILL.md is long (829 lines); consider splitting into references/ and linking

Warning

frontmatter_unknown_keys

Unknown frontmatter key(s) found; consider removing or moving to metadata

Warning

Total

9

/

11

Passed

Repository
popey/claude-code-skills
Reviewed

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.