Interesting. "Animation" seems to cover a lot of ground, like "programming". They seem to fit into "artistic" animation, designed to be looked at, and interactive animation, and in this list mainly for UI component interaction and feedback. But in addition, animation is used for data visualization (e.g. D3 or charts.js) and game programming. Did I miss a category? Are these the right names?
It's a land grab that, if GSAP becomes a standard, makes it that much harder to compete with Webflow.
For example GSAP will now never make its way into Figma or Framer which is a staple of the design workflows of many teams. This move by Webflow makes GSAP a line of demarkation between Figma-based workflows, Framer-based workflows, and Webflow-based workflows.
Any momentum the library might have had is now skewered by these limitations which will surely create demand for more different animation libraries to exist within other walled gardens.
The same happened to Vercel & Next.js which now seems to be powering the return of Vite & CSR.
Now that said, I'd never heard of this library until this announcement, and I don't know much about its role in the javascript ecosystem, but I can't say that the trend towards M&A kingdoms in the open source community delights me.
FWIW, sub-5kb banners were probably the only Flash projects that didn't include GSAP before we collectively jumped ships to JavaScript and CSS for animation on the web. It was everywhere.
It's not just for Web though, but a really nice approach to authoring motion graphics in general. Motioncanvas is also worth a mention in this space[0].
I hope this is a reaction to Framer's rapid development in Frame Motion (https://motion.dev/). Webflow and Framer are competing as site builders, so giving the animation library to everyone is like Meta giving out React.
I’d say it is too little too late. Motion already has the lion’s share and anime.js is another strong open source alternative. GSAP was quite big in its day but why would anyone invest in it today? Also Motion is no longer part of Framer.
The community for GSAP is still amazing and there’s years of forum posts for most questions you might have. Motion and anime are great but I’m skeptical that either have a lion share relative to GSAP.
Nice development for the library, I've been using it in https://teskooano.space for ThreeJS camera transition - I'll have to check out this new stuff too
Beside it's not MIT, so no one will use it.
Who is using it? Last time i looked it up, it was like jQuery for animtion. What do i miss about it? Why should i use it?
We loved GSAP and wanted to combine that style of rendering with an event-driven programming model with redux so that we could pass animation events from a backend over a websocket.
Also wanted to keep a bunch of animations on different computers around the world in sync to within ~30ms. Ended up building this library: https://monadical-sas.github.io/redux-time/
GSAP is a bit more robust than anime.js. Over the years anime has been adding more functionality and changing its syntax to be more like GSAP's. They're both solid libraries though
Lottie handles a different usecase. Lottie is used to port animations from after effects to the web as an svg animation. For this Lottie will use a static json file which is generated beforehand. It uses a quite complex structure and is mere impossible to read as a human. Making dynamic manipulations not feasible.
For dynamic animations gasp is great as you just code the animation in js making it a perfect fit for the web. The creation process can be quite cumbersome though.
You're free to use/do as you wish, but GSAP is a remarkably powerful library that benefits from two decades of very smart people optimizing it.
It's very typical for someone to look at something that is only 95% perfect and declare that they could replace it in a few days or weeks, while simply refusing to learn from history (or Joel Spolsky's warnings against the big rewrite).
No. As an industry we need to start consolidating on open source tooling, we see what happens when a company breaks away from open source licenses: it hurts consumers at their detriment.
Your quote has no bearing in this context. We aren't talking about rewriting our projects, we're talking about purposely choosing open and free tools.
Also GSAP isn't even the leading animation library in JS ecosystem, thankfully.
I was responding to someone who said that we could "generate" alternatives, so there's still time for you to remove the unnecessarily spiteful downvote.
Other fun animation sites:
https://svgartista.net
https://animejs.com
https://animate.style
https://animista.net
LLMs are pretty good at this stuff too - just ask the LLM to use one of these resources when making your thing.
Interesting. "Animation" seems to cover a lot of ground, like "programming". They seem to fit into "artistic" animation, designed to be looked at, and interactive animation, and in this list mainly for UI component interaction and feedback. But in addition, animation is used for data visualization (e.g. D3 or charts.js) and game programming. Did I miss a category? Are these the right names?
AnimeJS is so darn impressive. The site and documentation is chefs kiss.
The obvious question is, what does free mean? Here's the license:
https://gsap.com/community/standard-license/
Basically freeware with express prohibitions on competing with Webflow.
Isn't that fair? What am I missing?
It's a land grab that, if GSAP becomes a standard, makes it that much harder to compete with Webflow.
For example GSAP will now never make its way into Figma or Framer which is a staple of the design workflows of many teams. This move by Webflow makes GSAP a line of demarkation between Figma-based workflows, Framer-based workflows, and Webflow-based workflows.
Any momentum the library might have had is now skewered by these limitations which will surely create demand for more different animation libraries to exist within other walled gardens.
The same happened to Vercel & Next.js which now seems to be powering the return of Vite & CSR.
Now that said, I'd never heard of this library until this announcement, and I don't know much about its role in the javascript ecosystem, but I can't say that the trend towards M&A kingdoms in the open source community delights me.
Figma and Framer both seem to be backing https://motion.dev/ which is open-source.
Wasn't motion.dev originally framer.motion? So not much of a surprise they are backing their own library.
FWIW, sub-5kb banners were probably the only Flash projects that didn't include GSAP before we collectively jumped ships to JavaScript and CSS for animation on the web. It was everywhere.
GSAP is already a standard and Next has always done CSR.
I mean, don’t framer and figma also have loads and loads of features which you can’t import into other tools?
Always cool to see more free stuff, but about the only animations I want to see on the web are from https://ciechanow.ski/
It's not just for Web though, but a really nice approach to authoring motion graphics in general. Motioncanvas is also worth a mention in this space[0].
[0]: https://motioncanvas.io/
To be fair, https://animejs.com gave me the same vibe. In the sense that the author obsesses over details, while also being very educational.
I hope this is a reaction to Framer's rapid development in Frame Motion (https://motion.dev/). Webflow and Framer are competing as site builders, so giving the animation library to everyone is like Meta giving out React.
I’d say it is too little too late. Motion already has the lion’s share and anime.js is another strong open source alternative. GSAP was quite big in its day but why would anyone invest in it today? Also Motion is no longer part of Framer.
The community for GSAP is still amazing and there’s years of forum posts for most questions you might have. Motion and anime are great but I’m skeptical that either have a lion share relative to GSAP.
Nice development for the library, I've been using it in https://teskooano.space for ThreeJS camera transition - I'll have to check out this new stuff too
Who here is old enough to know that Greensock was actually a flash library?
Thanks for reminding me I'm getting old
not often you see an acquisition result in something good for existing users, and this is a surprisingly good outcome
Beside it's not MIT, so no one will use it. Who is using it? Last time i looked it up, it was like jQuery for animtion. What do i miss about it? Why should i use it?
We loved GSAP and wanted to combine that style of rendering with an event-driven programming model with redux so that we could pass animation events from a backend over a websocket.
Also wanted to keep a bunch of animations on different computers around the world in sync to within ~30ms. Ended up building this library: https://monadical-sas.github.io/redux-time/
Amazing how far TweeLite has come. It was probably my most used dependency in Flash projects back in the day.
Jack, if you're reading, I'm sorry I made fun of the green sock brand back in the Kirupa days!
(GS in GSAP stands for Green Sock)
GSAP – A wildly robust JavaScript animation library built for professionals [https://gsap.com]
I keep hearing about it, but I've never used it. Why would I use it over https://animejs.com ?
GSAP is a bit more robust than anime.js. Over the years anime has been adding more functionality and changing its syntax to be more like GSAP's. They're both solid libraries though
I only discovered GSAP the other week, very quickly solved a complex animation problem and walked away quite impressed.
Now I'm looking at AnimeJS and my mind is properly blown, looks even better.
Serious question, is this a joke? I just see a black screen when I go to the site. I refreshed multiple times. Cleared cache. Just a black screen.
You have probably disabled WebGL in your browser.
Check out Lottie for animated SVG: https://lottie.github.io/
https://en.wikipedia.org/wiki/Lottie_(file_format)
Rive is better in my experience, much more performant and a nice editor to go along with it.
Lottie handles a different usecase. Lottie is used to port animations from after effects to the web as an svg animation. For this Lottie will use a static json file which is generated beforehand. It uses a quite complex structure and is mere impossible to read as a human. Making dynamic manipulations not feasible.
For dynamic animations gasp is great as you just code the animation in js making it a perfect fit for the web. The creation process can be quite cumbersome though.
Yeah, no! GSAP is not open-source → they can pull the rag on you anytime. No need for drama when we can find/generate alternatives.
You're free to use/do as you wish, but GSAP is a remarkably powerful library that benefits from two decades of very smart people optimizing it.
It's very typical for someone to look at something that is only 95% perfect and declare that they could replace it in a few days or weeks, while simply refusing to learn from history (or Joel Spolsky's warnings against the big rewrite).
No. As an industry we need to start consolidating on open source tooling, we see what happens when a company breaks away from open source licenses: it hurts consumers at their detriment.
Your quote has no bearing in this context. We aren't talking about rewriting our projects, we're talking about purposely choosing open and free tools.
Also GSAP isn't even the leading animation library in JS ecosystem, thankfully.
I was responding to someone who said that we could "generate" alternatives, so there's still time for you to remove the unnecessarily spiteful downvote.
Strange announcement
Wasn’t GSAP already free and open source? I remember seeing it years ago!
Is this more capitalism doublespeak?
GSAP has long had a free base library with many advanced features only available on a paid subscription basis.
While free as in beer is welcome, in a past life I was happy to pay to be able to access such a powerful toolkit.