Uiology: The Forgotten Confirmation

Sometimes we ask users to confirm their actions. This makes sense in any situation where the action is not easily undone. Powering down a complicated audio/video system, for example, can take minutes to bring back online which would be frustrating if done by accident. OK. That makes sense, right? I mean, we’ve been doing this for a long time. No big deal. You hit the power button and a page pops up asking the user to confirm their action. But it seems the implementation of this simple idea hasn’t gotten enough love. Let’s take a look at a few examples before we reveal our solution.

 
Example 1

Example 1:
We know that eyes are drawn to buttons, but the button labels here are meaningless by themselves, forcing the user to read the confirmation message. If the user intended to turn the power off, they will correctly assume what they are confirming, but remember, the confirmation page is here to catch actions that were done by mistake.

 
Example 2

Example 2:
Here again, the button labels aren’t any help. In fact, in this case, they don’t even answer the question asked in the confirmation message. The button colors are another issue here. Red gives the cancel button a lot of weight and green doesn’t convey that it’s the action to be careful of.

 

Example 3

Example 3:
The button labels are once again meaningless and force the user to read the confirmation message. At least the confirmation message is the center of attention … which unfortunately also drives the buttons too far apart. As with the previous example, the color coding is counter-intuitive and the button labels don’t properly address the question.

 
Solution

Solution:
Our user-friendly solution has buttons with meaningful labels making their function clear without requiring the support of the confirmation message. Coming to this page will be intentional most of the time, so we added weight to the “shutdown” button by making it wider. We also color coded it red to warn the user of its action. The confirmation message is clear and the cancel button is comfortably available.

 

Uiology™ is our study of user interfaces. In this series we will analyze and document solutions to the GUI, the bad, and the ugly — seeking to raise the bar for the industry we know and love. Drop your thoughts and suggestions in the comments.

7
Comments
  1. The GUI, the bad, and the ugly… How do you come up with this stuff.

    Great write up guys.

  2. This is exactly what we try to study here on our end. Button placement as well has it’s own science. Functions that are more popular need to be stratigically placed and is usually dependant on the type of remote. I enjoyed this article as this is such an important part of integration and is rarely discussed.

  3. Thanks Vincent. We’re looking forward to publishing more articles like this. Let us know if there’s anything you’d like to see covered.

  4. Brilliant. This is very valuable info. Thanks.

    “I got some fixin’ to do.”

  5. Thanks for addressing this issue. I am so very fascinated by this subject. How to enhance the user experience through the study of human behavior and interaction. This is the next great area of study to be applied to the CE industry. Thanks again

  6. For future articles would love to see the following covered:

    – colors and how to integrate color patterns that provide an easier user experience
    – button placement (how buttons are mapped and placed according to importance or relevance)
    – less is more and how to tone down a complicated device

    Thanks!

  7. The Mac shut down confirmation window uses your solution ^^

Leave a Comment

You must be logged in to post a comment.