Web Interface  |  Buttons

Patterns

This section is about what to do with buttons in different design patterns.

01Destructive button location

It is better to place the destructive action in the opposite side from the primary action to prevent accidental clicks.

There is a high chance of accidental clicks on Delete.
It's better, now the destructive action will always be conscious.

02Buttons in a column

Bright buttons in the column increase noise, take up too much attention and reduce readability of the data.

Too much attention for the "Edit" buttons it makes it difficult to read data in the table.
This is better, now the attention to the buttons is reduced.
Even better, even less attention, even more readable data and kept the the "Edit" action clear thanks to the color emphasis.
Quite good. The role of the action is combined with the name of the user and clicking on it will open an edit form.