animejs-animation

Advanced JavaScript animation library skill for creating complex, high-performance web animations.

Quality

55%

Does it follow best practices?

Run evals on this skill

Adds up to 20 points to the overall score

View guide

Securityby

Passed

No findings from the security scan

Fix and improve this skill with Tessl

tessl review fix ./skills/animejs-animation/SKILL.md

Quality

Content

61%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 provides genuinely actionable Anime.js guidance with a solid executable example and a clear workflow. Its weaknesses are hype-language padding, a missing validation step in the workflow, and an SVG animation use case that is advertised but never shown. Structure and progressive disclosure are appropriate for a single-file skill.

Suggestions

Cut the marketing language ("jaw-dropping", "awards-caliber", "ABSOLUTE MANDATE") and either complete the Example section with a real input/output pair or remove it.

Add a validation step to the workflow, e.g., "5. Verify: run the animation in the browser and confirm no main-thread jank before delivering."

Either show a minimal SVG path-drawing/morphing snippet (e.g., anime({ targets: 'path', strokeDashoffset: [anime.setDashoffset, 0] })) or drop SVG animation from the When to Use list.

Dimension	Reasoning	Score
Conciseness	The workflow and code are efficient, but several sentences are pure hype Claude does not need: "lightweight but extremely powerful", "jaw-dropping web animations", "awards-caliber interactive sites", and the "ABSOLUTE MANDATE... DO NOT build common, boring transitions" decree. The Example section adds a quoted user request with no output, matching the anchor for mostly efficient with unnecessary padding.	3 / 5
Actionability	The timeline snippet is executable and demonstrates real API usage (spring easing, anime.stagger, a '-=800' offset), and the performance rule gives a concrete CSS hint. Minor gaps keep it below a 5: no import/setup step, and SVG morphing/path drawing is promised under 'When to Use' with no code.	4 / 5
Workflow Clarity	The four-step workflow (identify targets, define properties/easing, orchestrate timelines, implement) is clearly sequenced, but there are no validation checkpoints such as verifying the animation in a browser or checking for main-thread jank. This matches the anchor for steps listed but checkpoints missing.	3 / 5
Progressive Disclosure	There are no bundle files, so the single-file structure is appropriate: well-labeled sections, no nested references, and no dead links. Minor organization gaps (the vestigial Example section and Strict Rules overlapping the workflow) keep it at a 4 rather than a 5.	4 / 5
	Total	14 / 20 Passed

Description

48%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 identifies a clear niche but reads as marketing copy rather than a capability statement. It lists no concrete actions, contains buzzwords ("Advanced", "high-performance"), and entirely lacks a 'Use when' trigger clause. Adding explicit capabilities and trigger conditions would move it substantially upward.

Suggestions

Replace buzzwords with concrete capabilities, e.g., "Build multi-stage animation timelines, stagger element reveals, and animate SVG paths with Anime.js."

Add an explicit trigger clause, e.g., "Use when the user asks for web animations, motion choreography, staggered reveals, or animated SVGs, or mentions Anime.js."

Include natural synonyms and the library name as trigger terms ("animate", "timeline", "stagger", "anime.js", "motion design") to improve both trigger quality and distinctiveness.

Dimension	Reasoning	Score
Specificity	The description names the domain ("JavaScript animation library") but its only action, "creating complex, high-performance web animations", is generic and padded with buzzwords. It never lists concrete capabilities like timeline orchestration, staggering, or SVG path animation, matching the anchor for domain named but actions minimal or generic.	2 / 5
Completeness	A 'what' is present ("creating complex, high-performance web animations") but there is no 'Use when...' clause or equivalent trigger guidance, which caps completeness at 3 per the guidelines. It is not a 2 because the 'what' is domain-specific rather than pure abstraction.	3 / 5
Trigger Term Quality	"JavaScript animation" and "web animations" are keywords a user might naturally say, but common variations and synonyms ("animate", "animation timeline", "stagger", "SVG animation", "landing page animation") are missing. This matches the anchor for some relevant keywords but missing common variations.	3 / 5
Distinctiveness Conflict Risk	"Advanced JavaScript animation library" carves a mostly distinct niche with only minor overlap risk against generic CSS-transition or UI-styling skills. It is not a 5 because no explicit trigger phrases sharpen the boundary further.	4 / 5
	Total	12 / 20 Passed

Validation

93%

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 — 15 / 16 Passed

Validation for skill structure

Criteria	Description	Result
frontmatter_unknown_keys	Unknown frontmatter key(s) found; consider removing or moving to metadata	Warning

	Total	15 / 16 Passed

Repository: sickn33/agentic-awesome-skills
Path: skills/animejs-animation/SKILL.md
Commit: c26b706

Reviewed: 1 hour 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.