Material Design: Why the Floating Action Button is bad UX design

I HIGHLIGHTED so many passages in this brief, well-focused design argument, it’s almost embarrassing. Read it (it takes about three minutes), and you’ll wear out your virtual highlighter, too:

Material Design is a design language introduced by Google a year ago, and represents the company’s bold attempt at creating a unified user experience across all devices and platforms. It’s marked with bold colours, a liberal but principled use of shadows to indicate UI layers, and smooth animations that provide a pretty pretty user experience on Android (and some Google apps on iOS).

One thing about Material Design, however, has bugged me ever since it was introduced last year: Floating Action Buttons.

Floating Action Button | Image credit: Google

FABs are circular buttons that float above the UI and are “used for a promoted action,” according to Google. They act as call to action buttons, meant to represent the single action users perform the most on that particular screen.

And because of the bold visual style of Material Design, FABs are strikingly hard to ignore and stand out — and herein lies the problem.

While FABs seem to provide good UX in ideal conditions, in actual practice, widespread adoption of FABs might be detrimental to the overall UX of the app. Here are some reasons why.

Material Design: Why the Floating Action Button is bad UX design by Teo Yu Siang