Show HN: Granim.js – Create fluid and interactive gradients animations

sarcadass.github.io

74 points·Sarcadass··15 comments

Why these things always have to be so CPU intensive?

Probably because they're calculating the offset of the gradients at each step, resulting in a lot of array calculations.

How did you test?

Wow it looks great on my Android phone, Chrome browser. Just wanted to know how compatible it is with other browsers there on desktop and mobile...

Great work, keep it up!

Smooth as butter in Safari on iPhone 6.

Great news as lot of our target market is there.

Surprisingly fluid on Windows Phone 8.1!

Fluid on Firefox Mobile (Moto G 1st with Android M by CyanogenMod)

Looks great, does anyone have ideas on where they could use it? I'm trying to think...

Perhaps an elegant chatbot UI in the style of the film Her, signalling comprehension, attention or even emotions or with the gradient shift?

What's the point with web animation API now?

Gradient values are unfortunately not interpolable in Firefox, Chrome, Safari, etc.

really nice! I was looking for something like this a little while ago and couldnt find it. bookmarking

Do we really need a framework for this? It's some basic CSS.

Is it? I thought a lot of aspects of CSS gradients couldn't be animated?

Also, I wouldn't call this a "framework"...