Graphic designers · 2 free picks

Web animation: add motion to a website

Animation on a website can feel cheap when the timing is wrong, and it can make a page slow. These add-ons teach the assistant how animation libraries work and the timing rules that motion designers use.

Free picks (tested by us)

Most useful first. Each one was installed on a clean test system; start with the first, try it, then add the next.

  1. NewskillInstalls cleanly

    Teach your assistant web animation

    GSAP AI Skills

    Official GSAP skills that teach your assistant to write correct web animations: timelines, scroll effects and plugins for React, Vue and plain pages.

    Test: installs cleanly and works without an account. Not yet used on real work.

    Good forGraphic designersWatch outEdits code in your project folder

    For any assistant
    Paste this in the terminal
    npx skills add https://github.com/greensock/gsap-skills
    What it does and how we tested it
  2. NewskillInstalls cleanly

    Motion timing and easing rules

    Motion Design Skill

    LottieFiles skill that teaches your assistant motion design rules, like timing, easing and what moves first, so its animations look calm and deliberate.

    Test: installs cleanly and works without an account. Not yet used on real work.

    Good forGraphic designersWatch outNone beyond normal file edits

    For any assistant
    Paste this in the terminal
    npx skills add LottieFiles/motion-design-skill
    What it does and how we tested it

Superpowers Pack · early access

Premium superpowers in the Superpowers Pack

We have not planned a skill of our own for web animation yet. The free picks on this page are our advice for now.

Superpowers written and tested by us, set up with one command. Early access: join the list and we email you the day it opens.

Get early access