Confirm cancellation

Question

I have a window, where the user will have to chose to cancel or save.

First:

I have some people in my office saying that when you click on save the window will not close, but you will get a feedback message saying that the changes are saved, and then you will have to close your window, because "he might want to save the changes and have an overview, before closing"

Would it be a better approach to have a cancel or save button instead? And if you click on save the window will close.

Second:

What if the user accidently clicks cancel when he meant to click save? Do I need a prompt?

Answer 1

1. User clicks on Save and system closes the popup? Yes. Show a feedback message on the screen behind as:

Your changes are saved successfully!

2. What if user accidentally clicks on Cancel button? Close the popup, but the feedback message on screen behind should say:

Your changes are discarded. Undo

The feedback messages / notification play a huge role in such situations which should be implemented as a best practice.

Answer 2

Although users don't like to admit it, they will make mistakes. Ranging from having the wrong mental model of what a button will do to a simple misclick. It is therefor important designers take these possible mistakes into account when designing software. Two good rules of thumb are 'always ask for confirmation when a users action is irreversible' and 'try to minimize the disruption of the users flow (dialogues typically do this)'.

Now these two rules can contradict and that's when we need to get creative and smart. In your situation I would place both the save and the cancel/close button on the screen, because they serve a different purpose. After the user saves, I would gray out (and maybe disable) the save button and highlight it again after the users makes another change. When the users tries to close the window while there are still unsaved changes, I would prompt a dialogue asking the user if he would like to save or discard the changes. This way, the amount of dialogues is minimized but the user can't discard any changes unintentionally. This is by the way how most software handles quitting an application while there are still open unsaved documents.

Answer 3

Maybe you should autosave drafts?

This way the user is caught from anything that might disrupt their work, whether it's a mis-click or a power failure.

As you state it's "definitely more than a couple of fields" (OP comment) you should really consider this as an option.

Stack Exchange do this well, there's no cancel, just a post and if I leave and come back my post is still here.

Answer 4

I would go with a combo of Dipak and Toni's answers. I think the happy medium lies between. What should happen here is wholly dependent on what your users would expect to happen. This is where user testing comes in. There is really no substitute for knowing who your users are: what they think, how they feel, how they work, etc.

That said, there's still obviously generalizations that can be made for any user. First, recognize that there's a clear difference between creating something and editing something. If I'm creating some new thing, then I want my work saved at all costs. There's no going back, and the barrier to entry is usually higher than with modifications. Here, you either prompt the user to confirm they want to cancel or as Toni implies, use local storage to save the entered data, so if they reopen the form, they're right back to where they left off. With the latter, it's not necessary to prompt the user, but it can help to reduce temporary anxiety should they accidentally cancel and don't realize that you're silently saving their work.

With editing, it's a little different. Here, as a user I expect canceling to revert. In other words, it no longer makes sense to save the users changes to local storage and persist them after canceling. If I change something irreparably and want to go back to the old version, canceling is my escape hatch. You should definitely, now, prompt the user to confirm, so that an accidental click doesn't undo their work.

Answer 5

The better option in my opinion is to have both Save and Discard buttons. If user clicks save, the popup should close and an info message saying 'Your changes have been saved' should be displayed that will fade out in 3 seconds. If user clicks Discard, show a confirmation message saying 'All changes you have made will be discarded, are you sure"? and buttons saying Yes and No. On clicking no, he will go back to edit mode.