Sunday, April 15, 2018

interaction design - Is it a good idea to use a Floating Action Button for non-actions?


Google Material Design guidelines recommend to use Floating Action Buttons primarily for a promoted action. However, recently there seems to be a rather solid emerging trend to use these buttons for triggering transition between two or more views, which don't necessarily contain actions.


For example: Switch between two views


Is this a recommended UX practice?




Answer




There is excellent detail on the use of the floating action (or FAB) button in this talk from Google's Material Design Team (it provides much better detail than the Material Design documentation!):





About FAB's




  • FAB's are designed to stand out. They are colorful, raised, and grid-breaking. This is a deliberate use of cognitive dissonance to draw a user's attention.





  • Because they are so prominent/intrusive, FAB's should be used once on a page or not at all. Google's Material Design team illustrates the relative frequency of different types of buttons:




enter image description here


Therefore...


FAB's are intended to be used for:




  • Hallmark actions that embody or signify the application itself. For example, a music app may have FAB that represents Play. An Instagram-like app might have a FAB that represents Take Photo. In both of these cases, the FAB represents a hallmark action that embodies what the app is about.





  • The primary action on the page. In both of the examples above, the Play and Take Photo buttons also represent the most common and important action on the page for the user.



    • Note that the most common action may not represent the most common task. For example, in a calendar app, 80% of users may open the app to review calendar entries. But since that doesn't involve an action (other than scrolling), there is no need for a button for this task. Here, the most common action might be to create a calendar entry, so a designer could legitimately show a + FAB to create an entry.




Both of these guidelines are from the Material Design specification itself.





What does this mean for views?


A FAB can certainly represent a view change. The key question is: does that view trigger represent a hallmark and/or primary action for the page?.


For the nice example you provided, the answer is probably no, since it looks like a case of poor design:



  • The title of the page is The Current Chart, but the page doesn't actually show the chart until the user clicks the FAB, which is terrible, anti-pattern design (the designing is making the user do work just to see the primary point of the page!)


No comments:

Post a Comment

technique - How credible is wikipedia?

I understand that this question relates more to wikipedia than it does writing but... If I was going to use wikipedia for a source for a res...