“Cancel” is Not Just For Dialogs

One of my favorite features in Apple’s presentation software, Keynote, is the presenter display. During a presentation, the presenter can view additional information on the computer’s main screen, while the actual slideshow is displayed via a projector or on a secondary monitor.1

The items that can be viewed on the presenter display, are:

  • the current slide,
  • build-markers for the current slide,
  • the next slide,
  • a Ready to Advance indicator,
  • the current slide’s notes,
  • the current time, and
  • a timer showing either:
    • a configurable count-down, or
    • the time that has elapsed since starting the presentation.

I want to see what’s coming

When in customization mode — prominently indicated by a yellowish barber pole — all of these elements can be moved freely across the screen. Some can also be resized.

The default arrangement looks like this:

KeynotePresenterDisplayDefault

To show or hide an item in the presenter display, you un-/check its checkbox in an HUD-style dialog box.2

The buttons in the floating dialog box work just as you expect them to: when you click Cancel, all changes you made since entering customization mode will be discarded; clicking OK accepts those changes; and clicking either button will exit customization mode. If you prefer using a key press: the Escape and Return keys are properly assigned to the Cancel and OK buttons, respectively.

Take me back to where I was

There is one problem, though: if you click Use Defaults to restore the presenter view to its fresh-out-of-the-box layout, and then click Cancel, only part of the changes that were caused by pressing Use Defaults will be dismissed — namely the checkbox selection in the dialog box.

The size and position of the displayed elements, however, will remain at whatever the default settings are; they will not be discarded and, consequently, the layout will not be restored to what it was before you clicked Use Defaults.

Have a look at this screenshot, which, by the way, shows my favorite setup for the presenter display:

KeynotePresenterDisplayModified

After clicking Use Defaults, then leaving the customization mode by pressing Cancel, and finally going back to customization mode, this is what the screen looks like:

KeynotePresenterDisplayAfterDefaultCancel

My original selection of what to show on-screen has been preserved, but how those items are shown now reflects the application’s defaults that resulted from pressing Use Defaults in the dialog box.

I am certain that this behavior is a bug, but it serves as a good reminder of considering the proper context for user-selected actions.

The context of Cancel and Undo operations

Pressing the Cancel button is not just about dismissing a dialog box. Much rather, it’s about preventing recent changes from becoming permanent; recent changes that result from a user action.

In a way, you could think of the cancel button’s function as “anticipated undo.”

In the case of the presenter display in Keynote, the action to be “anticipatedly undone” is the entire customization of that presenter display, and not just the change of the selections within the confines of the dialog box.

On a related note, users should be able to easily predict what, exactly, will happen when selecting the actual Undo command from an application’s edit menu.

I’ve been stumped many a time by software applications that only support undoing a selection of actions, instead of every single action that the software lets you perform.

In such applications, if the most recent action, or actions, you performed are not undoable, a seemingly random one that you performed a few steps earlier will be undone, instead. The result of that undo is not be what you expected, and, also, not what you wanted.

Applications can very easily help their users understand what, exactly, will happen when using Undo or Redo, by simply naming the relevant action in the menu command’s label.

Here’s an example from the image editor Pixelmator that makes it perfectly clear what will happen when you execute the command:

PixelmatorUndo

Pixelmator even goes one step further: for some of its commands — including Undo, Redo, and selections — the application displays a small message on the screen that automatically disappears again after a moment. This message lists what action you just performed, like “Undo Selection,” as seen below.

PixelmatorUndoBezelMsg

Thanks to the combination of explicit Undo/Redo labels and this quick status “shout-out,” no guessing is required to understand what you just (un)did.


  1. To use the presenter display, you need to check the option “Use alternate display to view presenter information” in the Presenter Display preferences panel. If you wish to view it without a projector or second monitor attached to your Mac, select Rehearse Slideshow from the Play menu. 

  2. This modal dialog box should not have been outfitted with the standard Close Window button, because that button’s functionality is ambiguous: will closing the dialog box by clicking the close button discard any changes, or will it accept the current settings and layout, before leaving the customization mode?

    The Cancel and OK buttons make it perfectly clear what will happen if you click either one, and they also make the dialog box’s close widget redundant. Hence, the latter should simply not be there. 

