CtrlK
BlogDocsLog inGet started
Tessl Logo

remotion-markup

Content, animation and effects best practices

45

Quality

48%

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 ./packages/skills/skills/remotion-markup/SKILL.md
SKILL.md
Quality
Evals
Security

Quality

Content

71%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 lean, highly actionable best-practices reference: terse rules, executable tsx examples, and explicit good/bad comparisons, with a genuinely well-specified pre-compose procedure. Its main weaknesses are a duplicated Maps section, small correctness slips in the examples (undefined fps, typo-level errors like 'they need to refactored'/'timelien'), and a reference graph that points to ~28 files not present in this bundle, which makes the promised progressive disclosure unusable as shipped.

Suggestions

Remove the duplicate 'Maps' section (keep the later, more detailed one) and consolidate the many one-line 'See X.md' sections into a single grouped 'Topic guides' list to cut tokens.

Fix the example defects: define fps via useVideoConfig() in the first FadeIn example, and correct typos such as 'they need to refactored', 'timelien', and 'useCurrenFrame'.

Ship the referenced files (transitions.md, effects.md, ffmpeg.md, 3d.md, etc.) in the bundle or restructure them under references/ so the body's navigation resolves.

DimensionReasoningScore

Conciseness

The body is terse and assumes Claude's competence ("Keep the interpolate() call inline in the style prop", "Use scale, translate, rotate CSS properties over transform") with no padding explaining known concepts, matching the 'efficient; minor instances that could be trimmed' anchor. It is not a 5 because the 'Maps' section appears twice ("See [Remotion Maps](./remotion-maps/SKILL.md) if wanting to include maps" and the later expanded 'Maps' section) and several one-line pointer sections could be consolidated.

4 / 5

Actionability

Guidance is mostly executable: complete tsx examples with real props (e.g. the trimBefore/trimAfter/loop snippets, the Example scene), a concrete command ('npx remotion add @remotion/media'), and explicit do/don't comparisons ('👍 Inline editable keyframes... 👎 Non-inline values and transform strings'). It falls short of 5 because the first FadeIn example uses fps without defining it (no useVideoConfig), the delaying/trimming snippets use '{/* ... */}' placeholders, and the pre-compose workflow describes the procedure in prose rather than showing a minimal before/after example.

4 / 5

Workflow Clarity

The single real multi-step process (the Studio pre-compose request in 'Connected compositions') is well sequenced: find the selected markup, extract into a named component, render one direct instance under a Sequence, register the Composition with dimensions/fps/duration/defaultProps, and 'If the selection or a behavior-preserving connected composition is unclear, ask for clarification instead of guessing'. It is not a 5 because there is no explicit validation/verification checkpoint in that flow (the 'Visual checks' section suggests Studio preview but does not tie it into any procedure), and most other sections are reference material rather than sequenced workflows.

4 / 5

Progressive Disclosure

The body itself is a well-signaled overview with one-level-deep pointers ('See [transitions.md](transitions.md) for scene transition patterns', 'load [./sfx.md](./sfx.md)'), which resembles the 4-5 anchors. However, scored against the actual bundle, none of the ~28 referenced files (transitions.md, effects.md, ffmpeg.md, etc.) exist in this package — only assets/remotion-icon.svg is present — so the navigation the body promises is unresolvable, and the duplicated 'Maps' section hurts organization. This places it between 'references present but not clearly signaled' (3) and the broken-structure level below.

3 / 5

Total

15

/

20

Passed

Description

25%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 a domain label rather than a capability statement: no concrete actions, no trigger conditions, and no mention of Remotion, React markup, or video, so it neither tells Claude what to do nor when to do it. It would rarely be selected over competing skills on its own text and needs a rewrite in the style of the rubric's good examples.

Suggestions

State concrete capabilities in third person, e.g. 'Write Remotion React markup: drive animations with useCurrentFrame() and interpolate(), embed video/audio/images, trim and sequence layers, apply effects.'

Add a trigger clause naming the actual keywords, e.g. 'Use when creating or editing Remotion compositions, animating React video components, or when the user mentions Remotion, .tsx compositions, or programmatic video.'

Include the distinguishing terms (Remotion, React, video compositions) so the description cannot be confused with generic CSS-animation or content-authoring skills.

DimensionReasoningScore

Specificity

The description 'Content, animation and effects best practices' names a domain (animation, effects) but contains no verbs or concrete actions at all — even less action-oriented than the score-2 example 'Processes PDF files'. It is not a 1 because it does narrow the topic area to content/animation/effects rather than being purely abstract like 'Helps with documents'.

2 / 5

Completeness

It offers only a vague 'what' (best practices for content/animation/effects — no mention of writing markup, components, or even Remotion) and no 'when' clause whatsoever, matching the anchor 'has a vague what and no when'. It cannot score 3 because a clear 'what' is absent, and per the judging guidelines the missing 'Use when...' guidance already caps this dimension.

2 / 5

Trigger Term Quality

The only candidate keywords are 'content', 'animation', and 'effects' — generic terms a user would say for CSS animations, motion design, or web effects just as readily as for Remotion. Natural phrases a Remotion user would actually say ('Remotion', 'React video', 'useCurrentFrame', 'render video', 'programmatic video') are entirely missing, matching 'one or two generic keywords; missing the natural phrases users say'.

2 / 5

Distinctiveness Conflict Risk

Without 'Remotion', 'React', 'video', or 'markup' in the description, this text would equally plausibly trigger for general animation skills, CSS/motion-effects skills, or content-writing skills — 'very broad; high overlap risk with many similar skills'. It is above 1 only because 'animation and effects' at least gestures at a motion-graphics niche rather than 'helps with code and documents'.

2 / 5

Total

8

/

20

Passed

Validation

87%

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

Validation — 14 / 16 Passed

Validation for skill structure

CriteriaDescriptionResult

frontmatter_unknown_keys

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

Warning

relative_links

Relative link issues: 34 missing, 5 suspicious

Warning

Total

14

/

16

Passed

Repository
remotion-dev/remotion
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.