User Experience Guidelines, Mac v. Windows

Now, I’m much more familiar with the Mac UI than Windows because I’m a Mac user and a Mac (and iPhone) developer. I’m not sure this applies to Windows developers, but every Mac developer is also a Mac user. That is to say Xcode, Interface Builder, Dashcode and all the rest of the tools also follow the Apple HIG (for the most part). Another way to put it: when you’re developing a Mac application, you’re using bonafide Mac applications.

I have a bookmark folder item in my Safari bookmark bar labeled Cocoa. It was there originally to drop in any Cocoa developer sites as I found them, any tutorials, any interesting items related to Mac (and now also iPhone) development. Trouble—and serendipitous benefit—is that rather than taking the time to create yet another folder item for more general stuff, I just kept throwing everything inside the Cocoa item. I suppose that’s an unconscious exposure of my world view when it comes to development: everything starts with Cocoa.

Why? No, not because I’m some kind of Apple fanboy do I go for Mac stuff. It’s the other way around. Having chosen Mac in 1984 and investigated every other platform to come along since then, there’s nothing better. A matter of opinion? Well, if evolution is the “opinion of” rather than “theory of”, then yes, yes it’s a matter of opinion.

So anyhoo, inside the Cocoa folder I found an item that pointed to Windows Vista User Experience Guidelines. Right off the bat, the UI of their webpage (over which Microsoft has complete control, I click and get this:

<div align=”center> <br/> VistaUEG.png <br/><br/>

Nice start, huh?

So Windows itself if chock full of UI/UE donchas, so I decided to go see what Microsoft thinks are no-no’s. But then I changed my mind and decided to think positively. I skip #1, ‘What’s New in Windows Vista.’ because I really don’t care what’s new. Users don’t seem to care either, so why should I? I started with #2, ‘Top Rules’ which ‘summarizes the top rules that the Windows Vista Design team suggests you follow to create high-quality, consistent Windows Vista UIs.’

Rules? Ok, I’ll bite. Rule #1: Use the toolkits provided for UI elements and use the system font. Ok so far, but I’m still not comfy with “rules” for interactive products. Rule #2: Common Controls and dialogs. First illustration:

<br/><br/> ControlsAndDialogs.png <br/><br/>

Anyone spot the owie here? Well, two, really, but stupid and superfluous as displaying all the various file extensions for the image type is, I’d be here all night talking about how much Windows shows TMI. Well, three: where’s the large type clearly indicating the reason you’re being bothered with a modal dialog?

Americans, in case you hadn’t noticed, read left-to-right, top to bottom. They’ve correctly defaulted the “Save” button, but haven’t put it in the proper place: the bottom-right of the dialog is the logical end point of the dialog box. Put the defaulted button there. That’s the logical choice for Roman scripts (like English, Dutch, German, western languages in general) and that implies a natural target. The default choice should be in the natural target area. I imagine more than once, Windows users have clicked “Cancel” by accident since it’s the final element.

Yes, I really could go on and on and on. Just let me add one little bit of wisdom from the Icons section: “Icons in Windows Vista are either three-dimensional and shown in perspective as solid objects, or two-dimensional objects shown straight-on. Use flat icons for files and for objects that are actually flat, like documents or pieces of paper.”

<br/><br/> IconShoulds.png <br/><br/>

Yeaaaah, flat. Is flat. Flat for flat. Flatty, Flatty two by four.

Except the icon representing a piece of paper is a piece of paper that’s dog-eared. Dog-eared ain’t flat. And even if it was flattened, paper still has thickness. For their argument, wouldn’t a flat panel display be flat? No? Huh.

Top-level Rule #3: Top Guidelines Violations. Already with the violations? Seriously? My favorite fuck-up in the Windows UI is when they use a determinate-appearing dialog animation that in no way represents the determinate task at hand. (A determinate progress bar is one where the task is finite and known: a progress bar or circle whose appearance matches the, well, progress of the task. When the bar has filled 100%, the task is complete. Indeterminate progress only indicates that something is going on which the computer cannot calculate with any certainty.). That Windows example? The confusing and dumb-ass file-copy dialog. When I first saw it way back when, I thought that each file flying over to the receiving folder was one copied file. Stupid me for thinking a document flying from one folder to another didn’t match the task of one document flying from one folder to another.

Comparing this top-down rules-approach to whip galley-slave-developers into line with the approach that Apple takes..well, it’s the carrot and the stick. Apple’s approach is to justify why you do things in a certain way so that the user is happy. On a Mac, success == happy users. Good applications that look clean and are only as complex as they need to be (and that is hidden as much as possible— *.jpeg, *.jpg, *.jfif ????—and work just like every other Mac application where they have something in common: e.g., ⌘Q is always the Quit Command. Quit is always at the bottom of the Application menu (the menu bar item that is named for frontmost application). Same with a default New, Open, Close, Close Window, Save, Page Setup, Print, etc. These aren’t just suggestions, as the Windows documentation seems to suggest. They’re not only compulsory (given the context and abilities of the application), they’re difficult to work around (but easy to remove those that are inappropriate for your app).

Any complaints you hear about Office applications from Mac folks are from only two problems: speed/responsiveness and bad user interface, which means specifically “not Mac-like”.

Microsoft documentation stands in each pitfall saying “Watch out! Don’t go here!”, while Mac documentation lights the way.

Imagine guidelines that just guide you. Imagine a travel book that did nothing but list all the places you should not go, and only offers positivity like “museums are nice” or “you should look for a hotel with clean sheets”. Welcome to Redmond!