A New Poster Child for Web Form Validation

Most websites that allow or require data to be entered into free-form text fields validate this data before accepting it. This is to ensure that, for example, email addresses are valid, phone numbers adhere to a certain format, or that the contents of “Choose Password” and “Retype Password” fields match.

An iterative (and painful) approach to form validation

All too often, form validation is a painful iterative process for the user. It typically goes something like this.

You enter the data into the web form and click Submit. If an error is found in any of the fields, the page with the form is displayed again, now including a message stating that “One or more fields contain invalid data” and highlighting some of the form’s fields.

If you’re lucky, you will find more information on the page about how to fix the errors, like “Phone numbers may only contain digits and dashes”3 or “The password contains invalid characters.”4

When you think you’re done correcting the issues, you hit Submit again, and you may very well be presented with the next batch of fields whose contents don’t validate.

And so it goes until the website deems any and all of your entries to be worthy of acceptance.

Real-time. Relevant. Plain English.

UJAM, a promising new online music creation tool that was launched only recently, provides a much more user-friendly approach to form validation.

The first impression that you get when you open the UJAM.com sign-up page, is that of a standard web form (albeit a very elegantly designed one). As soon as you start entering data, though, whatever you enter is validated immediately and in real-time.

Each text field has its own validation result message displayed right next to it. This message can reflect one of three states — Info, Error, and OK — which are indicated through icons as well as color. Additional information, including instructions on how to fix any errors, is given in plain language.

Plain and simple options, too

The checkboxes at the bottom of the registration form are just as plain and simple: accepting the Terms of Service and the Privacy Policy is straight-forward, and either option links to the related documents.

The two opt-in opportunities — for subscribing to the UJAM newsletter and for allowing UJAM to share your information with third-parties — provide concise information on what either checkbox does. Just as importantly, this web form does not leverage double-negations or similar dark pattern tactics to lure the user into accepting an option against their will.

I may be a bit blinded by the fact that I’m really excited about what UJAM has to offer (and I do not use the term “excited” lightly), but I doubt that I have ever felt quite as confident about properly filling out a web form on the first try as I have when I signed up for a UJAM account.

Update 2011-05-18: In hindsight, it was a good idea to include the disclaimer about me being “a bit blinded:” When I pointed other UX designers to this web form, they immediately criticized some of its design details, and rightfully so.

The validation messages are intrusive: As soon as you begin filling out the form, the validation process starts, and the resulting messages appear almost instantaneously. As a result, the website will most likely reprimand you for an error in your email address or your password, just because you are not typing fast enough.

Additionally, the validation process repeatedly cycles through “no message” to “gray empty message” to “validation status/error”, as seen in this little video clip.

Intrusive, indeed!

Here are a few ideas to make the validation system appear less pushy:

  • Display the informational messages for all fields as soon as the page loads.
  • Increase the delay with which the validation status message is updated.
  • Instead of using a red or green background for the entire message area, restrict color to the icons and the hairline around the text entry field.
  • Use smoother transitions so the changes in icon and text are not quite as abrupt.

Some of the validation messages are curt: The messages should be friendlier than, e.g., “Password is too short”. This specific example also is less than unhelpful, because it does not explicitly state how many characters are required.

Phrasing this as a positive call-to-action makes the interaction with the form friendlier and easier: “Enter a password that is at least 8 characters long.”

The links to the ToS and Privacy Policy are hidden: The text strings “Terms of Service” and “Privacy Policy” next to their checkboxes are clickable, as are most occurences of “Privacy Policy” in the longer text section in the upper right.

During my first visit to this site, these links were easy to find, because of their solid black text color that nicely contrasted the gray of the copy text.

Apparently, the designers have modified this, because those links now have the same color as the copy text. Since they are not underlined or set in bold, either, there is no visual indication of their “clickability” at all.

