[Patternfly] UXD Team - Thoughts on multi column forms

Mon Sep 26 18:55:44 UTC 2016

On Mon, Sep 26, 2016 at 11:31 AM, Allie Jacobs <ajacobs at redhat.com> wrote:

> OpenShift has an insanely long form that has parameters grouped. My plan
> is to move that to a wizard. Not every field is necessary and this would
> allow the user to jump to the relevant sections. I looked at an accordion
> but decided against this because the user could still open all sections and
> then see an insanely long form again.
>

Thank you all for the helpful responses. We have the added complication of
the UI being generated based on the data that's sucked in from user created
YAML files (which could have any number of fields ordered in any way). I'm
definitely trying to push on being able to categorize things. I'll look
into the use of accordions vs wizards, too.

@Greg, Matt - if you guys are willing, would you mind sharing the solutions
you've mentioned? Feel free to share offline if that works better for you.
@Allie - I'm happy to brainstorm on using a wizard for this if you need
someone to bounce ideas off of.

Thanks,
Liz

>
> On Mon, Sep 26, 2016 at 11:21 AM, Liz Clayton <lclayton at redhat.com> wrote:
>
>> 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.c
>>    om/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
>>>>>
>>>>>
>>>>
>>>
>>
>
>
> --
>
> Allie Jacobs
> UXD
>
> calendar
> <https://www.google.com/calendar/b/1/embed?src=ajacobs@redhat.com&ctz=America/New_York>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://listman.redhat.com/archives/patternfly/attachments/20160926/979843ff/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/979843ff/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/979843ff/attachment-0001.png>