Fix inconsistent UI in the password field

In the password field, the UI is inconsistent between iOS and MacOS.
The images show the ‘Toggle visibility’ eyeball button and the ‘Check if password has been exposed’ checkmark button have swapped places.

This is a really bad UX, as the muscle-memory of where each button is located gets disrupted when swapping between iOS and MacOS and the wrong button is regularly pressed. This is exacerbated because the icons on the buttons are small, minimal and basically look similar at a quick glance, so there is cognitive overhead to discern which is which and decide which to press.

The feature request is to match layout for these UI elements in iOS and MacOS, (and also ensure consistency with Windows and Android)

1 Like

@MatthewGrantAU Welcome to the forum!

Seems like the Desktop app and browser extensions use the :heavy_check_mark: :eye: :black_square_button: order in View mode and :heavy_check_mark: :eye: :arrows_counterclockwise: in Edit mode — so it is the iOS UI that is inconsistent, and would need to be fixed. Therefore, I changed your topic tag from app:all to app:mobile (I also added the word “fix” to the beginning of your topic title, so that it would have the form of a feature request).

Interestingly, the Web Vault also has its own UI design for these password field elements:

image

 

FYI, in the new UI design for the browser extension (which is likely to set standards for UI redesigns of the other apps, as well), the checkmark is only shown in the Edit mode (View mode only has the visibility toggle followed by the copy button):

image

1 Like

… just a personal comment on that: since the “eye” is in other contexts (browsers…) also next to the password field, the “iOS inconsistency” seems to be more intuitive (or habitual) to me, I guess… :thinking:

I suppose that we can say that good design is in the “eye” of the beholder, but actually, I don’t disagree with your point of view. However, as long as we’re sharing personal opinions, in my view, the :heavy_check_mark: button is entirely superfluous and only clutters the UI.

If one uses randomly generated passwords of any reasonable length, then the probability that the generated password would match a previously leaked password is negligible; offering users the option to check an individual password at the time of creation only encourages bad security habits (i.e., creation of non-random passwords). And as a way to check for a password compromise ex post facto, individually clicking the :heavy_check_mark: button for ) every login item in the vault is not a practical option — one would instead use the Exposed Passwords Report to check the entire vault at once.

So it seems that the :heavy_check_mark: button may have been a feature proposed by the marketing department. In my view, it should be eliminated from the UI (and this would be the best way to implement @MatthewGrantAU 's feature request).