Braindead UI - Hijacking User Input
A longstanding user irritation on Windows was the habit of bringing up a modal dialog which takes input focus away from the current application, known as focus stealing – something Windows XP and later largely prohibit by default, because of how irritating and destructive this was.
Apart from the user irritation, the main problem was that keystrokes would go to the wrong application – in particular, hitting the spacebar would select the default option in any MessageBox which opened, answering a question you didn’t see with an anwer you didn’t intend, then taking the question away again so you may not even know what you just did: cancel a print job? Disconnect your Internet connection? Reformat your external hard drive?
As this stealing focus article says, stealing focus from the user is never acceptable. The same logic, of course, applies to changing the meaning of a control while the user is interacting with it
Apparently Google+ failed to learn this lesson, bringing a new version of the focus stealing problem into the web environment. Look at a Google+ profile and you will see a box in the top right which resembles a button, saying “Add to circles”. It resembles a button – so you click it, right? No – as soon as the pointer reaches the ‘button’, it gets replaced with a list of your Circles. In trying to click the button, you actually click on the top menu item instead, which adds this person to your “Friends” Circle – probably your most trusted, with access to almost everything you share – immediately.
It’s easy enough to correct this, of course, and add the user to the Circle you intended – just irritating. For contrast, Facebook have a menu on the right of their menu bar for accessing account settings and other things. Compared to the Google+ example, it has 3 key advantages:
- Consistency and user expectations: the downward arrow creates an expectation of a menu coming up.
- Positioning: the new menu appears underneath the button triggering it, so the object directly under the mouse pointer doesn’t change function.
- Triggered by pressing, not hovering: Facebook’s button responds by opening a menu when you click on it, as you expect. Google’s reacts, by replacing itself with a different control, to you merely hovering over it – so the click you intended to open the menu actually goes to another control, producing unexpected and unwanted results.
Apple have an interesting varation on this in some iOS interactions. An app or piece of music will have the price displayed as a button; touching it changes the button text to ‘buy album’ or similar, so touching it a second time triggers the actual purchase and download. A very slick and seamless confirmation mechanism.
