On 2013-11-06 11:05 PM, Steven Walling wrote:
On Wed, Nov 6, 2013 at 10:51 PM, Jared Zimmerman
<jared.zimmerman(a)wikimedia.org <mailto:jared.zimmerman@wikimedia.org>>
wrote:
p.s. Preview would be a progressive action, not a neutral one,
since the user would need to Save to finish the process flow of
making an edit.
This is an example of why I think having the two states is potentially
too big a burden on the user. In your scheme, Save and Preview would
each be a large colored button, one green and one blue, correct? This
seems potentially detrimental, since they're right next to each other,
and thus would seem like they have the same priority.
On login right now, we're using something like the scheme you
proposed, but the visual hierarchy is really really obvious because of
the placement in the vertical form. It's a login submit button and
then a CTA.
--
Steven Walling,
Product Manager
https://wikimediafoundation.org/ I do see a need for 4 buttons states but I
don't agree with this NPDC
structure either. Specifically I do not like calling the dark blue
button "Constructive".
I don't consider Constructive to be Blue nor do I consider Green to be a
form of progress through the form.
From my perspective a green button implies a form of
creation or
sometimes success (however green as "success" is typically
reserved for
messages, progress bars, etc... not buttons).
This implication differs from that of the dark blue button (which in
other UX such as bootstrap's I've seen called "primary") and I think
that both of them are necessary.
My perspective is that these states are needed (colours are for my/our
culture but may be substituted if another culture or even design has
different expectations):
Neutral = Grey
Destructive = Red
Constructive = Green
Primary = Blue
On the edit page the submit button would be Primary (Blue) while the
others are Neutral (Grey).
Constructive buttons are the antonym to Destructive buttons. Destructive
buttons imply you are about to destroy something or do something hard to
take back. Constructive buttons imply you are about to immediately
create or add something new.
In general most of our current forms wont start using Constructive right
away. Our edit form, login forms, move, etc... typically have the
implication of submitting a form rather than truly creating something
and for those forms the submit button should be Primary.
However Constructive buttons may find situations they are useful in
future creations. A good example for the use of Constructive buttons is
something where something you're modifying is laid out as a vertical
table of entries. You may have red Destructive items for each entry on
the table. And a green Constructive button down at the bottom as part of
a UI for adding a new entry.
I don't necessarily mean a table editor but something where the
individual entries in the database are simple enough to be laid out as a
table. For example a special page listing interwiki prefixes with a
green Constructive button to either add a new interwiki or open a larger
form to add a new interwiki (which one it does is implied by whether the
button is part of an inline form or alone).
Another example is on a larger type of edit page form (maybe something
like one in a Semantic Form's UI) that has a blue Primary submit button
at the end there may be a list or table of stuff somewhere in the middle
(say one listing categories or template sub-entries in the form) with a
green Constructive button on the same page below the list that adds a
new entry before you save.
~Daniel Friesen (Dantman, Nadir-Seen-Fire) [
http://danielfriesen.name/]