Page MenuHomePhabricator

Design/UX tweaks to login related errors
Closed, ResolvedPublic

Description

Per @cmadeo's note, the following login related tweaks are needed:

  • Inline alert for 2FA verification fail
  • Update red to #d33
  • Update yellow to #fc3

Note: @cmadeo said ok to hold off on the green (top alert) tweak for now.

Event Timeline

Need to add coverage for additional error cases. I was not sure of the desired text, so I did not add additional rows to the "other system messages" section. I ran across the attached case while at a cafe. I imagine there are additional cases to cover, but we should have messaging for blocked usernames and blocked IP addresses and perhaps the reason for the block.

image1 (1).PNG (2×1 px, 251 KB)

@cmadeo Reminder from planning meeting: consider overall form vertical height impact on layout when used in combination with larger dynamic text sizes. (i.e. moving progressive button down from title bar, landscape on phone - for larger keyboard - but longer form needing more scrolling, etc)

Also here: https://phabricator.wikimedia.org/T154725

Oh, we may also have issues if the alerts move inline if the keyboard is covering an inline alert (or if the user is landscape and had to scroll) the user would not be able to see the inline alert...

Discussed some of the issues surrounding this ticket with @Mhurd yesterday:

  • The invalid username message that is returned to us does not have a specific enough message title or consistent enough messaging to replace it with an inline error message at this point.
  • It might be possible to check for invalid usernames before the user submits their create account credentials. @Mhurd is going to look into seeing if the UN string can be checked after the user removes focus from the UN text box (so that we don't have to wait until the user taps on the 'Next' button)
  • This sub ticket (T158253) defines when the inline (in)valid(ation) messaging should be shown for the password and retype password fields so that we don't have to wait until the user taps on the 'Next' button to alert users that their passwords don't match.

Finally, we'll be utilizing a system message for invalid username error messaging (see above) but will move forward with inline messaging for password confirmation (T158253).

JMinor lowered the priority of this task from Medium to Low.Mar 7 2017, 7:38 PM

I'll need investigate which of these are done. Per @Fjalapeno try to knock out as many of these as are presently possible to detect, file backlog ticket for any stragglers.

@cmadeo is scheduling a follow up meeting for next week for this.

Moving to 'Blocked or waiting' awaiting meeting with @Mhurd next week to discuss.

@Mhurd, per our meeting:

  • Inline alert for 2FA verification fail
  • Update red to #d33
  • Update yellow to #fc3
  • Updated green to #00af89
Mhurd renamed this task from Move login related errors in line and clarify their copy to Design/UX tweaks to login related errors.Mar 15 2017, 12:05 AM
Mhurd updated the task description. (Show Details)
Mhurd updated the task description. (Show Details)

@Mhurd it still looks like the inline alert after the password confirmation on login is using orange instead of #fc3

@cmadeo hmm looks like login inline alert is using red...

Screen Shot 2017-03-17 at 3.49.47 PM.png (1×862 px, 93 KB)

Acct creation pwd match seems to be using the correct yellow...

Screen Shot 2017-03-17 at 3.51.07 PM.png (1×862 px, 137 KB)

Do you want the login invalid pwd inline alert to use yellow instead of red?

I'm sorry @monte, I could have sworn it was orange this morning! I might have checked before updating my app. My fault. Everything looks good to me.

@cmadeo no worries! maybe was old version?