You’re in the middle of getting a program to create a folder for you. There are two buttons at the bottom of the pop-up window for this task. The one on the left is white, the one on the right is black. One says finish, the other says cancel.
If they weren’t labeled, and instead looked like this, which one would you click on to finalize the creation of your new folder?
The black one.
Wow, that would be awful interface design!
But if I knew that the choices were “finish” and “cancel,” I’d take the black button to mean “cancel.”
I picked the black button because:
The black served as a highlight, so the highlighted option should be the one that you would normally do – that is, finish. (If the action were more destructive if accidentally pressed, e.g. “Delete all users’ home directories?”, I’d expect the highlighted button to say cancel.
I’ve been using Macs for 30 years now. The default option should be on the outside of the window. (This is the opposite of Windows, of course.)
The gray outline made me think of something that wasn’t there anymore – i.e., don’t make a new folder. (Of course, a grayed-out button or UI feature has meant a disabled option since at least the days of Lisa and Windows 1.0, so…)
I think they went with a gray outline simply because it matches their new color scheme.
Oh, FTR, I removed the text from the screen capture of the buttons, folks, because this really isn’t a hypothetical question.
Yeah, I think I went with the black one probably because of my Mac background. In something like a Save/Cancel dialogue box, I expect the Cancel to be to the left, and the Save on the right, as well as the Cancel being in white, and the Save being in solid color (blue, usually.) While I do still occasionally use Windows, I actually didn’t notice until now that it’s oriented the other way on Windows, with the Save option on the left, and the Cancel option on the right.
So I’m certain those set of expectations on Mac is what is driving my answer.
With my Windows background I’d default to the left/white button just because I’m used to the [OK] [ Cancel] orientation of the Windows interface.
I would pick the white one, because I expect “action” to precede “cancel”. I would really tell them not to do this. That is horrible UI. Expecting people to guess that with no other clues is bad, at a “make your customers angry or frustrated” level. Put an image on each button if you can’t use text (due to localization, for example).
Bottom right is normally ‘continue’, ‘apply’, ‘OK’, ‘finish’, or ‘next’, so I guess if I was forced to choose, I would assume something like that, except I would be really uncomfortable about it.
I would look around for green and red buttons if I was forced to pick meanings based on colors.
They are labeled in the actual implementation, according to the OP: " The one on the left is white, the one on the right is black. One says finish, the other says cancel. If they weren’t labeled, and instead looked like this … "
I think, although I’m not sure, that the OP is just trying to figure out what actions the users think is most natural for that coloring and orientation of buttons and will either then put the labels back on or report back to whoever he is working on this with that the Cancel/Do actions are assigned to the opposite buttons that most people expect.
Except, on Windows, it’s actually usually the left button.
Unless I could figure it out from mouseover, I would call whoever wrote the farging thing and ask if they did any UAT at all.
Regards,
Shodan
I chose the left one, in the English speaking world right is more likely to be cancel.
Left one to continue, because of general common layout in Windows of “ok/cancel” and “yes/no”, just as others have referenced.
I think I heard somewhere that once you go black you never go back. Is that relevant?
I would click on the button that said “Cancel this program” because that is a dumb program.
Ditto
IOW,that would be about 90% of software design.
I was once the “first user”/gatekeeper for a software house, and I pissed off a lot of programmers by rejecting their UI layouts. As is typical of the breed, it doesn’t matter where you put the button or what it looks like or whether it’s labeled as long as it hooks to the right bit of elegant, elegant I tell you, code underneath.
This was the era of “self-documenting code” as well. It has gotten better, and the rarity of my position has become a little less so. But a lot of code shops still ship stuff with truly awful interfaces.
I also went for black, because to me, that seems to be the highlighted one, which ought to be the default option.