DEV Community

Cover image for Build fun web animations and win prizes
Adewale Abati for CodeSandbox

Posted on • Originally published at codesandbox.io

Build fun web animations and win prizes

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.

Top comments (1)

Collapse
 
andrewbaisden profile image
Andrew Baisden

These are cool!