Material Design for Bootstrap

Why the hate? Some of us have been around for a long time and seen the same UI mistakes repeated over and over. This approach to animation seems to take something that wasn't broken in the first place, and replace it with something worse. On most sites today, I put my cursor over a button and it lights up or fades on hover. If I click it or touch it, it depresses. That's plenty of affordance. I don't see how replacing a simple effect with a dramatic, second long button flash improves matters. And if the material evangelists had their way, this is how every website would work.

Of course you can see this becoming popular in the months ahead. There's always some stupid trend that makes headlines for a few years, then fades away. Remember when gradients and reflections were in? Remember when everyone had to have a splash page? The best design ignores trends and builds upon all we've learned about user behavior since the first command line. There's always room for improvement and experimentation. But as long as we're locked in the fad-of-the-year hype cycle, we turn the whole web into a poorly designed experiment, with users as our unwilling test subjects.

"Its about using minimal appearance chrome to strengthen UI context."

Keeping chrome to a minimum and adding context are great design principles. But I wouldn't call it material design. It's called good design. I don't think we need a new name for fundamental design principles that have been known for years. Just calling it "material design" attracts the copycats, who would rather copy the look than understand the fundamentals. We should simply talk about good design, and encourage people to study timeless design principles.

I love material design, and this is more related to material design than this theme, because this is a beautiful and faithful implementation for web, but that button ripple is obnoxious.

It also makes the ui seem very sluggish, because the traditional pressed state of a button is instant feedback, and this is an animation that takes a couple hundred ms or so to complete.

First of all, I like the design. But about the animations...

Web browser engines are not particularly good in animation. I was viewing this with (not quite latest) Firefox and the animations were really choppy (with my less than 3GHz PC). As in really annoying and made user interaction next to impossible. Other browsers may work better.

Secondly, animation (especially in browsers) is very power consuming if you target mobile devices. Of course, this isn't something a web designer would have to care about, because unlike for "native" apps, you can't tell which web site was consuming all the battery. (and battery consumption means bad reviews in app stores)

I work for a mobile device company and I can tell you, for every minute a major web designer spends adding animation on a popular web site, a systems engineer spends an hour trying to optimize the power consumption (with changes to WebKit/Blink, device drivers and the kernel).

Web browsing power consumption is a major benchmark how device manufacturers choose their parts vendors. One of the key benchmarks is picojoules required to render nytimes.com front page. (this is ridiculous but that's how the industry works)

Quite simply: your design would be a lot better if you'd remove most (if not all) of the animations. Especially the mouse click circle (which appears so late it's distracting) and the things that scroll from the bottom (which scroll so choppily that it's annoying). They don't add anything to the usability of this site, on the contrary they make it work slowly.

Otherwise I like the aesthetic of your design.

Honestly that's on par for the course for anything visual/design related on HN.