Slater 🀝 GSAP 🀝 Webflow


​

We were excited to be invited back on an official Webflow livestream this week. This time, Slater played a supporting role on "Learn GSAP for Webflow." Aron and Cassie did an incredible job building a really cool GSAP animation. Aron started the stream by publishing JavaScript in Webflow, so you could see the advantages of cmd+s over the publish flow. Those few seconds it takes to publish your Webflow project feel like eternity when you've just forgotten to add a comma. ;)

If you didn't see it, you need to go watch it now!

video preview​

​

​

JavaScript 101: GSAP and Slater AI

In the livestream, Aron and Cassie built out a really impressive GSAP animation by hand. The first animation was very simple, but as they added complexity, the code became much more difficult to follow. Slater AI can help out on this! Slater AI is good at explaining code, debugging it, and even writing it.

Watch what I was able to do with a few minutes and very limited GSAP knowledge.

video preview​

​

Have you used GSAP? With Slater? Please share your projects with us. We'd like to start highlighting what Slater users are creating.

Happy Coding!

​

πŸ€™ The Slater Team

​

--

​

If Slater helps you create better websites, please support the team behind it.

Welcome To Slater!

Slater resources, updates and community activity

Read more from Welcome To Slater!

We're back from a company-wide summer pause (or winter pause for our Southern Hemisphere team members). Edgar Allan is hitting it's numbers! Let's look at some new Community Library scripts: πŸ‘€ Dynamically loads HTML content based on a random number. This is a quick script we wrote to give a dynamic intro into a soon-to-be-released https://edgarallan.com. https://slater.app/community_library/random-content-aee7f7f2-3ab8-4e6f-887e-ea54cad0ebbf From Jared Malan ✍️ Create a variable for your...

We're rolling into a holiday week in the US. If you need an animated American flag to celebrate, look no further. But! We have users from all over the world. For those outside of the US, try updating the code to make an animated flag of your country (hint: use AI). If you make one, please share. We'll get it added to the Community Library. πŸ‡ΊπŸ‡Έ Render and animate an American flag on a canvas with dynamic waving effects....

We're adding new community library scripts each week. Let's take a look at some of them. πŸ‘Ύ An interactive swarm Create a dynamic grid of squares that react to mouse movement, simulating a swarm-like effect (is it a swarm?). This code is the scaled back version of something we did for a client. We'll show you the finished experience once that projects launches. Play with the example: https://slater-original.webflow.io/swarm Review the code:...