CtrlK
BlogDocsLog inGet started
Tessl Logo

gsap-scrolltrigger-storytelling

Build cinematic sticky product storytelling with GSAP ScrollTrigger, progressive UI reveals, scroll-synced animation, smooth interpolation, and immersive section transitions.

59

Quality

67%

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 ./agent-skills/web-design/gsap-scrolltrigger-storytelling/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

65%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 content is well-structured, concise, and names the right APIs, but it lacks executable code examples and offers topic-organized guidance rather than a sequenced workflow with validation checkpoints, which limits its actionability and workflow clarity.

Suggestions

Add a short executable GSAP ScrollTrigger code skeleton showing a pinned, scrubbed timeline with labels and gsap.context() cleanup so the guidance is copy-paste ready.

Fill the empty "## Workflow" section with an ordered sequence and explicit validation checkpoints (refresh ScrollTrigger after asset/font load; verify all triggers are killed on unmount/route change).

Add a concrete breakpoint example via matchMedia() showing graceful desktop-to-mobile simplification, since the tuning-knob advice currently stays abstract.

DimensionReasoningScore

Conciseness

The body is lean and assumes Claude's competence with no padding about what GSAP or ScrollTrigger is, though a few soft phrases ("feel intentional", "controlled pacing") could be trimmed for perfect efficiency.

4 / 5

Actionability

Names specific APIs and configuration advice ("ScrollTrigger `scrub`", "pin: true", "gsap.context()", "matchMedia()", "quickSetter/quickTo") but provides no executable code examples or copy-paste snippets for a skill whose purpose is implementing GSAP code, leaving it above pseudocode but below mostly-executable guidance.

3 / 5

Workflow Clarity

Guidance is organized by topic rather than as a sequenced workflow, the "## Workflow" header is empty, and there are no validation checkpoints (e.g. verify ScrollTrigger refreshed after asset load, confirm triggers killed on unmount) even though pinned scenes and cleanup are error-prone.

3 / 5

Progressive Disclosure

At ~45 lines with no external references needed, the body is well-organized into clearly headed sections (Use When, Scope, Experience target, Implementation guidance, Motion patterns, Tuning knobs, Avoid), meeting the under-50-line simple-skill exception.

5 / 5

Total

15

/

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 specific and distinct within its motion-design niche, with good natural trigger terms, but it omits any explicit "Use when..." guidance, which caps its completeness and leaves the activation context only implied.

Suggestions

Append an explicit "Use when..." clause naming concrete triggers, e.g. "Use when building scroll-driven product stories, pinned/scrubbed GSAP ScrollTrigger scenes, or cinematic sticky section transitions."

Add natural synonyms users would say (parallax scrolling, pinned sections, scrubbed timelines) to broaden trigger-term coverage.

Distinguish the capabilities more sharply from a generic GSAP-animation skill to reinforce the sticky-storytelling niche.

DimensionReasoningScore

Specificity

Lists several concrete capabilities within the GSAP ScrollTrigger domain ("sticky product storytelling", "progressive UI reveals", "scroll-synced animation", "smooth interpolation", "immersive section transitions"), but they are overlapping variations on one motion-design theme rather than comprehensively distinct operations.

4 / 5

Completeness

Provides a clear "what" but no explicit "Use when..." trigger clause; per the guideline a missing explicit trigger clause caps completeness at 3, and the "when" is only weakly implied.

3 / 5

Trigger Term Quality

Includes natural domain terms a user would say ("cinematic sticky product storytelling", "GSAP ScrollTrigger", "scroll-synced animation", "immersive section transitions"), but misses common synonyms like "parallax scrolling", "pinned sections", or "scrub animation".

4 / 5

Distinctiveness Conflict Risk

The GSAP ScrollTrigger + cinematic sticky storytelling framing is a clear niche with distinct triggers and minimal overlap risk with other skills.

5 / 5

Total

16

/

20

Passed

Validation

100%

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

Validation16 / 16 Passed

Validation for skill structure

No warnings or errors.

Repository
MengTo/Skills
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.