[xwiki-devs] [UX][Standards] Vertical Forms + (Primary / Secondary) Buttons
Hi Devs, I made on incubator (http://incubator.myxwiki.org/xwiki/bin/view/Standards/) a Standards page. This is a work in progress and lots of things need to be added. We really need some standards in order to have consistency throughout the platform. So, for now I propose to use 2 standards: 1. (Primary / Secondary) Buttons http://incubator.myxwiki.org/xwiki/bin/view/Standards/Buttons 2. Vertical Aligned Forms http://incubator.myxwiki.org/xwiki/bin/view/Standards/Forms I hope you will agree and start integrating these concepts in the development of new/existing components. Thanks, Caty
On Thu, Jul 30, 2009 at 12:56 PM, Ecaterina Valica<valicac@gmail.com> wrote:
So, for now I propose to use 2 standards: 1. (Primary / Secondary) Buttons http://incubator.myxwiki.org/xwiki/bin/view/Standards/Buttons
WDYT about mixing the first 2 proposals, having the buttons positioned side by side but with the default action in a darker color ? It'd look like our OSes dialog boxes where the default action is selected by default (having a bit of JS to mimic this behavior could be nice). Also WDYT about having the buttons centered by default ?
2. Vertical Aligned Forms http://incubator.myxwiki.org/xwiki/bin/view/Standards/Forms
+1, having good looking vertical aligned forms is the way to go. Thanks, JV.
WDYT about mixing the first 2 proposals, having the buttons positioned side by side but with the default action in a darker color ?
yeah, that's not clear at all, but that's not a proposal, it was just an img stating that when having two buttons of same kind, there can be confusion. So, the button are positioned SIDE by SIDE and the primary action is gonna be highlighted. The problem is if we want secondary action is represented as a link or as a common button.
It'd look like our OSes dialog boxes where the default action is selected by default (having a bit of JS to mimic this behavior could be nice).
this would be nice - instead of the dark background to have a border that mimics the selected action.
Also WDYT about having the buttons centered by default ?
2. Vertical Aligned Forms http://incubator.myxwiki.org/xwiki/bin/view/Standards/Forms
+1, having good looking vertical aligned forms is the way to go.
Here is a problem. Having vertical aligned forms means we will have the buttons left centered, so the users scans the labels and have a clean path to completion with a button aligned with the form elements and labels. So the centered buttons will not fit in the vertical alignment proposal. Thanks, Caty
On Mon, Aug 3, 2009 at 10:17 PM, Ecaterina Valica<valicac@gmail.com> wrote:
WDYT about mixing the first 2 proposals, having the buttons positioned side by side but with the default action in a darker color ?
yeah, that's not clear at all, but that's not a proposal, it was just an img stating that when having two buttons of same kind, there can be confusion.
So, the button are positioned SIDE by SIDE and the primary action is gonna be highlighted. The problem is if we want secondary action is represented as a link or as a common button.
I think it'd be better to use a secondary button and not a link. This secondary button would be in a lighter color. This might not be the most efficient layout (according to the article you point to [1] the button+link layout wins) but it can be adapted to more than 2 buttons and, IMHO looks a bit better.
It'd look like our OSes dialog boxes where the default action is selected by default (having a bit of JS to mimic this behavior could be nice).
this would be nice - instead of the dark background to have a border that mimics the selected action.
Also WDYT about having the buttons centered by default ?
2. Vertical Aligned Forms http://incubator.myxwiki.org/xwiki/bin/view/Standards/Forms
+1, having good looking vertical aligned forms is the way to go.
Here is a problem. Having vertical aligned forms means we will have the buttons left centered, so the users scans the labels and have a clean path to completion with a button aligned with the form elements and labels. So the centered buttons will not fit in the vertical alignment proposal.
Point taken, again the article you point to [1] is very interesting. We might need both layouts (left aligned and centerd) though. +1 to have rule stating that we must use left aligned buttons with vertical aligned forms. [1] : http://www.lukew.com/resources/articles/psactions.asp
participants (2)
-
Ecaterina Valica -
Jean-Vincent Drean