Dev/Design Weekly Demo Notes - Users, User Groups

Sharing my notes from the weekly Dev/Design Demo. This week Marek presented
on Users, User Groups, Roles.

These are my notes and thoughts only from a UX/UI perspective, they are not
mandates and are open to feedback/discussion.

General Comments - issues found throughout the application:

Button color, placement and style - Buttons appear outside of standard
color, stylization and layout expectations.
2.

Title case for forms and buttons - Some form labels and buttons do not
follow title case. For example in the Users section: Authorized by
(incorrect) vs. Authorized By (correct).
3.

Inline Messaging Stylization and placement - layouts are inconsistent as
well as placement on the page.
4.

Documentation Button - This needs to be evaluated for best placement and
color. It varies throughout the application.
5.

Infotips - many fields have additional description text that should be
placed in an infotip. Occasionally the description text is redundant to the
form label.
6.

There is the occasional tooltip on a button. I find it intrusive. A
good rule of thumb is that if a button isn’t self-explanatory, then there
is something wrong with the button or the process.

Notes:

Password authorization - Weak/Normal/Strong visualization would not pass
528 compliance for those visually impaired. The colors associated with each
strength level seems mismatched. For example: Normal is red. A red status
as well as form field highlight indicates an error. Weak is grey, and also
possibly not high enough contrast for the visually impaired. The solution
may be to simplify the password strength to text only, “Weak Password,
Strong Password”. Also - greater thought or discussion could be had around
“Normal” or “Strong”. If a “Normal” indicator is shown, does this actually
change user behavior in the same way “Weak” does? Perhaps only “weak” is
needed.

Inline messaging regarding email notification should be moved above
content but within the content box.

Login button changes to loading. I believe this is not standard
patternfly behavior.

Users > Email settings
1.

  Search drop down has a find field. It doesn’t seem like this is 
  practical given the limited number of choices and the inability to make 
  more options. 
  1. 
     
     I believe an alternate layout and input method could be used that 
     would make choices more obvious at first glance.
     2. 
  
  Order of fields changes on submit. They should remain in the same 
  order.
  3. 
  
  Test Email button seems misplaced and not patternfly standard button.
  
  2. 

Admin/Administrator check boxes - Text labels should be consistent.
Consider using infotip to better describe the role. A better layout may
also make it feel less out of place when placed alongside the dual
pane/shuttle selector.

Edit User Page:
1.

  Description (box description is generic and most likely not needed).
  2. 
  
  Re-login Permission denied box layout is not correct. Filter field is 
  touching masthead.
  
  4. 

User Group Main page - Delete button, text is red. A default grey
button should be used. Perhaps confirmation of deletion in terms of
extended implications could be displayed?

New Authorization Source Create page does not follow patternfly.

LDAP Authentication Page > Account:
1.

  Group Base field is shorter than LDAP Filter.
  2. 
  
  LDAP filter should be larger to accommodate multiple line filters 
  (common)
  
  7. 

User Groups > External groups:
1.

  External groups = External Groups
  2. 
  
  I believe the table functionality could be improved to show more 
  details/actions with potential inline editing. This would remove the “show 
  linked external user groups” button whose results displayed could be 
  extraordinarily long. 
  3. 
  
  As an additional note - moving away from two-pane view would allow 
  detailed pages like this to take advantage of additional screen real estate.

Hello,

Do we have the recording for the corresponding report ?

Thanks,
Rahul Bajaj.

··· On Wednesday, January 11, 2017 at 11:34:36 PM UTC+5:30, Roxanne Hoover wrote: > > Sharing my notes from the weekly Dev/Design Demo. This week Marek > presented on Users, User Groups, Roles. > > > These are my notes and thoughts only from a UX/UI perspective, they are > not mandates and are open to feedback/discussion. > > > > General Comments - issues found throughout the application: > > > 1. > > Button color, placement and style - Buttons appear outside of standard > color, stylization and layout expectations. > 2. > > Title case for forms and buttons - Some form labels and buttons do not > follow title case. For example in the Users section: Authorized by > (incorrect) vs. Authorized By (correct). > 3. > > Inline Messaging Stylization and placement - layouts are inconsistent > as well as placement on the page. > 4. > > Documentation Button - This needs to be evaluated for best placement > and color. It varies throughout the application. > 5. > > Infotips - many fields have additional description text that should be > placed in an infotip. Occasionally the description text is redundant to the > form label. > 6. > > There is the occasional tooltip on a button. I find it intrusive. A > good rule of thumb is that if a button isn’t self-explanatory, then there > is something wrong with the button or the process. > > > Notes: > > > 1. > > Password authorization - Weak/Normal/Strong visualization would not > pass 528 compliance for those visually impaired. The colors associated with > each strength level seems mismatched. For example: Normal is red. A red > status as well as form field highlight indicates an error. Weak is grey, > and also possibly not high enough contrast for the visually impaired. The > solution may be to simplify the password strength to text only, “Weak > Password, Strong Password”. Also - greater thought or discussion could be > had around “Normal” or “Strong”. If a “Normal” indicator is shown, does > this actually change user behavior in the same way “Weak” does? Perhaps > only “weak” is needed. > > > > 1. > > Inline messaging regarding email notification should be moved above > content but within the content box. > > > > 1. > > Login button changes to loading. I believe this is not standard > patternfly behavior. > > > > 1. > > Users > Email settings > 1. > > Search drop down has a find field. It doesn’t seem like this is > practical given the limited number of choices and the inability to make > more options. > 1. > > I believe an alternate layout and input method could be used > that would make choices more obvious at first glance. > 2. > > Order of fields changes on submit. They should remain in the same > order. > 3. > > Test Email button seems misplaced and not patternfly standard > button. > > 2. > > Admin/Administrator check boxes - Text labels should be consistent. > Consider using infotip to better describe the role. A better layout may > also make it feel less out of place when placed alongside the dual > pane/shuttle selector. > > 3. > > Edit User Page: > 1. > > Description (box description is generic and most likely not needed). > 2. > > Re-login Permission denied box layout is not correct. Filter field > is touching masthead. > > 4. > > User Group Main page - Delete button, text is red. A default grey > button should be used. Perhaps confirmation of deletion in terms of > extended implications could be displayed? > > 5. > > New Authorization Source Create page does not follow patternfly. > > 6. > > LDAP Authentication Page > Account: > 1. > > Group Base field is shorter than LDAP Filter. > 2. > > LDAP filter should be larger to accommodate multiple line filters > (common) > > 7. > > User Groups > External groups: > 1. > > External groups = External Groups > 2. > > I believe the table functionality could be improved to show more > details/actions with potential inline editing. This would remove the “show > linked external user groups” button whose results displayed could be > extraordinarily long. > 3. > > As an additional note - moving away from two-pane view would allow > detailed pages like this to take advantage of additional screen real estate. > > > > > > > > > > >