UJamLinks

Only when you hover over one of the links will the text color be changed for highlighting, as in this screenshot. “Terms of Service” in the upper checkbox is a link as well, but it is literally impossible to recognize it as such.


  1. A common problem with many websites is that they insist that phone numbers be entered in the North-American ten-digit format, even if the site is aiming for an international target audience. 

  2. It never ceases to amaze me how many websites that present this error, fail to provide a simple, explicit list of characters that are allowed for use in a password. 

A DRM-Induced Usability Nightmare

To most media company executives, Digital Rights Management is a means to prevent pirating of their digitally distributed content. Alas, what they rigorously keep ignoring is that the restrictions that come with DRM-“protected” content only affect honest customers, whereas pirates couldn’t care less.

Sometimes, DRM matters are made even worse by technical implementations that are plagued by major usability issues, resulting in an abysmal overall user experience.

A soulful case-in-point

Motown’s legendary studio band, The Funk Brothers, are among my all-time musical heroes. Their story is told in a wonderful documentary, entitled “Standing in the Shadows of Motown,” which has been published on DVD a few years ago. As an enticing bonus, the DVD contains two Windows Media video files with the entire movie in HD format.

Sorry, Mac, you can’t play!

For a Mac user, the most common way of viewing video files is by opening them in QuickTime Player. While the QuickTime media architecture does not have built-in support for Windows Media files, you can make it “understand” Windows Media content by installing a software package called Flip4Mac.

When I tried to open one of the two HD videos in QuickTime player, however, Flip4Mac brought up an error message, stating that it is “unable to play DRM protected content.”

After I had dismissed the Flip4Mac error message, the QuickTime Player displayed another, which, due to the way it was phrased, added some confusion instead of helping me fix this problem.

Flip4Mac is the software officially endorsed by Microsoft for playing .wmv files under Mac OS X. Due to its lack of DRM support, though, the only way to view DRM-infested Windows Media content is on a machine running Microsoft Windows.

And even on that platform, some Windows Media files remain barred from — perfectly legal — access…

Software that’s old and tired

For those rare occasions when I need to test a website in Internet Explorer, I have a very clean and very up-to-date installation of Windows XP SP3, which I run under VMware Fusion on my Mac.

Assuming that I would be able to view the HD videos on this virtual machine, I launched WinXP in Fusion, opened the movie DVD in Windows Explorer, and double-clicked its dvdrun.exe file.

And up came this dialog box:

I wasn’t exactly sure which application this dialog box belonged to, but I did get my hopes up about being able to watch the movie files after all. Until…

Confirming that both of these requirements were met was as easy as launching Internet Explorer 8 and running an online search for “Artisan Entertainment.” One of the results was the Wikipedia entry for this company, which, incidentally, stated that they had been acquired by Lions Gate in 2003.

When an error message is factually wrong as in this case, this is not just a matter of bad design, what with the message being useless for finding a fix for the underlying issue. More often than not, it also means that said underlying issue is much worse than what it says in the error message.

Can I see your PC’s ID, please?

The one remaining option I could think of at this point was to open the movie files directly via double-clicking. As a result, Windows informed me about requiring some kind of update:

Security Update Required

The owner of the protected content which you wish to access requires an update to some Microsoft DRM components (Digital Rights Management) on your computer.

If you click “OK,” a unique identifier and a DRM security file will be sent to a Microsoft service on the Internet. The file will be replaced by an adapted version containing your unique identifier.

This way, the protection through DRM will be increased.

The “More Information” button leads to a page on the Microsoft website, stating the following:

Security Upgrade

