1

I have a dialog box that is asking a user to confirm the cancellation of a task.

Since the main CTA already says, "Yes, cancel this task", it might be confusing for the action to exit the dialog to also say, "Cancel."

We are using Material UI here so we don't have an "x" dismiss icon on the upper right hand corner of the dialog, but even then, I think a prominent exit button is still warranted.

What should this label say to clearly communicate to the user that they are dismissing the dialog? Other ideas - No, don't cancel this task, Close, Close without canceling, etc...?

enter image description here

4
  • is 'Cancel' functionally the same as Delete in this case?
    – Mike M
    Feb 8, 2022 at 0:54
  • @MikeM No. As mentioned above, "Cancel" here is dismissing the dialog. "Yes, cancel this task" is canceling the task. It doesn't remove or delete it. It just changes its status to cancelled from what could be draft, in progress, etc.
    – J Bo
    Feb 8, 2022 at 6:26
  • Button 1 - cancel. Button 2 - continue. Basically, you need to figure out what is the "opposite" action of "cancel" that is most applicable in this case.
    – ahron
    Feb 8, 2022 at 6:31
  • Either "Keep" or "No" (the latter only if you retain "Yes, cancel this task") Feb 8, 2022 at 14:40

2 Answers 2

1

To avoid the confusion you're referring to, make both buttons about the task and not about the dialog. I would keep the "Yes, cancel this task" and make the other one "Keep this task".

1

"Cancel the cancel action" is not really clear, so explain what will happen and give the buttons a verb that more accurate tells what the result of the action will be. Make every element in the dialog count:

  • A title is a quick reference to the kind of dialog/modal
  • The body text shows what the subject is, what will happen with it and tells the user how to continue
  • An icon can be used to raise awareness to caution and careful reading of the instruction
  • The buttons should start with a verb (optionally emphasized in bold)
  • Extra space between buttons can also emphasize the importance of the choice

enter image description here

Much is emphasized in this example to show what is possible to make things clear, but of course you have to adapt the content to what is appropriate in the context in which it is used.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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