CtrlK
BlogDocsLog inGet started
Tessl Logo

scroll-experience

You see scrolling as a narrative device, not just navigation. You create moments of delight as users scroll. You know when to use subtle animations and when to go cinematic. You balance performance with visual impact. You make websites feel like movies you control with your thumb.

31

Quality

25%

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 ./plugins/AI-Agents-Safe-Coding-Skills/skills/scroll-experience/SKILL.md

The canonical home for this skill is scroll-experience in administrakt0r/AI-Agents-Safe-Coding-Skills

SKILL.md
Quality
Evals
Security

Quality

Content

39%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 skill provides useful code snippets for scroll-driven animations across multiple libraries, which is its primary strength. However, it suffers from significant verbosity (repeating the description, explaining obvious concepts), lacks any coherent workflow for building scroll experiences, and references non-existent sections in the Sharp Edges table. The formatting also has structural issues with nested code blocks.

Suggestions

Remove the verbose role description, capabilities list, and tautological 'When to Use' section to improve token efficiency — Claude doesn't need to be told what parallax is.

Add a clear workflow section that sequences the steps for building a scroll experience (e.g., 1. Choose library → 2. Set up smooth scroll → 3. Add animations → 4. Test performance → 5. Verify accessibility), with explicit validation checkpoints for performance and accessibility.

Either create the referenced bundle files (Fixing Scroll Jank, Mobile-Safe Parallax, etc.) or replace the Sharp Edges solution column with inline actionable guidance.

Fix the markdown formatting — code blocks are nested inside pattern code fences, causing rendering issues. Restructure patterns as proper sections rather than code-fenced content.

DimensionReasoningScore

Conciseness

The skill is noticeably verbose with significant padding. The role description repeats the frontmatter description verbatim, the 'Capabilities' bullet list adds no actionable value, the 'When to Use' section is a tautology, and the anti-patterns section explains concepts Claude already understands (e.g., 'users hate losing scroll control'). The library comparison tables add some value but the overall token budget is poorly spent.

2 / 5

Actionability

The skill provides concrete, executable code examples across multiple frameworks (GSAP, Framer Motion, CSS scroll-timeline) that are mostly copy-paste ready. However, some sections like 'Story Beats' and 'Text Reveals' are vague bullet lists rather than executable guidance, and the Sharp Edges table references solutions (e.g., '## Fixing Scroll Jank') that don't exist anywhere in the document.

4 / 5

Workflow Clarity

There is no clear workflow or sequencing for building a scroll experience. The patterns are presented as isolated snippets without a coherent process for combining them. There are no validation steps (e.g., performance testing, accessibility checks) despite the skill involving potentially performance-impacting operations. The anti-patterns hint at concerns but don't integrate into a workflow.

2 / 5

Progressive Disclosure

The content is a monolithic file with no bundle files to reference. The Sharp Edges table references sections ('## Fixing Scroll Jank', '## Mobile-Safe Parallax') that don't exist, creating broken navigation. The code examples are nested inside markdown code blocks that are themselves inside code blocks (triple-backtick nesting issues), and there's no clear separation between overview and detailed reference material.

2 / 5

Total

10

/

20

Passed

Description

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

This description is written in second person ('You see', 'You create', 'You know') which violates voice guidelines, and reads like aspirational marketing copy rather than a functional skill description. It lacks any concrete actions, specific technologies, trigger terms, or 'when to use' guidance, making it nearly useless for skill selection among multiple options.

Suggestions

Rewrite in third person with concrete actions, e.g., 'Creates scroll-triggered animations, parallax effects, sticky sections, and cinematic scroll sequences using GSAP, Intersection Observer, or CSS scroll-snap.'

Add an explicit 'Use when...' clause with natural trigger terms, e.g., 'Use when the user asks about scroll animations, parallax scrolling, scroll-triggered effects, or cinematic web experiences.'

Replace vague phrases like 'moments of delight' and 'feel like movies' with specific capabilities such as 'horizontal scroll sections, progress-based animations, scroll-linked video playback'.

DimensionReasoningScore

Specificity

The description uses entirely vague, abstract language with no concrete actions. Phrases like 'create moments of delight' and 'make websites feel like movies' are pure marketing fluff with no specific capabilities listed.

1 / 5

Completeness

There is no clear 'what' (no concrete actions described) and no 'when' clause at all. The description reads as a brand manifesto rather than a functional skill description.

1 / 5

Trigger Term Quality

The only natural keyword is 'scrolling' and 'animations'. Missing critical terms users would actually say like 'parallax', 'scroll animation', 'GSAP', 'intersection observer', 'scroll-triggered', 'sticky sections', or 'scroll effects'.

2 / 5

Distinctiveness Conflict Risk

While 'scrolling' provides some domain hint, the vague language about animations, performance, and visual impact could overlap with general animation skills, CSS skills, or web design skills broadly.

2 / 5

Total

6

/

20

Passed

Validation

90%

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

Validation10 / 11 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

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

Warning

Total

10

/

11

Passed

Repository
administrakt0r/AI-Agents-Safe-Coding-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.