Match between system and the real world The system should speak the users' language, with words, phrases and concepts familiar to the user, rather than system-oriented terms. Follow real-world conventions, making information appear in a natural and logical order.
-- Jakob Nielsen's 10 Usability Heuristics for User Interface Design
Recently I found myself searching for a new rubber stopper for a piggy bank. I needed a short and wide rubber stopper or cork. The hole in the piggy bank has to be big enough to get the coins out of the bank yet the stopper must be short enough to allow room for many coins to fit in the small bank.
Not knowing where to find an item with this shape I started by searching the websites of some big name hardware stores. My hope was to visually scan pictures of items until I saw what I wanted and then drive to that store to buy it.
Here's what I found when I searched for "cork" at Lowes.com:
None of these products appear to be short and wide corks. I tried the same search at Home Depot but saw the same set of pictures. Well possibly corks only come in one shape--I could only think of one common use of corks off the top of my head.
Next I decided to try searching for "rubber stopper" at HomeDepot.com and saw this:
Now surely rubber stoppers have more than one use and more than one size. This is when I noticed the little size notations under the images. But which of the dimensions is the height and which the width? And is the width measured at the top, where the stopper is widest, or at the bottom where it is narrow?
As far as I can tell from the pictures all the rubber stoppers in the store must have the same proportions, none of which are appropriate for my poor little piggy bank. At this point I gave up trying to figure it out based on the website and drove over to look in person. It turns out that indeed they do sell (relatively) short and wide rubber stoppers and I was eventually able to fix the piggy bank.
Now if the images had been of the exact products listed instead of the same generic image over and over I would have saved quite a bit of time on this simple task.
Additional consideration: if the same image shows for every variant of an item it appears that the store has less variety than it actually does.
While Nielsen focuses on the use of language in his explanation of the "match between system and the real world" heuristic, this is a great example of how important it is to match visual cues to the real world as well.