# Motion Review

> Review UI animation and motion code against a high craft bar - a Before / After / Why table and a Block or Approve decision. Paste CSS, SCSS or React (Motion / framer-motion) code; the page flags the mechanical triggers free in the browser, and a metered review judges purpose, frequency and feel.

URL: https://motion-review.skillsafe.ai/
API tutorial: https://motion-review.skillsafe.ai/api.html

## What it does

- Free, in the browser: parses CSS (rules, nesting, media queries, @starting-style, @keyframes, custom properties resolved) and reads Motion props and transition objects, element.animate() and GSAP tweens line by line. Lists every animation it can read with its properties, its duration against the budget for its element (button 100-160ms, tooltip/popover 125-200ms, dropdown 150-250ms, modal/drawer 200-500ms, UI under 300ms), its easing classed (ease-in, built-in, the standards' strong curves) and plotted against cubic-bezier(0.23, 1, 0.32, 1), and a live preview at its own duration and curve.
- Free: flags the review's escalation triggers at their lines, each with the After the standards give - transition: all, scale(0) entrances, ease-in on UI, UI over budget, layout-property animation, keyframes on toasts and toggles, center origins on popovers and dropdowns (the After uses the side the element is anchored to), animation on keyboard shortcuts and command palettes, ungated hover motion, missing prefers-reduced-motion, Motion x/y/scale shorthands before motion 14.2, layout animations, springs with bounce over 0.3, staggers over 80ms, pure-fade entrances, CSS variables driving child transforms.
- Metered lane `review`: the Before / After / Why table (each finding at path:line with its tier and standard), a call on every page finding (confirmed or dismissed), the verdict by impact tier, a Block or Approve decision; a re-review carries the earlier findings and marks each resolved, remaining or partly - checked by the page against the code.

## Run contract

Input fields (all strings): task ("review"), subject, context, files (numbered listing), facts (the animations, the page findings with ids, the standards' values, "must:" lines), previous (an earlier findings table, or a sentence), optional retry_note.
Output: one JSON object - summary, decision (block | approve), findings [{where, before, after, why, tier, standard, page}], page_calls [{id, call, why}], verdict [{tier, points}], resolved [{before, status, note}], caveats.

## Source

Built on the SkillSafe skill @emilkowalski/review-animations (https://skillsafe.ai/skill/@emilkowalski/review-animations), from emilkowalski/skills (MIT), by Emil Kowalski. Not affiliated with or endorsed by Emil Kowalski, Motion (motion.dev, formerly Framer Motion), Framer, GSAP / GreenSock or Webflow; their names are used only to say which code this reads.