CtrlK
BlogDocsLog inGet started
Tessl Logo

frame-data-chart-nyt

NYT-newsroom typography, staggered reveal animation, and editorial-grade charts (line, bar, or range band).

62

Quality

74%

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 ./skills/frame-data-chart-nyt/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

86%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.

The body is lean, concrete, and well-structured, delivering an implementable spec with exact values and clear constraints. Its main gap is the absence of a complete copy-paste HTML/SVG example and an explicit build/verify sequence.

Suggestions

Include a minimal complete copy-paste HTML/SVG skeleton (under 80 lines inline, as the spec recommends) so the common single-line-chart case is runnable immediately.

Add a short explicit build sequence (e.g., 1. set canvas, 2. render chart SVG, 3. apply reveal animation, 4. verify prefers-reduced-motion fallback) to make the workflow unambiguous.

Add a one-line verification reminder to confirm data labels and accent color render correctly against the chosen light/dark background.

DimensionReasoningScore

Conciseness

A dense, terse spec with exact values ('#f7f5ee', '11px uppercase letterspace 0.14em', '5.6vw') and no padding explaining concepts Claude already knows; every line carries concrete instruction.

5 / 5

Actionability

Provides concrete, implementable guidance — exact colors, font stacks, px values, animation timings, and the '<text class="annot">2024 · 412M</text>' label format — but lacks a complete copy-paste HTML/SVG template covering a common case.

4 / 5

Workflow Clarity

Well-organized into canvas → layout → design-details sections with a logical build order and a prefers-reduced-motion fallback noted, but it is not an explicit sequenced workflow and lacks a final verify/review checkpoint.

4 / 5

Progressive Disclosure

A compact (~24-line) single-file spec with clear section headers and no need for external references, meeting the simple-skill exception for well-organized content.

5 / 5

Total

18

/

20

Passed

Description

62%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.

The description conveys a distinct, well-scoped niche with concrete features but lacks an explicit usage trigger and leans on design jargon over natural user phrases. Adding a 'Use when...' clause with everyday terms like 'data visualization' or 'graph' would raise completeness and trigger quality.

Suggestions

Append an explicit 'Use when...' clause naming concrete user scenarios (e.g., 'Use when creating data visualizations, editorial charts, or graph graphics for video frames').

Swap designer jargon for natural terms users actually say — add 'data visualization', 'graph', and 'infographic' alongside 'charts' to broaden trigger coverage.

Reframe features as actions (e.g., 'Renders', 'Animates', 'Styles') to shift from describing outputs to describing capabilities.

DimensionReasoningScore

Specificity

Names several concrete features — 'NYT-newsroom typography', 'staggered reveal animation', 'editorial-grade charts (line, bar, or range band)' — but they are described as outputs rather than actions and 'editorial-grade' is mildly subjective, leaving a minor gap versus fully comprehensive action coverage.

4 / 5

Completeness

Gives a clear 'what' but contains no explicit 'Use when...' trigger clause, so per the missing-trigger guidance completeness is capped at 3 with 'when' only weakly implied.

3 / 5

Trigger Term Quality

Includes some relevant keywords ('charts', 'line', 'bar') but leans on designer jargon ('staggered reveal animation', 'NYT-newsroom typography') and omits common user phrases like 'data visualization', 'graph', or 'infographic'.

3 / 5

Distinctiveness Conflict Risk

The NYT-editorial chart niche is highly specific and unlikely to overlap with other skills, giving it a clear distinct trigger profile with minimal conflict risk.

5 / 5

Total

15

/

20

Passed

Validation

93%

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

Validation15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

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

Warning

Total

15

/

16

Passed

Repository
nexu-io/open-design
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.