[Patternfly] Share your thoughts: syntax hints used in forms

[Matt Carrano]

I like the first option also, and feel like this is most consistent with
what I expect.

Matt

On Mon, Nov 21, 2016 at 8:06 AM, Leslie Hinson <lhinson at redhat.com> wrote:

> Nice, thanks for sending out these examples. Out of these two options, I
> prefer the first one and don't find it too visually distracting.
>
> Curious about what others think or are doing to date.
>
> Leslie
>
> On Thu, Nov 17, 2016 at 4:32 PM, Jessica Ryhanych <jryhanyc at redhat.com>
> wrote:
>
>> Hey Leslie,
>> That is a great point – I found two examples of responsive forms that
>> could be a workaround:
>>
>> 1. The syntax text stays visible when a user clicks, but only disappears
>> as they start typing. See here <https://order.emporiumpies.com/>. (In
>> step 1 of the form, pick Delivery to see a few examples.)
>>
>> 2. The syntax text gives the user an idea of the format needed and
>> appears for about 1 second after clicking in the field. See here
>> <https://stuffandnonsense.co.uk/contact>. (look for “Existing website
>> address”)
>>
>> Thoughts from everyone? Would this be challenging to implement? Depending
>> on the length of the form, I could see option 1 becoming visually
>> distracting.
>>
>> Thanks,
>> Jessica
>>
>> */ / / / / / / / / / / / / / / / / / / / / / / / / / / / / / / / / *
>>
>> *Jessica W. Ryhanych*
>> Senior Designer, Employment Branding + Communications
>> Red Hat
>> jryhanyc at redhat.com
>>
>> On Nov 17, 2016, at 10:52 AM, Leslie Hinson <lhinson at redhat.com> wrote:
>>
>> Thanks for sending this out Jessica.
>>
>> One of the things that will be tricky if figuring out a solution for how
>> this text behaves in the responsive states. That would be the advantage of
>> putting syntax help inside the text box. However, I know that it's a
>> usability issue when the syntax help disappears when the user clicks.
>>
>> Leslie
>>
>> On Tue, Nov 15, 2016 at 2:18 PM, Jessica Ryhanych <jryhanyc at redhat.com>
>> wrote:
>>
>>> Hi PatternFly,
>>>
>>> I’m gathering information during this sprint on syntax hints used in
>>> forms and need your feedback. What have you observed? What worked well?
>>> What did you find distracting? What use cases need to be addressed?
>>>
>>> I’ve been reviewing an excerpt
>>> <http://static.lukew.com/webforms_lukew.pdf> from Luke Wroblewski’s
>>> book, Web Form Design, and found a few examples that might be food for
>>> thought.
>>>
>>> *Examples:*
>>>
>>> - syntax hint is below input field, left aligned, font color & weight is
>>> differentiated from label text
>>> <Screen Shot 2016-11-15 at 1.51.13 PM.png>
>>>
>>>
>>>
>>> - syntax hint is left aligned to input field, font color & weight is
>>> differentiated from label text
>>> <Screen Shot 2016-11-15 at 1.25.31 PM.png>
>>>
>>> - syntax hint follows label text, font color is differentiated from
>>> label, placement above input field
>>> <Screen Shot 2016-11-15 at 1.25.39 PM.png>
>>>
>>> Please share any examples from your daily work and/or other
>>> considerations I might have missed. Thanks!
>>> Jessica
>>>
>>> */ / / / / / / / / / / / / / / / / / / / / / / / / / / / / / / / / *
>>>
>>> *Jessica W. Ryhanych*
>>> Senior Designer, Employment Branding + Communications
>>> Red Hat
>>> jryhanyc 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
>
>


-- 
Matt Carrano
Sr. Interaction Designer
Red Hat, Inc.
mcarrano at redhat.com
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://listman.redhat.com/archives/patternfly/attachments/20161121/2bdd6750/attachment.htm>