The Importance of Conventions

Conventions are important. They emerge as the ‘way things are done’. As such, when we see a control on a device, we apply our previous knowledge of similar systems and make assumptions about what will happen when the control is activated. The more experience you have in a particular field, the more conventions you know. The more conventions you know, the quicker you are at learning something new; but only as long as the conventions are followed.

When you held your first MP3 player you (probably!) instinctively knew how to play and pause a track. You’d never used one before, but you knew how to do this because the manufacturer correctly followed the control conventions from CD players, which in turn had followed the conventions of cassette players. You didn’t need to learn anything new.

A convention has built up for audio playback that vertical bars are used for volume controls and both Windows XP and Mac OS X use them. This fits in with previous conventions, audio mixing desks have vertical sliders too. It also has a good affordance – you push the slider up to turn the volume up and pull it down to turn it down.

Horizontal bars, by convention, are used for indicating the progress of a track. For example, in iTunes, the shaded area represents played audio, the unshaded area represents unplayed and the diamond is the current position in the file:

Other applications follow similar conventions, so why, when designing the iPhone’s volume control did Apple do this?:

To my eyes, the controls at the bottom are skip back, pause, skip forwards then a track position indicator. It even follows all the conventions: It’s horizontal, it has a shaded area to show the elapsed audio, an unshaded area to represent the unplayed and a marker to show the current track position! Fantastic, until you try and use it to skip to the end of a track and then painfully find out it’s the volume control! I’ve seen so many people do this when showing them my iPhone – I probably should warn them actually!

So, what could Apple have done to follow the convention and have a vertical slider?

  1. Use a vertical volume slider running down the side of the screen
  2. Have a smaller slider to the height of the control pane
  3. Have a pop up volume control

Ok, 1 is just ugly. We don’t do ugly so that one can be discounted. Option 2 sacrifices fidelity of control (or would at best make it fiddly) and for something as personal as volume this would be unacceptable. Also, 1 and 2 would stop the interface looking nicely balanced and symmetrical which wouldn’t do! So that leaves us with option 3. This is no good either as it makes changing the volume a 2 step process and for a common interaction like changing the volume this would be annoying!

So, it appears Apple had a legitimate reason to ignore the convention – a tall thin screen makes a horizontal volume control the best choice. However, where they went wrong is that they broke a convention but then kept it secret until you discover it through making a mistake! They should have done something like this:


This simple addition of volume icons removes any questions over what the slider does and that is worth the price of a slight reduction in slider length.

We notice when conventions aren’t followed and get tripped up. This doesn’t mean it’s wrong to break them as long as your reasons are good and you make it clear to your user that you have done so!

Share this post:
  • Add to favorites
  • email
  • Digg
  • Reddit
  • del.icio.us
  • Slashdot
  • Google Bookmarks
  • Technorati
  • HackerNews
  • StumbleUpon
  • Twitter
This entry was posted in Tutorials and tagged , , , . Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

One Comment

  1. Posted November 28, 2008 at 10:25 am | Permalink

    I agree. You learn a lot of conventions, and then when you design something yourself you have to remember the subconscious learning you have so you don’t make mistakes. Some metaphors, icons and techniques are so discrete you don’t realise you are using an established control technique. The “triangle on it’s side” does everything from “Play” to “Build and Run” – either function it’s purpose is pretty clear.

    The iPhone. For a technologically inferior phone, this phone seems to have an unwarranted level of hype, which is typical of Jobs. I’m willing to accept it’s a preference thing, maybe people prefer the usability which is admittedly a key feature of a Mac (personal preference only, not that any other platform is fundamentally harder to use). But the volume control clearly weakens the “usability” card. If the screen is tall, tough, you need to be as clever in your UI design as you do when your makign tarty coverflow controls. They could of course put a nice, tactile rocker switch on the side of the device like every other phone has – which is physically re-inforced to prevent accidental holding down and consequent deafening.

    @programx

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*