[keycloak-dev] tooltips started

[Bill Burke]

Problem is that adding the info icon next to some labels puts the label 
on the next line and it looks weird.  Solving this requires increasing 
the label column size to 3  (col-sm-3).  Is that ok?


On 8/14/2014 10:17 AM, Gabriel Cardoso wrote:
>> I like your proposals for the screen you mention.
>
> Cool!
>
>> But for other screens I like the tooltip icons to the right of the input
>> types as it gives a lot of space for the tooltip to appear in.  I'll
>> switch the icon type.
>
> Triggers next to the labels are a PatternFly recommendation: "
>
>   * Place triggers for user-activated help text (icons, links, or
>     buttons) next to field labels and not input fields.
>
> Here is the part of the draft that talks about help:
> https://www.patternfly.org/wikis/patterns/pattern-development/draft-patterns/forms/#copy-help
>
>> Should we have a disable tooltips option?
>
> I don’t think so. User will just interact with them if he wants to. But
> place the tooltips in the console and we can evaluate if there is a not
> for this.
>
> Please let me know when you’re done with the tooltips, so I can review
> the console and make design adjustments :)
>
> Gabriel
>
>> On 8/13/2014 4:33 PM, Gabriel Cardoso wrote:
>>> Hi Bill,
>>>
>>> Here is my proposal:
>>>
>>>
>>> - Remove the tooltip from the heading and display it as a help text
>>> below.
>>>
>>> - Place the info icons close to the labels instead of inputs. Use icons
>>> from font awesome:
>>> http://fortawesome.github.io/Font-Awesome/icon/info-circle/
>>>
>>> - Use tooltips placed at the top, so the user can still see the input on
>>> the right.
>>>
>>> I believe you don’t need some tooltips. In this page, for instance,
>>> available roles and application is pretty obvious (my opinion).
>>>
>>> Patternfly is working on this. Here an excerpt of their draft: "To
>>> ensure that it remains effective and useful, use help text sparingly in
>>> your forms. Striving to minimize the amount of help text on your forms
>>> will push you toward better design solutions. Use help text to explain
>>> unfamiliar fields (particularly for new or infrequent users) or syntax
>>> for complex fields. Don’t use help text to compensate for the
>>> shortcomings of your forms."
>>>
>>> Gabriel
>>>
>>> On Aug 13, 2014, at 10:13 AM, Stan Silvert <ssilvert at redhat.com
>>> <mailto:ssilvert at redhat.com>> wrote:
>>>
>>>> On 8/12/2014 4:32 PM, Bill Burke wrote:
>>>>> I did it for "Settings, Users, Roles" and their submenus.  Let me know
>>>>> if you like them.  Going to finish them up tomorrow.
>>>>>
>>>> This is a big usability improvement!
>>>>
>>>> I noticed that among Settings, Users, and Roles, there is still some
>>>> help text missing.  Assume it's just work in progress?
>>>>
>>>> Under Users --> Attributes --> Required User Actions, only half of the ?
>>>> icon shows up.   The field hides part of it. That made me wonder if the
>>>> help text was incomplete or hidden.  The only other ? icon on that page
>>>> is User Enabled.
>>>>
>>>>
>>>> _______________________________________________
>>>> keycloak-dev mailing list
>>>> keycloak-dev at lists.jboss.org
>>>> <mailto:keycloak-dev at lists.jboss.org><mailto:keycloak-dev at lists.jboss.org>
>>>> https://lists.jboss.org/mailman/listinfo/keycloak-dev
>>>
>>> ---
>>> Gabriel Cardoso
>>> User Experience Designer @ Red Hat
>>>
>>>
>>>
>>> _______________________________________________
>>> keycloak-dev mailing list
>>> keycloak-dev at lists.jboss.org <mailto:keycloak-dev at lists.jboss.org>
>>> https://lists.jboss.org/mailman/listinfo/keycloak-dev
>>>
>>
>> --
>> Bill Burke
>> JBoss, a division of Red Hat
>> http://bill.burkecentral.com <http://bill.burkecentral.com/>
>> _______________________________________________
>> keycloak-dev mailing list
>> keycloak-dev at lists.jboss.org <mailto:keycloak-dev at lists.jboss.org>
>> https://lists.jboss.org/mailman/listinfo/keycloak-dev
>
> ---
> Gabriel Cardoso
> User Experience Designer @ Red Hat
>

-- 
Bill Burke
JBoss, a division of Red Hat
http://bill.burkecentral.com