Cool iOS usability improvement

Apple just fixed a rather irritating usability issue on iOS. This relates to the placement of the playback buttons on the iPhone lock screen.


On the regular music player application, the buttons are placed far apart, as seen below.

(It looks like the buttons are right next to each other. However, the blank space is actually non-functional -- you have to touch the symbols in order to trigger playback functions.)

However, in previous versions of iOS, the playback buttons on the lock screen were closer together, as seen on this screenshot from my wife's phone.

This meant that I frequently pressed the 'previous track' button when I wanted to press the 'pause' button. This is a destructive action, since the music player would forget my place in the current track and go back to the start. This made pausing the music from the lock screen a delicate operation. Habits learned while using the main application could not be applied while using the lock screen -- I couldn't use the same estimate for the horizontal position of the 'pause' button, despite the fact that the button has the same purpose and the same effect, no matter which screen I'm on.

This is something I'd been planning to write about. However, I'm happy to report that Apple have fixed this issue with their latest iOS update. This is a screenshot of the current lock screen.

The controls are further apart, reducing the chance of hitting the wrong button. Also, the visual consistency between the two screens is an aesthetic improvement.

Of course, the vertical position of the buttons is still different. This has never been a problem for me; however, you'd have to perform tests in order to determine whether or not this causes problems for users in general.

There's also the fact that the buttons are quite small -- Fitts's law (roughly) states that the time taken to hit a target is inversely proportional to the size of the target. (It also states that the time is directly proportional to the distance to the target, but this is less of an issue for small touch screens, where all targets are the same distance from the user, unless the user is dragging his finger.) Applying this law, we see that in theory, the buttons would be easier to hit if they were bigger (ie. if the blank space between them was actually functional).

However, I've never actually had a problem hitting the playback buttons while in the main application, despite their small size. Furthermore, since two of the three playback buttons have destructive effects, it might not be a good idea to make them too easy to trigger. Should the buttons be bigger? Again, you'd need to run tests to find out.

I realize that this seems like a tiny issue to quibble over. However, in daily use, small issues like this one can have a major effect on the usability of an interface (especially if there are multiple issues whose effects add up). Furthermore, these issues can leave a negative impression of the 'fit and finish' of an interface.

It's good to see this issue fixed.

An issue with iOS's music player

There's a problem with iOS's music player (on small form-factor devices, specifically) that trips me up from time to time. I thought I'd write about it.

Suppose I'm at the Now Playing screen, and I want to go back to the list of Artists. To do this, I must repeatedly press the Back button. This is in the top left corner.

You'll notice the Back button has now been contextually modified to indicate its destination. However, its function and its location remain the same.

Again, the Back button stays in the same location.

Now, however, the Store button to take me to iTunes is in the same place as the Back buttons from the previous screens.

This is a problem. Since I frequently perform this sequence of actions, my habit is to press the Back buttons rapidly -- which occasionally makes me press the Store button once I've reached the top level. This is a heavyweight action that takes me to an entirely different application.

I must then find another way back to the Music player.

How would I fix this? I'd start by making the space in the top-level screens previously occupied by Back buttons non-functional, so that pressing it doesn't do anything at all when I'm in a top-level screen.

This also provides the opportunity to fix another issue. Why should the iTunes store only be accessible from top-level screens? The desire to buy new music could strike at any time. Therefore, if the Music player needs to have a link to iTunes, it might as well be included in all of the player's menu screens, instead of just the top-level ones.

The obvious place to put such a persistent link would be in the group of persistent buttons at the bottom of the screen. However, since an external link to iTunes is conceptually different than the other buttons (which simply present different views of my music collection), it ought to be distinguished from them somehow. I'd probably do this by changing its color.

I suppose the icon should be prettier though.

This is a specific instance of a general issue -- that of habituation. Users tend to form habits (such as the habit of rapidly clicking similar buttons), and interfaces should account for this tendency, instead of punishing users for it. This blog post from A List Apart discusses the topic.