What UX principles to apply to assess a sticky action menu at the bottom?

Question

On the Awwwards website, I really like the sticky action menu at the bottom of the page (the black rounded box on the screenshot)

I think it is :

• Close to the thumb on mobile, hence easy to reach
• Not too intrusive (less than some native-like menu that stays in this area to mimic mobile apps)
• Full of links when expanded, so content is relevant and the mobile screen constraint seems well handled

However, I doubt users know well how to use this kind of menu. What UX principles would advocate for or against this menu? Are there any recommendations or alternatives that have a similar set of features but are more common in UX? Are there examples of similar menus on other websites?

Answer 1

One thing to consider is the specific audience for any given website or app, and how that will impact their understanding or curiosity to interact with a novel UI device like this. The audience for the Awwwards website is not likely to represent the general population, so it might be a safer place to try out more experimental concepts that have less to do with usability and more to do with being unique.

Something else I noticed is that the component state changes as you navigate to different sections of the site; it reanimates in from the bottom of the screen with each page load (which is pretty distracting), the label changes and sometimes new elements like secondary buttons appear depending on the page you are on. That seems like something that could really throw users off, since it is the primary way-finding device as far as I can tell.

I would be reluctant to introduce this floating menu button without first thoroughly testing it as a prototype with my target user population.

Answer 2

I’d be careful about sticky menus because:

• They constantly take up space
• They break when you zoom in
• They’re difficult to access
• Internal page anchors feel broken when clicked twice
• They appear closer than they are
• They obscure links and other focusable elements

Not all these will be applicable to your situation but something to consider.

More details here: https://adamsilver.io/blog/the-problem-with-sticky-menus-and-what-to-do-instead/