CtrlK
BlogDocsLog inGet started
Tessl Logo

social-spotify-card

Spotify Now Playing-style card with album art, progress bar, and playback controls, suited to video overlays or personal homepages.

67

Quality

81%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

SecuritybySnyk

Low

Low-risk findings worth noting

SKILL.md
Quality
Evals
Security

Quality

Content

92%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 a tight, well-structured, highly concrete design spec that assumes Claude's competence and needs no external references; its main gap is the absence of a complete executable HTML code block and the missing referenced index.html bundle.

Suggestions

Include one complete single-file HTML/CSS code block so the card is copy-paste ready rather than assembled from specs.

Provide the referenced index.html bundle file (the frontmatter declares preview.entry: index.html) or remove the dangling reference.

Add a brief verification note (e.g. confirm the card renders at both 1280×720 and 600×200, and that prefers-reduced-motion disables the equalizer animation) to make the build-then-check loop explicit.

DimensionReasoningScore

Conciseness

A lean spec sheet of concrete values (colors, px sizes, CSS gradients, SVG icons) with no padding or explanation of concepts Claude already knows; every line carries build-relevant detail.

5 / 5

Actionability

Provides highly concrete, actionable guidance (exact hex codes, size ranges, structural layout, inline-SVG icons, @keyframes) but ships no complete copy-paste HTML/CSS code block, and the referenced index.html bundle file does not exist.

4 / 5

Workflow Clarity

A simple single-purpose template skill whose single action (produce a single-file HTML card matching the spec) is unambiguous; the section order (canvas → structure → fonts → details) reads as a build sequence, and no destructive/batch validation is required.

5 / 5

Progressive Disclosure

Under 50 lines with no external references needed and no bundle files present; content is well-organized into clearly labeled sections (模板, 意图, 画布, 卡片结构, 字体, 设计细节), satisfying the simple-skill exception.

5 / 5

Total

19

/

20

Passed

Description

70%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 is concrete and distinctive, naming specific card features and target surfaces, but it lacks an explicit "Use when..." trigger clause, leaving the activation condition only weakly implied.

Suggestions

Add an explicit trigger clause such as "Use when the user wants a Spotify Now Playing-style card for a video overlay or personal homepage."

Include a few natural synonyms (e.g. "now-playing widget", "music card") to broaden trigger-term coverage.

Frame the feature list as concrete actions the skill performs (e.g. "Renders a ... card with ...") rather than only describing the artifact.

DimensionReasoningScore

Specificity

Names the artifact and several concrete components — "album art, progress bar, and playback controls" — plus target surfaces ("video overlays or personal homepages"), giving specific feature coverage rather than vague language.

4 / 5

Completeness

The "what" is clear (a Now Playing-style card with listed features), but there is no explicit "Use when..." trigger clause; the "suited to video overlays or personal homepages" phrase only weakly implies when, so per the guideline completeness is capped at 3.

3 / 5

Trigger Term Quality

Includes natural terms a user would say ("Spotify Now Playing-style card", "album art", "progress bar", "video overlays", "personal homepages") with good keyword coverage; a few natural synonyms (e.g. "music card", "now-playing widget") are absent.

4 / 5

Distinctiveness Conflict Risk

"Spotify Now Playing-style card" carves a clear niche with distinct triggers (Spotify, now-playing, card) and minimal overlap risk with other skills.

5 / 5

Total

16

/

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.