Skip to content

Password field UX woes

TL;DR

How do I know my keyboard is dropping characters on a password field?

The Long

A power cut took out my home server–a Mac Mini running macOS High Sierra. It (sensibly?) has a boot password and encrypted SSD. I brought the system back online to be prompted with the usual login screen. No matter what I did, it would not accept my password.

The Good

After 3 attempts, macOS prompted me with a “reminder” (and suggested I could use a recovery key).

The Bad

The rarely-typed password is pretty hard to enter correctly (that’s on me). But you cannot use a password manager this early in the boot process. There is also no feedback other than the masked characters in the input field, no way to visibly validate the characters being entered into the password field.

There’s a good pattern used in web for assisting here: put the visibility of unmasked password fields in the hand of the user. In my case, the Bluetooth keyboard was misbehaving: it apparently was dropping keypresses (a desperate keyboard swap accidentally fixed the problem).

The UX

Arguably this was all an edge case. I mean how often do you have a broken keyboard? But then you’d be ignoring an accessibility red flag: the input fails due to physical device awkwardness with no user feedback what so ever (other than “try again”). So what about users with alternative input devices?

Apple solved this on iOS. When you tap a key on any field (including password fields) you can get brief flash of that key. Elsewhere on web, a field can toggled between text/password visually, giving the user control of when the field is exposed.

Here’s a demo I put together a while back with progressively enhance password toggling for web:

Screenshot of form with regular password field
Password field (open to see on CodePen)

The question is why this sort of toggle hasn’t made it into macOS.

Leave a Reply

Your email address will not be published. Required fields are marked *