Workflow Button Location

Question

In our system we have workflows which can have 1 to many steps. Below you will see an example of one that is quite simple with only one step, with the buttons "Save" and "Cancel". Some other Workflows that exist in our system have button combinations such as: "Save & Add Another" "Save" "Cancel"... and another has "Previous" "Next" "Run Process". My point is that there can be many different workflows with many combinations of buttons.

Are there any best practices for button location on Workflows when comparing my two examples below?

Option One: Buttons located in top-left

Option Two: Buttons located in bottom-right

Answer 1

It depends on the layout and the type of form, but ultimately, CTA buttons should be under the form (because of the way we scan UI) and not so separated from the inputs that they might not be seen (or not appear in some views).

According to the examples the best way would be to locate the buttons on the bottom of the screen, following the vertical direction.

The number of steps define if the button should be aligned right or left.

In a one column layout, the user’s eyes move in a vertical direction to fill out the form. When users get to the bottom of your form, they won’t have to move their eyes to the left or right to find your button.

http://uxmovement.com/forms/aligning-submit-buttons-on-form-column-layouts/

There are three types of forms you need to consider: multi-page, multi-section, and single page form. The type of form you’re using will determine where you should place your submit button.

http://uxmovement.com/forms/where-to-align-form-buttons-on-different-layouts/

In a nutshell, put your CTAs under your forms, and not so far away that they seem separate.