CtrlK
BlogDocsLog inGet started
Tessl Logo
SkillPublic

hyperframes-animation

All animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition's choreography (animation map) and 24 named text-animation effects. HyperFrames-native: single paused timeline, seek-safe, deterministic.

Quality

89%

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

SKILL.md
Quality
Evals
Security

Quality

Content

75%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 well-architected index-style SKILL.md: the routing table is token-efficient and highly navigable, the default-vs-blueprint decision rule is crisp, and the script usage is concrete with an audit step after authoring. Main gaps are a redundant restatement of the core contract, no inline example of the default composition workflow, and a routing table pointing at many files absent from the provided bundle.

Suggestions

Trim the parenthetical in Critical Constraints that re-lists hyperframes-core's rules (no Math.random / Date.now, no repeat: -1, etc.) down to a short pointer like 'Prerequisite: hyperframes-core → Non-Negotiable Rules' plus only the two animation-craft additions, since the body itself says 'Don't restate the full contract here'.

Add a 5-10 line minimal example of the default workflow (picking two rules from rules-index.md and gluing them on a single paused GSAP timeline) so the most common path is executable without loading another file.

Close the feedback loop for the audit step: state what to do when animation-map.json reports dead zones, stagger inconsistency, or lifecycle warnings (fix the timeline, re-run, only ship when clean) to raise workflow clarity.

DimensionReasoningScore

Conciseness

The body is lean and format-driven — a routing table instead of prose, terse decision guidance ("Pick 2-4 rules from rules-index.md, glue them together with a single paused GSAP timeline, done"), and no explanation of concepts Claude already knows. It misses level 5 because the Critical Constraints section restates a substantial chunk of hyperframes-core's contract ("single paused timeline, data-duration governs length, no Math.random / Date.now / performance.now, no repeat: -1, no page-load gsap.set...") immediately after saying "Don't restate the full contract here" — that parenthetical could be trimmed to a pointer.

4 / 5

Actionability

Mostly executable guidance: a concrete script invocation ("node skills/hyperframes-animation/scripts/animation-map.mjs <composition-dir> --out <composition-dir>/.hyperframes/anim-map") with its output contract, and a routing table mapping each need to a specific file. It falls short of level 5 because the default path ("compose atomic rules") never shows even a minimal timeline-composition snippet, so the primary workflow relies on referenced files rather than copy-paste-ready guidance here.

4 / 5

Workflow Clarity

The decision flow is clear and ordered: default is composing rules, explicit conditions for when to load a blueprint ("The scene matches an existing pre-designed multi-phase template... or You want runnable ground-truth code for a complex 4-5 phase choreography"), runtime selection guidance, and a post-authoring validation step ("Use it to audit choreography (dead zones, stagger consistency, lifecycle warnings) after authoring") via the animation-map script. It is not level 5 because there is no explicit feedback loop (audit → fix → re-audit) and no validation step before the audit for the authoring workflow itself.

4 / 5

Progressive Disclosure

Excellent structure: a routing table covering every need with well-signaled, one-level-deep references, explicit non-speculative reading guidance ("Do not read it speculatively"), and pointers to sibling skills in See Also. It falls short of level 5 because the routing table references many paths (rules-index.md, rules/<name>.md, blueprints-index.md, blueprints/<id>.md, transitions/overview.md, transitions/catalog.md, techniques.md, adapters/*.md) that are not present in the shipped bundle — only references/motion-blur.md and scripts/ exist — so navigation is broken for most routes as bundled.

4 / 5

Total

16

/

20

Passed

Description

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

An exemplary description: it states what the skill contains (rules, blueprints, transitions, techniques, seven adapters), gives an explicit 'Use for' trigger clause with concrete usage modes, names every runtime a user might mention, and scopes itself to the HyperFrames ecosystem to avoid sibling-skill conflicts. Dense but not padded — every clause carries trigger or capability information.

DimensionReasoningScore

Specificity

The description lists multiple concrete actions with comprehensive coverage: "pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer)", plus "auditing an existing composition's choreography (animation map)" and "24 named text-animation effects". It matches the level-5 anchor (multiple specific concrete actions, comprehensive); it is not level 4 because there are no meaningful coverage gaps — even runtime-specific lookups and the audit use case are named.

5 / 5

Completeness

Both what and when are explicit: what — "atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters"; when — "Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API". This mirrors the level-5 anchor exactly; level 4 would require the 'when' to be less explicit, but here the trigger clause enumerates concrete usage modes. Voice is imperative/third-person, matching the good examples — no person-penalty applies.

5 / 5

Trigger Term Quality

Natural trigger terms a user would actually say are comprehensively covered: "motion or animation task", "animation", "scene transitions", "motion-design", "choreography", "text-animation", plus all seven runtime names (GSAP, Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU) with concrete API examples ("GSAP eases / Lottie player / Three.js mixer"). It matches the level-5 anchor; no common synonyms for this domain are missing.

5 / 5

Distinctiveness Conflict Risk

It occupies a clear niche ("All animation knowledge for HyperFrames", "HyperFrames-native: single paused timeline, seek-safe, deterministic") with distinct triggers (motion/animation/runtime-specific APIs) that would not collide with sibling skills like hyperframes-core, -creative, or -cli, which cover non-animation concerns. It matches the level-5 anchor (clear niche, minimal conflict risk); it is not level 4 because the HyperFrames scoping plus runtime-specific API examples leave virtually no overlap ambiguity.

5 / 5

Total

20

/

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.

Validation — 15 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

relative_links

Relative link issues: 1 suspicious

Warning

Total

15

/

16

Passed

Repository

freekmurze/dotfiles

Path

config/claude/skills/hyperframes-animation/SKILL.md

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.