More screenshots

    Works with the AI tools you already use

    Claude CodeClaude CodeCursorCursorCodex CLICodex CLIGitHub CopilotGitHub CopilotGemini CLIGemini CLI+20 more

    Motion Scout - with MotionLAB

    1

    A systematic motion director that scans, prototypes in a live lab, and deploys cohesive site-wide animations.

    $5

    Secure checkout via Stripe

    30-day refund guarantee

    Converts to your local currency at checkout

    0 installsSecurity scanned
    Motion Scout - with MotionLAB

    Motion Scout - with MotionLAB

    Example session with this skill installed

    Our landing page feels a bit flat. Can you scan the dev build at localhost:3000 and suggest a motion overhaul that feels professional but energetic?

    • Read your context and instructions
    • Compiled the motion scout
    • Generated the UI component

    I've scanned the site. You have 8 high-impact surfaces including a hero header and 3 feature cards. I recommend the 'Spring' signature for that energetic feel. I have launched the Motion Lab at localhost:8080. You can now tune the stagger and bounce of the cards before we apply any code.

    motion-scout-with-motionlab.tsx

    TSX · React component

    Generated

    Example file from a real run - the skill writes it into your workspace.

    Connects securely to your tools. The creator never sees your data.

    What you get

    Enforce site-wide motion coherence through shared easing tokens.Preview animations on real site content before writing production code.Identify and fix performance bottlenecks in existing site transitions.Generate accessible, reduced-motion-friendly CSS layers automatically.

    About this skill

    The problem

    Websites often feel rigid or "cheap" due to disjointed animations that lack a unified rhythm. Developers waste hours hand-coding cubic-beziers and transitions only to find they don't scale or match the brand personality.

    What it does

    • Scans live URLs to identify high-impact motion opportunities and technical constraints.
    • Establishes a cohesive "motion signature" so every transition shares a unified easing and timing logic.
    • Builds an isolated "Motion Lab" where you can preview and live-tune effects on your actual site content.
    • Deploys motion as a non-destructive CSS/JS layer that respects accessibility and SEO.
    • Automates performance-first code generation using View Transitions and scroll-driven animations.

    Frameworks & tools

    Works with React, Next.js, Astro, Vite, Tailwind CSS, and WordPress. Uses modern platform APIs like @starting-style and linear() easings.

    Why this beats prompting it yourself

    Instead of generating isolated snippets, this skill enforces a systemic approach to animation. It provides a visual feedback loop via a local lab server, ensuring you never commit code until you have verified the feel and performance on real DOM nodes.

    Use cases

    • Modernizing a static marketing site with premium, coordinated micro-interactions.
    • Auditing and replacing janky, legacy jQuery or CSS animations with performant alternatives.
    • Building accessible, scroll-driven storytelling experiences without heavy third-party libraries.
    • Rapidly prototyping brand-specific motion languages for client approval.

    Known limitations

    Focuses on high-performance properties like transform and opacity. Does not support animating layout properties like width or height that trigger reflow.

    How to install

    Works the same in every agent - Claude, Cursor, Codex, Copilot and 20+ more.

    ~30 seconds
    1. 1

      Download the ZIP

      Free skills download straight away. Paid skills unlock right after purchase.

    2. 2

      Unzip into your skills folder

      Every agent reads skills from one folder on your machine. Drop the unzipped folder in there.

    3. 3

      Ask your agent to use it

      Restart the agent if it was already running. It picks the skill up automatically - no config needed.

    Skills folder by agent

    Click the path to copy it. Create the folder if it does not exist yet.

    Reviews

    No reviews yet

    Be one of the first to try it. Every listed skill passes our trust checks below.

    Security scanned

    Passed our 8-point scan before listing

    Fresh listing

    Recently published to Agensi

    30-day refund

    Not a fit? Get your money back

    Trust & safety

    Security scanned

    Verified clean 1 month ago

    • Passed all security checks, Safe to install

    Listed1 month ago

    What's inside

    Frequently Asked Questions