[Patternfly] UXD Team - Thoughts on multi column forms

Liz Clayton lclayton at redhat.com
Mon Sep 26 15:21:49 UTC 2016


Hi

On Mon, Sep 26, 2016 at 11:07 AM, Vince Conzola <vconzola at redhat.com> wrote:

> Hi Liz,
>
> Without understanding the context, my first thought is that "insanely
> long" seems to be a key phrase in your description. Any configuration that
> requires the user to set 50+ parameters is going to prove troublesome. I
> suggest going back and re-thinking how configuration is being done. For
> example, can groups of parameters be combined into configuration patterns
> that can be selected en masse?
>

I agree, by virtue of the form size it seems like some grouping/organizing
of the content might need to be done. And if there's no getting around
needing a huge form, here are some more ideas for ways to break it down.

   - Progressive presentation - this article might offer some ideas:
   http://alistapart.com/article/testing-accordion-forms
   <http://alistapart.com/article/testing-accordion-forms>
   - Would a wizard be better? http://www.uxmatters.com/mt/
   archives/2011/09/wizards-versus-forms.php
   <http://www.uxmatters.com/mt/archives/2011/09/wizards-versus-forms.php>
   - Use smart defaults and hiding advanced options in a hide/reveal panel?

I think breaking it down for the user somehow would be better than putting
everything in a multi-column form.

Liz C.


>
> My $.02.
>
> Vince
>
> On Mon, Sep 26, 2016 at 10:32 AM, Liz Blanchard <lsurette at redhat.com>
> wrote:
>
>> Thanks for the work you've done on this, SJ.
>>
>> I'm designing a product that has some forms for configuration that are
>> insanely long. Some of them are 50+ field/value pairs which can be
>> categorized a bit, but I've considered using multi-column forms to help
>> reduce the crazy amount of scrolling that would be needed otherwise for
>> these forms.
>>
>> I've also considered easing the pain by trying to bubble up the most
>> commonly used parameters as well as using the 'find' pattern to add a way
>> for users to quickly find a specific parameter within the form...both of
>> which might take away the need for multi-columns.
>>
>> I'd be curious to know if folks think this is a good use case for
>> multi-columns in a form or if there is a better way to tackle this.
>>
>> Thanks again,
>> Liz
>>
>> On Fri, Sep 23, 2016 at 9:27 AM, Catherine Robson <crobson at redhat.com>
>> wrote:
>>
>>> I agree with the conclusion.
>>>
>>>
>>>
>>> On Fri, Sep 23, 2016 at 3:22 AM, Greg Sheremeta <gshereme at redhat.com>
>>> wrote:
>>>
>>>> SJ,
>>>>
>>>> I agree with the conclusion! I sat with it for several minutes, and
>>>> thought to myself -- hmm, I hate all multi-column forms. Then I looked at
>>>> the address form -- yep, hated it. Then I thought about wanting to fill out
>>>> my address -- hm, I hate it when the last name field is under the first
>>>> name. Gah, the zip should always be next to the city! Oh, so, I don't hate
>>>> it! It's exactly correct! lol
>>>>
>>>> And the login/reg is perfect, I'd say ubiquitous. It needs no further
>>>> discussion IMO and can just get stamped as a pattern :)
>>>>
>>>> Once again, great work!
>>>>
>>>> Greg
>>>>
>>>>
>>>> On Fri, Sep 23, 2016 at 2:44 AM, SJ Cox <sjcox at redhat.com> wrote:
>>>>
>>>>> Hello UXD and PatternFly community,
>>>>>
>>>>> Would love to get your input on when, if ever, multi-column forms are
>>>>> okay.
>>>>>
>>>>> This sprint the PatternFly team is working on the conceptual design
>>>>> for multi column forms.  In the case of multi column forms, it’s mostly
>>>>> best practice to avoid their use. The main problem is that using multiple
>>>>> columns within forms could cause the potential for users to interpret the
>>>>> fields inconsistently.
>>>>>
>>>>> However, there are a couple exceptions that seem to be acceptable.
>>>>>
>>>>> - The main exception for using multi-column forms that cause the least
>>>>> amount of confusion were strictly for name and address fields.
>>>>>
>>>>>
>>>>>
>>>>> - The second exception is when there are two different form choices.
>>>>> User must choose to fill out one or the other.  In this case, when the
>>>>> forms fields are shown next to each other in a multi column format, there
>>>>> is little confusion as long as the distinction of the two form choices are
>>>>> clear.
>>>>>
>>>>>
>>>>>
>>>>> Would love to hear your thoughts and input on this topic.  Are there
>>>>> any other scenarios that are acceptable?  Do you agree with the conclusion?
>>>>>
>>>>> Thank you!!
>>>>> SJ
>>>>>
>>>>> *Sarah Jane Cox*
>>>>> User Interaction Designer
>>>>> User Experience Design Team
>>>>>
>>>>> Red Hat, Inc.
>>>>> <http://www.redhat.com/about/whoisredhat/redhatstories.html?intcmp=70160000000TB9vAAG&>
>>>>>
>>>>>
>>>>> _______________________________________________
>>>>> Patternfly mailing list
>>>>> Patternfly at redhat.com
>>>>> https://www.redhat.com/mailman/listinfo/patternfly
>>>>>
>>>>>
>>>>
>>>>
>>>> --
>>>> Greg Sheremeta, MBA
>>>> Red Hat, Inc.
>>>> Sr. Software Engineer
>>>> gshereme at redhat.com
>>>>
>>>> _______________________________________________
>>>> Patternfly mailing list
>>>> Patternfly at redhat.com
>>>> https://www.redhat.com/mailman/listinfo/patternfly
>>>>
>>>>
>>>
>>> _______________________________________________
>>> Patternfly mailing list
>>> Patternfly at redhat.com
>>> https://www.redhat.com/mailman/listinfo/patternfly
>>>
>>>
>>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://listman.redhat.com/archives/patternfly/attachments/20160926/bba70980/attachment.htm>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: Screen Shot 2016-09-22 at 11.23.59 PM.png
Type: image/png
Size: 20267 bytes
Desc: not available
URL: <http://listman.redhat.com/archives/patternfly/attachments/20160926/bba70980/attachment.png>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: Screen Shot 2016-09-22 at 11.06.08 PM.png
Type: image/png
Size: 20063 bytes
Desc: not available
URL: <http://listman.redhat.com/archives/patternfly/attachments/20160926/bba70980/attachment-0001.png>


More information about the PatternFly mailing list