CtrlK
BlogDocsLog inGet started
Tessl Logo

figma-implement-motion

Translates Figma motion and animations into production-ready application code. Use when implementing animation/motion from a Figma design — user mentions "implement this motion", "add animation from Figma", "animate this component", provides a Figma URL whose node is animated, or when `get_design_context` returns motion data or instructs you to call `get_motion_context`.

64

Quality

78%

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/figma/skills/figma-implement-motion/SKILL.md

The canonical home for this skill is figma-implement-motion in figma/mcp-server-guide

SKILL.md
Quality
Evals
Security

Quality

Content

77%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-structured, highly actionable skill with an explicit validated workflow and exemplary progressive disclosure into six clearly signaled reference files. The main weakness is redundancy — several rules are restated across the Overview, Steps, and Critical Rules sections and could be consolidated.

DimensionReasoningScore

Conciseness

The body is dense with Figma-specific signal and avoids generic concept explanations, but is noticeably repetitive: the fallbackNodeId/exact-id-match rule is stated three times (Overview, Step 2, Step 3), and the validate-before-batching and load-gotchas instructions each appear in multiple sections.

3 / 5

Actionability

Gives concrete tool calls with parameters, a worked transform-offset calculation ([45, 125, 125] over a rotate-45 base becomes [0, 80, 80]), an exact import path (motion/react), and a specific transformTemplate pattern; full worked code examples are delegated to reference files rather than inline.

4 / 5

Workflow Clarity

A clear five-step sequence (confirm design context, fetch motion, merge, apply, validate) with explicit validation checkpoints — spot-check one animation end-to-end with reload/observe/iterate before batching — and an explicit warning that batch errors compound.

5 / 5

Progressive Disclosure

The overview stays in SKILL.md and six deep-dive topics are split into one-level-deep reference files, each with a load-when condition; every referenced path resolves to a real file in references/ with no nested references.

5 / 5

Total

17

/

20

Passed

Description

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

A strong description with a clear what and an explicit, multi-signal when clause built from natural trigger phrases. Its main gaps are a single-action capability statement and a trigger ("animate this component") that can fire outside a Figma context.

DimensionReasoningScore

Specificity

"Translates Figma motion and animations into production-ready application code" names the domain and one concrete action, but does not enumerate several distinct capabilities, matching the 1-2-concrete-actions anchor rather than the several-actions anchor.

3 / 5

Completeness

Explicitly answers what ("Translates Figma motion and animations into production-ready application code") and when, with a concrete "Use when" clause listing quoted trigger phrases, Figma URLs, and MCP tool signals.

5 / 5

Trigger Term Quality

Includes natural quoted phrases users would say ("implement this motion", "add animation from Figma", "animate this component") plus tool-signal triggers, but misses common synonyms like "transition" or "micro-interaction".

4 / 5

Distinctiveness Conflict Risk

The Figma-motion niche and tool-name triggers are distinct, but "animate this component" is a phrase a user could say with no Figma context, creating minor overlap risk with sibling Figma or generic animation skills.

4 / 5

Total

16

/

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
openai/plugins
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.