Owners of secure content may also require you to upgrade some of the DRM components on your computer before accessing their content. When you attempt to play such content, Windows Media Player will notify you that a DRM Upgrade is required and then ask for your consent before the DRM Upgrade is downloaded (third party playback software may do the same). If you decline the upgrade, you will not be able to access content that requires the DRM Upgrade; however, you will still be able to access unprotected content and secure content that does not require the upgrade. If you accept the upgrade, Windows Media Player will connect to an Internet site operated by Microsoft and will send a unique identifier along with a Windows Media Player security file. This unique identifier does not contain any personal identifiable information. Microsoft will then replace the security file with a customized version of the file that contains your unique identifier. This increases the level of protection provided by DRM.

Note how this text slyly mentions “personal identifiable information” while leaving the user in the dark about what, exactly, the “unique identifier” contains. It neither explains what this identifier’s function is, nor how it “increases the level of protection.”

I’m not sure whether this is just bad technical writing, or whether this text is intentionally vague. In any case, the result of this phrasing is that, to a non-techie user, this request may sound like this: “Before we let you view this content, we’ll have to do something to your computer, but we don’t really want you to know what exactly that is. Just trust us!”

I also wonder whether this is a one-off process that will enable viewing other DRM-“protected” content on this computer in the future, or whether this process has to be followed for every single file or, at least, for every unique publisher/content provider.

A server detour to nowhere

Once the update process had completed, the Windows Media Player launched and started loading the movie file. Instead of simply playing the video, however, a window titled “License Acquisition” was opened:

Apparently, the “security update” did not suffice. I had to go through further licensing hoopla before accessing content that — just as a quick reminder — I had paid for.

It didn’t take too long, and that black void in the window was filled — with a default webview error message:

What you see in this screenshot is the standard error message — “This program cannot display the webpage” — that an IE-based webview will display when it is unable to connect to a server.

This message along with its trouble-shooting tips is, of course, completely and utterly useless at this point, because it is out of context: I am not accessing this website in a browser, but in a native application. Consequently, there is no way I could, say, manually enter the webserver’s URL again. I don’t even know what that URL is.

The only thing I can do at this point is verify that my machine’s Internet connection is working properly. If it does and, therefore, is not the cause for this error, I’m simply stuck.

Considering how old the DVD is — some seven years, or so — I assume that Media Player cannot fetch the required licensing information because the licensing server simply does not exist anymore or that it has moved to another domain.

The proper way to handle this problem would have been to display a message, stating that the software “Cannot retrieve the digital license required for viewing this video. Please verify that your Internet connection works properly, and try again. [OK]”

In fact, why not add an extra dose of honesty to that message: “If the problem persists, you’re screwed, because you won’t be able to access digital content that you honestly paid for. Sucker!!”

Adding insult to injury, I got to see this when I closed the Windows Media player application:

You have acquired a new license for protected content.

You should save your licenses in case the original licenses may be damaged.

Would you like to save the licenses now?

Clicking Yes is followed by a confirmation dialog, listing the path to the license file.

At the end of this annoying little DRM dance, Windows Media Player still added the movie file to its play list as if it were perfectly accessible.

Alas, it wouldn’t start playing, of course. And to nicely round off this awful experience, clicking the Media Player’s play button would start the whole process all over again.

DRM: As tiresome and offensive as it’s always been

Digital Rights Management technology not only puts limitations — and oftentimes severe limitations — on how honest customers can access digital media content they legally purchased. DRM can also be plagued by major usability problems, as seen in this case:

  • The software licensing check is not transparent: the user is confronted with additional windows with confusing wording that, from a non-technical user’s point of view, are not directly related to viewing the content.

  • “Unlocking” the content requires network access: if you try to initially access the content while you don’t have Internet access — on a plane, on a train, in a hotel, etc. — you’re out of luck. Also, you cannot tell from the information provided by Microsoft whether this update is required for each new content file you want to access, or whether a single update will suffice for accessing “protected” content in the future.

  • Due to technical problems, the content may not be accessible at all, and there is no proper information why this is the case. If the licensor goes out of business, you may even lose access to their content for good.

It’s long overdue that media companies stop bossing their customers around once and for all: get rid of DRM technology and let your honest customers enjoy the media they purchased whenever, wherever, and however they want.

You know, just like pirates have been doing all along.