I dedicated one of my external hard drives to Time Machine. As such, I need to reschedule some backups using Dantz Retrospect.

By the time you’re able to reschedule a backup, this is what the screen looks like:

And what dialog-laden application would be complete without the coup de grace – the unnecessary confirmation dialog. Not to mention confusing: what’s the difference between “Cancel” and “Don’t Save”? And the lack of any significant alignment along with an opaque background on the info bubble, gives the whole thing an amateur look.

What can we learn from all this? Apart from the overall design, which I really, sincerely hope was not the work of a trained interface professional from any domain here are some general dialog issues:

• Inconsistent Modality – Only some of these dialogs are modal; inexplicably so.
• Inconsistent or No Terminating Actions – Only some of the dialogs have “OK” and “Cancel” buttons.
• Placement of Terminating Actions – Western reading order is from top-to-bottom, left-to-right. The least effective location of “OK” and “Cancel” will be in the top-right corner.
• Minimal Saved State – If I took the time to carefully position these windows, it would be worthless because the application fails to record this information. It appears to save the position of some of the windows, but not all. Again, inexplicably so.
• Arbitrary Depth – In general, a single nested dialog is as deep as we should go (i.e. a dialog within a dialog). Retrospect seems to have no practical limit on the depth of the dialog rabbit hole.

I haven’t used Retrospect for Windows, but perhaps its interface got a little more attention. Judging from this PC World Review, I doubt that’s the case.

“Regrettably, the sweeping overhaul that I’d envisioned didn’t materialize in the shipping version of the $129 program. Instead, I found a new set of wizards that step users through basic chores such as backing up, restoring data, and duplicating a partition. Though the wizards are nice, they don’t make up for the application’s continued use of arcane terminology such as “sets” and “volumes,” or its odd workflow decisions such as splitting file selection into three nonconsecutive steps.”

Whatever my criticisms of Memeo’s LifeAgent (which I’ll address in a future post), it suffers from nowhere near the amount of navigational excise featured in Retrospect.

The only reason I’ve used Retrospect for so long was its price tag (free with my Western Digital drive), but if that’s your only strong suit, you’re leaving a lot on the table.

Sayonara Retrospect, we had a good run.

In a dialog-laden application, ensuring proper resizing behaviour can be a considerable undertaking. It becomes even more time consuming (and less fun!) if you haven’t taken resizing into consideration during initial design and layout of each form.

What’s the answer? Lock the dialogs of course!

Here I am, setting up a new “Backup Plan” with Memeo’s LifeAgent software – it came bundled with my Buffalo 500GB external drive, which I’m using for Apple’s Time Machine.

I have a 30″ monitor that I donated a kidney and a toe to pay for. Don’t force me to squint to see the most important bit of information I can think of: what files are being backed up.

What’s interesting is how simple the strategy for resizing would be!  In this mockup, I expanded the original width and height by about 40%.

Label-like controls retain their initial alignments, tables consume all available horizontal width and the backup table consumes all vertical width.

Scrolling isn’t the end of the world, but it sure is a pain. Spend the extra few minutes giving your dialogs proper resizing behaviour and deliver us from this interaction.

We’re interviewing heavily at the moment, and I find myself printing resumes from Outlook. We typically attach them directly to the interview itself (i.e. the “Meeting” or “Appointment” in Outlook).

Since Outlook offers context menu support, right click on the attachment and choose “Print”…

Except this doesn’t actually print the attachment. Instead, Outlook chooses to “stop the proceedings with idiocy” (to borrow a phrase from Cooper in About Face). Note that in Apple’s Mail program, this ridiculous dialog does not appear. I instruct the machine to open a file and it opens it, no questions asked. In Outlook however:

There are numerous problems with this approach:

• The first is the worst – I choose “Print” yet none of the options I provide allow me to print. I bet you’d believe me if I said that since there is no Print button. (Un?)fortunately, clicking “Open” allows me to print.
• We’re used to clicking through these useless confirmations so if there really was a problem, I wouldn’t know it until it was too late.
• There is no information related to the warning. I buy in to the notion that I should only open attachments from trustworthy sources, but why warn me without giving me any way to know that the sender is trusted? If there was a way for me to ask the dialog, “Can I trust this person?” that would be great. Even better would be for the computer to do that work for me and just assume I’d like to know if they can be trusted.

Outlook is passing the buck in an attempt to make me an accomplice, both of us jointly culpable for the opening of a hazardous attachment. They get away with it because we tend to blame ourselves when things go wrong, not the computer. We even hear this as we describe our unfortunate situation to others:

“A virus killed my computer.”

“You don’t have a virus scanner?” (i.e. its your fault)

“No, I do… but it didn’t catch it.”

“Didn’t outlook warn you about potentially bad attachments?” (i.e. it’s your fault)

In Donald Norman’s latest book, The Design of Future Things:

“This kind of blame-and-train philosophy always makes the blamer, the insurance company, the legislative body or society feel good: if people make errors, punish them. But it doesn’t solve the underlying problem. Poor design, and often poor procedures, poor infrastructure, and poor operating practices, are the true culprits: people are simply the last step in this complex process.”

