Creating interactive data visualisations using d3.js. This skill should be used when creating custom charts, graphs, network diagrams, geographic visualisations, or any complex SVG-based data visualisation that requires fine-grained control over visual elements, transitions, or interactions. Use this for bespoke visualisations beyond standard charting libraries, whether in React, Vue, Svelte, vanilla JavaScript, or any other environment.
Install with Tessl CLI
npx tessl i github:Dokhacgiakhoa/antigravity-ide --skill agent-d3js-skillOverall
score
62%
Does it follow best practices?
If you maintain this skill, you can automatically optimize it using the tessl CLI to improve its score:
npx tessl skill review --optimize ./path/to/skillValidation for skill structure
Discovery
100%Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.
This is a strong skill description that excels across all dimensions. It clearly specifies the technology (d3.js), lists concrete visualization types, provides explicit 'Use when' guidance, and distinguishes itself from standard charting libraries. The description is comprehensive yet concise, using proper third-person voice throughout.
| Dimension | Reasoning | Score |
|---|---|---|
Specificity | Lists multiple specific concrete actions: 'custom charts, graphs, network diagrams, geographic visualisations, complex SVG-based data visualisation' with additional specifics about 'fine-grained control over visual elements, transitions, or interactions'. | 3 / 3 |
Completeness | Clearly answers both what ('Creating interactive data visualisations using d3.js') and when ('should be used when creating custom charts, graphs...', 'Use this for bespoke visualisations beyond standard charting libraries'). Has explicit 'Use when' guidance. | 3 / 3 |
Trigger Term Quality | Excellent coverage of natural terms users would say: 'd3.js', 'charts', 'graphs', 'network diagrams', 'geographic visualisations', 'SVG', 'data visualisation', plus framework mentions (React, Vue, Svelte, vanilla JavaScript) that users might reference. | 3 / 3 |
Distinctiveness Conflict Risk | Clear niche with distinct triggers - specifically targets d3.js and 'bespoke visualisations beyond standard charting libraries', which distinguishes it from generic charting skills. The SVG-based and fine-grained control language further narrows the scope. | 3 / 3 |
Total | 12 / 12 Passed |
Implementation
22%Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.
This skill functions primarily as a table of contents rather than a functional skill document. It lacks any executable code, concrete examples, or workflow guidance in the main file. While the progressive disclosure structure with sub-skills is reasonable, the main SKILL.md provides almost no actionable value on its own.
Suggestions
Add a 'Quick start' section with a minimal executable D3.js example (e.g., a simple bar chart in 10-15 lines) that users can immediately run
Complete the 'Core workflow' section with numbered steps explaining the typical sequence for creating a D3 visualization
Organize the sub-skills into logical categories (Setup, Chart Types, Interactions, Scales, etc.) rather than a flat numbered list
Remove the explanatory text about what D3.js is and focus on actionable guidance
| Dimension | Reasoning | Score |
|---|---|---|
Conciseness | The overview section contains some unnecessary explanation about what D3.js is ('Data-Driven Documents') that Claude already knows. The 'When to use' section is helpful but could be more concise. | 2 / 3 |
Actionability | The skill body contains no executable code, no concrete examples, and no specific commands. It only provides a list of links to sub-skills without any actionable guidance in the main file itself. | 1 / 3 |
Workflow Clarity | The 'Core workflow' section header exists but has no content beneath it. The numbered sub-skills suggest a sequence but there's no explanation of how they connect or when to use which modules. | 1 / 3 |
Progressive Disclosure | Good use of sub-skills for detailed content, but the main file lacks a quick-start example or any substantive overview content. The links are one-level deep which is good, but the organization is just a flat list without clear categorization or navigation guidance. | 2 / 3 |
Total | 6 / 12 Passed |
Validation
91%Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.
Validation — 10 / 11 Passed
Validation for skill structure
| Criteria | Description | Result |
|---|---|---|
frontmatter_unknown_keys | Unknown frontmatter key(s) found; consider removing or moving to metadata | Warning |
Total | 10 / 11 Passed | |
Table of Contents
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.