Build fun web animations and win prizes

Adewale Abati - May 19 '22 - - Dev Community

Web animations, especially when used right, help create fun, interactive and engaging experiences for your website visitors. However, more often than not, they can be quite difficult to implement.

As CodeSandbox is dedicated to making web developers as productive as possible, we partnered with Greensock (GSAP) to host some fun and creative challenges for the month of April. Greensock puts a lot of animation power in the hands of developers through it's robust JavaScript library and they have now made all the Club Greensock premium plugins now available on CodeSandbox via npm. šŸ”„

Every week through April, we shared a new creative coding challenge and a sandbox to get started building something fun. You can find out all about the challenges at https://greensock.com/challenges.

Challenges

The first challenge encouraged everyone to build something fun on Scrolling animations with ScrollTrigger. There were a lot of amazing submissions but Victor and Ismael took the top spots.

Here comes the sun by Ismael

GSAP x CodeSandbox by Victor

The next challenge involved animating SVG Strokes with DrawSVG. Even more creative entries but our winners were Christian and av.

Cricut Drawings by Christian

Indiana Jones by AV

The final challenge using Greensockā€™s Flip plugin had our previous winners - Victor and Christian topping the charts again. So the well deserved runner ups - Toso and Julia took the prizes for this one.

Flip animation by Christian

Knowing the Alphabet by Victor

SpaceX by Toso

Tile builder by Julia

We want to say a big thanks to our judges who voted every week for their favorite demos despite how tough it got.

Stay up to date with @CodeSandbox and @Greensock on Twitter.

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
Terabox Video Player