The 99/100 times Outlook prompted me, it was needless. The 1 time I did need this prompt, really needing Outlook to be there for me – it wasn’t. Don’t set me up to fail and blame me for failing after the fact.

So why the prompt?

When opening attachments in Firefox, I’m not quite sure what to make of this, the download attachment dialog on OS X:

“Open with Choose…” ? But it already knows it’s a PowerPoint Presentation. I click OK and it works.

At least it works :-)

Even a terrific freeware browser could use a little touchup:

Improvements:

• The filename, the most important bit – is front and center. Second most important bit – the application – is next in line. Scanning ability is right on here. “filename – application – OK” done! No reading per se, just scanning the larger, bolder bits.
• Removed a whole lot of fluffy text.
• Rephrased “Save to Disk”… what’s a disk?
• Extracted the checkbox outside of the emphasized form elements because it’s not all that important. The depressed elements (in the grey area) are what you should be focusing on, not the optional control.
• By re-laying out the form, removed several near-alignment issues.

Outstanding questions:

• I’m on the fence as to whether or not the site URL deters people from downloading untrustworthy files, but I suspect the people it’s meant to help, it’s not.
• The text for the “automatically” checkbox isn’t in title case in order to further de-emphasized it. Is this the right way to go?

Thoughts?

Hardware vendors often provide hardware “emulators” for developers to increase the speed by which we can create software for them. For example, an emulator for Pocket PC looks like this:

Because the emulator runs on my desktop, I don’t have to worry about buying one (costing me $) or configuring it (costing me my sanity). I can test my website from the emulator with very little turnaround time.

Only because the cost benefits are so significant would anyone struggle through setting this up.

STEP ONE – INSTALL

After downloading the emulator, let’s install it. Oops!

STEP TWO – TYPE

If typing long URLs made up of random characters killed zombies, I would be overjoyed at seeing this dialog. As it does not, each keystroke provided repeated insight into the psyche of the developer. Sadistic? Hurried? Junior? Who’s to say really. Rather than take the time to use a hyperlink control (1-5 minutes) he lazily pasted the URL into the error message.

What’s worse is that this dialog is completely unnecessary. The purpose of the installer is to walk me through the process. Why, when something is wrong, should a separate window tell me? Isn’t that the installer’s responsibility? The installer window is huge and would have easily fit this long error message.

And what am I saying “OK” to? Things are not OK. I should be clicking on a button called, “Download Virtual Machine Network Driver”.

Lastly, the wording in both the initial setup screen and this dialog show that someone without a terrific command of the English language was responsible for this creation. It’s a shame when companies assume things like the setup process and error messages don’t need to be scrubbed by tech writers.

STEP THREE – DOWNLOAD VM NET DRIVER

Finally, a quick download of the Virtual Machine Network Driver for Microsoft Device Emulator and I’m all set!

One click on “Download” and I’m good to go. OOPS!

Note: This download has now been retired. If you would like to get the Virtual Machine Network Driver, please download Virtual PC 2007 from: http://go.microsoft.com/fwlink/?linkid=46859

Another error message, another URL I can’t click on.

Any why do I have to read this? Why didn’t the initial download page automatically forward me to the Virtual PC 2007 download?

Or even better, why isn’t there a packaged version of Virtual PC 2007 for Pocket PC developers? That would have solved the entire problem from the beginning – 1 download with everything I need.

STEP FOUR – DOWNLOAD VIRTUAL PC 2007

I was able to download Virtual PC 2007 and install it without difficulty.

STEP FIVE – RUN THE EMULATOR

Now that I have everything setup… after grinding my teeth typing URLs and jumping through additional steps, the Pocket PC emulator starts up.

After installing and starting the emulator, I’m staring at a blank screen? After all of the time and effort put into the install, it’s a safe bet to assume that I might actually want to run it.

I can’t recall if I clicked on the power button to start the emulator or if I had to activate a menu option…

…but at least I didn’t have to type any more URLs.

As you browse the web, various components are cached (reused) to speed up your experience. For example, why download the eBay logo anew on each ebay.com page? It rarely changes, so just keep reusing the same one.

What happens when we don’t want things cached? For example, your online bank statement. If that were cached and someone broke into your computer, they could see your bank statement web page sitting in the cache.

To prevent this behaviour, set the Cache-Control HTTP header. It’s a bit technical, but basically you tell someone’s browser not to store sensitive information in the cache.

What about sensitive attachments? For example, viewing your account statement as a PDF. In Internet Explorer, this is not possible.

“Wait!” you’re saying. “Rob, I just did this today. I went to TD Ameritrade and viewed my transaction history as a PDF and it worked!”

Alright, I wasn’t quite honest there. It is possible in Internet Explorer, but in order to do so you have to instruct the browser to store the PDF in your cache. If the security of your machine is compromised, an attacker doesn’t need your bank account numbers or customer numbers; they’re sitting there on documents in your cache.

