Discover KINETIC: Your Go-To Guide for Web Animation Effects

Discover KINETIC: Your Go-To Guide for Web Animation EffectsDiscover KINETIC: Your Go-To Guide for Web Animation Effects

The network for creativity

Join 1.25M professional creatives like you

Connect with clients, get discovered, and run your business 100% commission-free

Creatives on Contra have earned over $150M and we are just getting started

Back to feedPost

RUDRESH H R

• Apr 11

Been quiet here for a month.

I was heads-down delivering a bilingual corporate website for a client in Tokyo — custom GSAP animations, scroll-driven choreography, canvas effects, EN/JP language switching, and cross-browser optimization down to the last pixel.

First real client delivery. Shipped it. Got it done.

But while building that, I kept running into the same problem — there's no single place that shows every type of web animation side by side.

So I built one.

KINETIC — a free interactive encyclopedia of 70+ web animation effects. GSAP, Three.js, CSS keyframes, scroll animations, WebGL shaders — all in one page with live demos.

I made the reference I wish I had when I started.

#WebDevelopment #GSAP #ThreeJS #Animation #FrontEnd

webdev GSAP three.js Web Design HTML5

Toqir Chatha

pro

• Apr 22

Micro-interactive landing for LivLive. GSAP across the full page.

Webflow websites GSAP

Sahil Dobariya

pro

• Apr 23

Interactive and high-impact.

Dramane Sacko

• Apr 23

I built a custom workflow called the 'Event Motion Architect' that transforms a static poster into a professional 5-sequence cinematic video.

The system uses deep layer separation to animate existing elements with parallax effects while preserving the original layout's integrity. Each sequence is a modular video unit that inherits the 'Visual DNA' and typography of the primary flyer. I also integrated a 'System Behavior Prompt' that allows users to dictate the animation style, from cinematic zooms to high energy pulses.

The challenge was great! 😊 link

morphicworkflows AI Video Production Morphic

Eniola Adegbesan

pro

• 21h

Event Motion Architect" is a fitting name for this. That deep layer separation makes the design feel premium, which is huge for building trust with an audience. I’ve seen how much of a difference cinematic elements make in boosting CTRs and keeping people inside a brand's...