Just some food for thought - Why have a cancel button so close to the "save it" button, where a person could accidentally click it and lose their work?
The close button at the top right suffices as a cancel button, no?
Sure, but I'd argue that the "modal" paradigm is analogous to the "windows" paradigm used in our OS's, which is unmistakable.
The contrast between the buttons sets the save button apart very well, but the cancel button but is still superfluous and redundant.
The strongest argument for removing it, I think, is the fact that the cancel button can be misinterpreted as the save button, causing extreme user frustration.
This is something I read in 37 Signal's first book "Defensive Design for the Web." It made perfect sense, as I had done this once or twice in the past, and it's just stuck with me for years and years.
That's a good point, but there's also no other way to close this OSX dialog.
I advocate removing it all together in favor of one iconic close button (your X at the top right).
I should really mention that I love this and can't wait use all of the new UI you've been rocking. We'd be stoked to beta test on our participatory politics setup ;)
Leave it in if your web audience is primarily windows. If this is an advanced CSS3/webkit primary site take it out… If you have non-geek end users, leave it in. We did a lot of user testing on this and 90% of the time non-techies always clicked the X instead of cancel. When we presented them with only "cancel" or "close" at the bottom, often out loud they would say "how do I close it?" then find it after a few seconds. With the [X] they always found it right away.
12 Responses
I've been working on a style for Lighthouse's modal dialogs.
over 1 year ago
Pro
Liam McKay
Inevitably beautiful. Spot on.
over 1 year ago
Pro
Morgan Allan Knutson
Just some food for thought - Why have a cancel button so close to the "save it" button, where a person could accidentally click it and lose their work?
The close button at the top right suffices as a cancel button, no?
over 1 year ago
Pro
Buck
From my experience having a "Cancel" button at the bottom a modal alleviates confusion from those not exactly used to the modal paradigm.
over 1 year ago
Pro
Morgan Allan Knutson
Sure, but I'd argue that the "modal" paradigm is analogous to the "windows" paradigm used in our OS's, which is unmistakable.
The contrast between the buttons sets the save button apart very well, but the cancel button but is still superfluous and redundant.
The strongest argument for removing it, I think, is the fact that the cancel button can be misinterpreted as the save button, causing extreme user frustration.
This is something I read in 37 Signal's first book "Defensive Design for the Web." It made perfect sense, as I had done this once or twice in the past, and it's just stuck with me for years and years.
over 1 year ago
Morgan, are you proposing removing it or moving it to the other side?
My defense is that Cancel is in almost every modal window in OSX: http://d.pr/NeOU (for example)
over 1 year ago
Pro
Morgan Allan Knutson
That's a good point, but there's also no other way to close this OSX dialog.
I advocate removing it all together in favor of one iconic close button (your X at the top right).
I should really mention that I love this and can't wait use all of the new UI you've been rocking. We'd be stoked to beta test on our participatory politics setup ;)
over 1 year ago
Thanks Morgan, I'll let you know if we end up having a way to beta this. Not sure if that will be possible or not.
As for the button, I'll play around with the idea of no Cancel. I honestly prefer it though. Thanks for the feedback!
over 1 year ago
So when is this coming out? Itching to try.
over 1 year ago
Probably won't see the updates until this coming Winter at some point.
over 1 year ago
Leave it in if your web audience is primarily windows. If this is an advanced CSS3/webkit primary site take it out… If you have non-geek end users, leave it in. We did a lot of user testing on this and 90% of the time non-techies always clicked the X instead of cancel. When we presented them with only "cancel" or "close" at the bottom, often out loud they would say "how do I close it?" then find it after a few seconds. With the [X] they always found it right away.
over 1 year ago
Pro
Tanner Christensen
The look of these buttons is what did it for me, these looks absolutely fantastic.
over 1 year ago