Delete buttons

🕒 2 min read

Truly destructive actions require the strongest intent from the user. There are many ways to let the user communicate that intent. One common option is to present a dialog and have the user type the name of the thing they're deleting, for example. GitHub does this when you're deleting a repository.

Because it's fun to add constraints, let's say we want the whole interaction to happen on the button itself, so we can't trigger a dialog. Furthermore, let's imagine a scenario where we don't have the architecture to support an undo operation.

Here are a few button concepts I came up with.

Click and hold

It's very unlikely that a user will keep their mouse button held down by accident. The emojis and the animation add some delight to the interaction.

Multiple clicks

Accidental errant clicks will not be an issue if the button requires multiple clicks. Not completing all clicks resets the button to its initial state after a few seconds.

Type to confirm

Similar to the solution with a popover dialog, but the text input is placed within the button itself.

Moving button

A variant of the multiple clicks button above where the user is forced to move their cursor, further strengthening their intent.