According to Microsoft “This behaviour is by design.” After all, if you tell your browser not to store the attachment, how can you view it after downloading? This is their statement, in a nutshell.

Firefox doesn’t have this problem

How is this related to usability?

There are downstream effects to Microsoft’s decision. They could have implemented this (Firefox does), but chose not to. If you want to offer secure downloads to your clients, you can’t. A decision having nothing to do with anything more than a function call at Microsoft dictates how businesses are best able to serve their customers.

It’s a pretty simple case of the needs of the machine being given more importance than the needs of the user.

The above-linked article makes mention of the specific API call to open the file – IPersistFile::Load – as the reason why this impossible.  It just as easily could be ITransientFile::Load or IMemoryFile::Load, right?  Or how about Internet Explorer deletes the file from your cache when it’s done viewing?  Lots of possible solutions here but all we’re given is a technology-first justification of why it’s broken today.

Then again, if any of you are looking towards Microsoft as a paragon of secure computing, I have some bridges for sale…

Much preferring the BBC, I rarely visit CNN. I’m not a fan of CNN’s reporting but I am a fan of their recent redesign. Here’s a little touch that I like:

The most imporatant bit is big and bold, standing apart from the others by at least two perceptual variables (size, color).

The subdued text gets me thinking, “Oh they have a Work/Life Balance column? Cool what else is there?” but unfortunately that isn’t a hyperlink – only the title of the article. What I do like about the subdued text: it gives you context for the article as well as saying, “yes we have some related articles but the article itself is more important – not the classification.”

An interesting touch is that it’s in ALL CAPS which normally reads as though you’re being screamed at.  Because of the small stature and decreased emphasis via color, that effect is minimized, if not wholly eliminated.

Good stuff. I’m glad to see a pro worked on that site.

A colleague forwarded along an excellent essay explaining various development practices, the most interesting of which is the Stage-Gate process. Let’s look at a sample 12-month period, greatly simplified:

Waterfall: Take 12 months to throw 1 huge blob against the wall. If it sticks, great. If not, you’ve failed.

Agile: Every month, throw 1 small blob against the wall. By month 12, you’ll have a bigger, stickier blob than Waterfall. But it will still be one blob.

Stage-Gate: Every month throw many smaller blobs against the wall. Nurture the blobs that stick, recycle the ones that didn’t. By month 12 you’ll have a few sticky blobs; more than Agile.

What’s missing is that none of these practices prescribe any method to increase the likelihood that something sticks.

To quote Daniel Cook, the author of the afore-linked article, “It is better to release less than it is to release more of poor quality”.

To quote Shigeru Miyamoto, the father of modern video gaming, “A delayed game is eventually good, a bad game is bad forever.”

If your only change is to implement Agile or Stage-Gate (or both) then you’re bound to fall into that trap. Shoveling more “piles of software” at your customers isn’t likely to endear them to your organization.

I’m reminded of an email from Kim Goodwin to the “Cooper U Alumni” mailing list:

The root of the problem with agile methods is that people are trying to fix a non-engineering problem with a method that comes from within engineering. At Cooper, we tend to think that agile methods arose primarily as programmer self-defense, based on the assumption that the people coming up with the spec (usually marketing) aren’t really going to be able to figure things out without going through a lot of iterations. Of course, most of our clients who’ve tried agile methods have realized they still don’t solve the problem of what to build and how it should behave, because these aren’t engineering problems [emphasis mine - Rob].

While Agile and Stage-Gate reduce risk, how about getting to the root of the problem and supplying your customers with something they can’t live without?

Neither practice will help you do this, but they won’t hurt.

eBay gets this partly right by telling me “You have no messages” versus leaving this area empty and me wondering what’s going on.

Let’s go a little further and remove the now-unnecessary sorting and browsing controls.

Small change, but it lets me ignore this section more quickly by reducing processing overhead for form controls that do nothing.

When you have several pages of search results, what’s the rationale for including links to intermediate pages; anything other than “Next” and “Previous”?

Amazon gets it. Here I am browsing through recommendations.

Google doesn’t get it, and they even do it in a cutesy way by aligning page numbers with O characters.

“Hmm… I see here I have 18,000 results and at least 10 pages. How about skipping to page 7.”

Not likely, because there’s no fresh meat, no ’scent’ for us to pick up on that would indicate page 7 will be any different than any other page, other than a number. What does the ‘7′ mean anyway? Are the results 7x worse than page 1?

Just because we have to break the results into pages doesn’t mean we should offer the ability to jump to any one page. If we did want to offer that ability, the intermediate links are better represented by their content, assuming some sort of reasonable sort.

Rather than considering the content as arbitrary pages, consider the reason for looking at this information in the first place. For example, if you’re shopping are you price sensitive?

(these are mockups by the way, they don’t really exist on Amazon)

How about browsing new DVD releases?

Whatever someone is doing, they’re doing it for a reason. Don’t throw away an opportunity to improve navigability by forgetting to contextualizing your links.