build-dashboard

Build an interactive HTML dashboard — a Data Schematic — with charts, filters, and tables. Use when creating a dashboard, an executive overview with KPI cards, turning query results into a shareable self-contained report, building a team monitoring snapshot, or needing multiple charts with filters in one browser-openable file.

Quality

77%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Low

Low-risk findings worth noting

Fix and improve this skill with Tessl

tessl review fix ./.claude/skills/build-dashboard/SKILL.md

Quality

Content

71%Weight 40%Scale 1-5

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

A highly actionable, code-rich skill with a clear sequenced workflow and a render-verification step. Its main weaknesses are length/inline content that could be externalized into reference files and the absence of explicit error-recovery feedback loops.

Suggestions

Move the full CSS styling system and complete Chart.js integration patterns into separate reference files (e.g. references/styling.md, references/chart-patterns.md) and link them one level deep from SKILL.md to improve progressive disclosure and reduce token load.

Add an explicit validation/feedback loop after Step 7 (e.g. 'If the file does not render, check the browser console for JS errors and verify the CDN script integrity hashes'), turning the render check into a real error-recovery checkpoint.

Trim or consolidate the repeated Chart.js option blocks and inline CSS, keeping only the minimal canonical patterns in SKILL.md, to tighten conciseness without losing actionability.

Dimension	Reasoning	Score
Conciseness	The ~945-line body avoids explaining concepts Claude already knows and is mostly concrete code, but the large volume of inline CSS and repeated Chart.js patterns could be tightened or externalized, fitting 'mostly efficient but could be tightened'.	3 / 5
Actionability	Provides fully executable, copy-paste-ready code covering the common cases — a complete base HTML template, createLineChart/createBarChart/createDoughnutChart functions, filter logic, sortable table, KPI rendering, and qsv commands — matching the top anchor.	5 / 5
Workflow Clarity	A clear 7-step numbered workflow with a render-confirmation checkpoint ('Open it in the browser', 'Confirm it renders correctly'), but it lacks explicit error-recovery feedback loops, fitting 'clear sequence with most checkpoints present; minor validation gaps'.	4 / 5
Progressive Disclosure	Well-organized via section headers, but with no bundle files the entire CSS styling system and complete Chart.js patterns are inlined in one ~945-line file rather than split into one-level-deep references, fitting 'some structure but content that should be separate is inline'.	3 / 5
	Total	15 / 20 Passed

Description

83%Weight 40%Scale 1-5

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

A strong description that explicitly states both capability and trigger conditions in third person with concrete, natural-language triggers. It is comprehensive on completeness and specificity with only minor synonym/overlap gaps.

Dimension	Reasoning	Score
Specificity	Names the domain and several concrete artifacts ('charts, filters, and tables', 'KPI cards', 'self-contained report'), listing multiple specific actions with only minor coverage gaps, which fits the 'lists several specific actions' anchor better than the fully comprehensive 5.	4 / 5
Completeness	Explicitly answers both what ('Build an interactive HTML dashboard ... with charts, filters, and tables') and when ('Use when creating a dashboard, an executive overview ...'), with concrete trigger phrases matching the top anchor exactly.	5 / 5
Trigger Term Quality	Strong natural trigger phrases ('creating a dashboard', 'executive overview with KPI cards', 'team monitoring snapshot', 'multiple charts with filters in one browser-openable file') with good synonym coverage, but missing a few natural variations, fitting the 'good keyword coverage; a few natural terms missing' anchor.	4 / 5
Distinctiveness Conflict Risk	The 'self-contained', 'one browser-openable file', and 'Data Schematic' framing gives it a clear niche with only minor overlap risk against general reporting skills, fitting 'mostly distinct; minor overlap risk' rather than the minimal-risk 5.	4 / 5
	Total	17 / 20 Passed

Validation

87%

Warnings & errors only

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

Validation — 14 / 16 Passed

Validation for skill structure

Criteria	Description	Result
skill_md_line_count	SKILL.md is long (951 lines); consider splitting into references/ and linking	Warning
frontmatter_unknown_keys	Unknown frontmatter key(s) found; consider removing or moving to metadata	Warning

	Total	14 / 16 Passed

Repository: dathere/qsv
Path: .claude/skills/build-dashboard/SKILL.md
Commit: a46782a

Reviewed: about 2 hours ago

Table of Contents

Discovery Implementation Validation

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.