1

I have a long page with a detail of an event. In the right corner of this page is present a floating action button to enter editing mode. Where I can place a back to top button?

  • Can you add some more info? is it a phone app, desktop website, etc. Also do you really need a back to top button? – Martyn Apr 12 at 19:03
0

Here's something things you could consider

  • The back to button doesn't need to be floating like the FAB. If there's too many things floating they will be competing for attention. Also putting the back to top at the end of your content ensures that the user has gone through all of it.

  • You could place the back to top button on the bottom left or bottom centre of this screen.

Hope it helps.

| improve this answer | |
  • I totally agree with your first point but I'm don't fully agree on place the back to top button at the bottom left or bottom center of the page. I think that it should be placed at the bbottom right, maybe it is wrong the edit fab button – Dennis Apr 12 at 11:06
0

The Floating Action Button should be main feature of the page in your application. There is good practice if you use floating action button specific for the important actions. May I ask please why an user needs to edit the details of an event? Is it for admin panel are you designing or is it for the end user who will just have a look for an event?

I did bit research on when to use FAB. The special thesis from Steve Jones (USER EXPERIENCE IMPLICATIONS OF THE FLOATING ACTION BUTTON) might help you to make reasonable decision.

Furthermore, as per the thesis from Steve Jones, he argues and highlights that FABs are made for creating something new on a specific page. Here, the question of using FAB as edit the action which might contradict the edit guidelines of google material design.

So, FABs are designed for creation/addition of main content of the webpage. You might use FAB for creating new event in your case, but not to edit the event.

Thesis: user experience implications of the floating point action button.

| improve this answer | |
  • The edit fab button is visible only for an admin user. In your opinion it's better to have a simple edit button at the bottom of the page instead of a fab button? – Dennis Apr 12 at 10:59
  • @Dennis, Edit might be part of the navigation panel in your design. As the principles for FAb are primarily focused on to highlight the main feature of the application. If you are following Google's material design guideline then there are principles for editing action: This link might help: material.io/components/bottom-navigation/#usage – python Apr 12 at 11:08
  • 1
    Can you provide a reference to the thesis and also point out the relevant section or summarise it her for completeness of the answer? – Michael Lai Apr 12 at 20:53
0

Please refer to the this wonderful article Back to Top Button Guidelines. Bullet points 1, 2, 7 and 8 are worth checking out for answers to your question.

Good luck !

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.