Stacked toast messages with undo links.

In our application, the user can make small changes, such as deleting a chart from a report.

When they delete an item, a toast notification appears to say "Chart 2 was deleted successfully. Undo?"

The undo option makes it easy to quickly recover from errors. But how long should the message appear, before it fades out?

Currently it is set at 60 seconds. But that feels way too long, especially as hovering over the message, even during the fade, suddenly resets the timer.

Note that the message can also be cancelled with an 'x' and multiple messages get stacked, blocking any underlying content.

  • Upon deletion of which elements does the message appear? Only charts or...?
    – Runnick
    Commented Mar 15, 2018 at 9:37
  • If users will commonly need or want to "undo" adding charts, why interrupt them and put them on a timer to make a decision? How long does it take to add a chart?
    – moot
    Commented Mar 16, 2018 at 20:02
  • @Runnick Anything that can be added or deleted. More precisely, the items are different chart types, e.g. Bar Chart added. The app is a sort of dashboard builder. Commented Mar 16, 2018 at 21:02
  • @Moot It takes maybe a minute or so to add a chart. The mental effort goes into selecting the desired metrics and choosing the right chart. The notification isn't only about the undo link. It's primarily a 'success' confirmation, and is especially useful when the chart is added below the fold. It doesn't necessarily interrupt - - that depends on what the user's next task is. Commented Mar 16, 2018 at 21:07
  • Notifications and alerts are interruptions by design. Yes there are levels of interruptions but it's still an interruption. From your descriptions and example, it looks and sounds like these confirmations are a regular part of the application. "Adding charts" fails often enough that users need to check and confirm each one? Or it's about rewarding the user because adding a chart is a big task?
    – moot
    Commented Mar 18, 2018 at 13:52

3 Answers 3


I believe 30-40 seconds are fair enough for the user to undo an accidental delete. If I have deleted something accidentally, I will quickly undo it. So, in my opinion, 30-40 seconds is enough time for the user. This is when you are displaying the notification prominently.

Gmail keeps the notification visible until 60 seconds or until the user opens a new message. But, Gmail has a trash folder too.

The measures which you can take to avoid accidental loss of data:

  • Ask for confirmation from the user while performing a delete option.
  • Make the delete button prominent and at a distance from other buttons to avoid accidental clicks.

Coming to your last point about stacking of notifications, I believe they appear when the user performs another similar action. Hence, that itself is an indication that user doesn't want to undo the previous delete action and he has already started a new task on the application. So, stacking or overlapping of notifications should not be an issue in this case. To make it more clear, keep the delete notification appearance different from other notifications(maybe a different background color or position?).

I hope this answers your query.

  • Fair enough -- but just to be clear, the notification is not displayed only for delete messages. It is displayed for other actions too, such as Chart Added. I have attached an image to show this. Do you think the time suggested is appropriate in this case also? Bear in mind, the messages could have a mix of 'added' and 'deleted' :) Commented Mar 15, 2018 at 11:58
  • 1
    @MichaelHeraghty I checked the post images. One point which I think is wrong is that you don't need to display the "Undo" option in some cases. For instance when chart is added, you don't need that option. Just provide a delete button on the chart to delete that chart instead. So, just keep the Undo for very critical tasks.
    – K K
    Commented Mar 16, 2018 at 3:48

I would recommend deciding on whether or not undo is a command that is available or whether it is only to recover from the most recent action.

If it is a command that is always available and will walk the state of the application back through N states (e.g. Photoshop lets you walk backwards through everything you've changed via undo), then I would not show an alert at all. I would make 'Undo' a menu option somewhere that is static.

But it sounds like you've already made that decision for your app.

So, since undo is to only recover from the most recent action, I would say that the alert should remain visible until it is actively dismissed by the user (which I see you have on you example UI - kudos!) or another state change occurs - as in, they navigate away from the screen, delete another chart, create another chart, etc. Having the option fade away after N second is dangerous because you cannot assume the users attention is actively on the screen. They may have someone interrupt them after accidentally deleting something or their device may lockup for a brief period because some other application is hogging resources. Were this to happen, the alert (and the ability to undo the action) would be gone with no way for the user to recover from their mistake.

  • Yeah, the undo is available to recover from specific recent actions. To clarify, the alter remains visible for 60 seconds, then fades away OR may be dismissed. If the user hovers over the alert, the countdown is reset to 60 seconds again. Note that the stacked alerts may block content beneath. There is a way to recover -- actions can be easily 'redone' -- it is just that undo is quicker. Commented Mar 15, 2018 at 14:52
  • 2
    I would lean away from showing the multiple alerts though. So only the most recent deletion could be undone. That would avoid them potentially blocking other content and keep within the pattern of there only being 1 level of undo. Right now, it feels like you're mixing multiple undos with 1 undo...to me, at least. I know it's subjective though. :)
    – Miniversal
    Commented Mar 15, 2018 at 15:18
  • 1
    Interesting. So one notification would immediately replace another? Commented Mar 15, 2018 at 15:48
  • Yeah, exactly. That's how I envisioned it. I probably didn't explain it well though.
    – Miniversal
    Commented Mar 15, 2018 at 16:12
  • 1
    If anything can be deleted I would back @Miniversal and won’t show undo notifications at all.
    – Runnick
    Commented Mar 17, 2018 at 8:34

Ask your target audience.

The best way to find the answer to your question is to break the designer/user barrier.

Different users have different tastes. Just like the Goldie Locks fairy tale, you have to find out which 'porridge' tastes best for your particular users.

Find a small group of people or go out into the 'wild' and ask people that match your target audience. This test can be implemented and completed very very quickly and cheaply.

  • It's a fair point. I think usability testing will help discover the answer for this context. I just wanted to know if there was a convention here. Commented Mar 15, 2018 at 15:46

Your Answer

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

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