When we build an online shop we are trying to offer an experience as close as possible to a real-world shopping experience. One area of particular difficulty is in giving a clear idea of the real size of a product.

Size

Let’s say you’re shopping for a cellphone online. You are going to be offered various options for browsing, comparing and examining cellphones, but the one thing you’re not going to be offered is a real sense of the size of the phone you want to buy. Amazon.com, who do it better than anybody, offer 3 different-sized images for a cellphone – a thumbnail version, the main product image, and then a Zoom function that lets you see the phone larger than real size.

These various views and tools are great, but they don’t come close to the understanding of scale that we get when we hold something in our hands and look at it.

And, there’s really no solution to this, aside from specially preparing visual information for the web. Amazon isn’t going to spend time on a specially preparing images for the HTC cellphone pictured above, but they will for the Kindle, and their solution is simple and effective – here’s a plain 2D, non-zooming, non-interactive photograph of the Kindle 6” and the 9.7”:

You get a very real idea of how the 6” will fit into your hand and even how easy it’s going to be to use those buttons depending on how large your hands are. You also get a clear idea, even though the images are the same size, of the relative scales of the 6” and the 9.7”.

Scale

Because each product on most online shops (Amazon included) is treated in the same way, the image for each product is going to be the same size. Firstly, it is easier to manage an online shop if all product images are the same size, and secondly if you set the various products at relative scale to each other some items would be too small to see clearly.

Let’s say you’re buying a digital camera. The image below shows Amazon’s “Frequently bought together” feature for a Sony CyberShot HX5 – the camera, a camera bag, and an 8GB memory card for the camera. Because you have some real-world experience of these objects, you understand that the memory card isn’t actually the same size as the camera, but you have no way of telling how big it actually is. The image on the right shows the memory card in scale to the camera, but of course they can’t show it that size because it would look like a vague grey rectangle, not an 8GB memory card.

Solutions

Amazon has spent time and money on photographing their Kindle in-situ so that you get a good sense of the scale of the product before you buy it.

An online “retired goods” shop, Mint, photographs their finds with a matchbox beside them, which gives a perfect sense of scale.

The problem with these 2 methods is that each item needs to be specially photographed. If you’re managing a busy online shop the last thing you want to do is specially prepare each image. We’re currently (June 2011) building an online shop for a client – her bags range in size from the large beach bag at 42cm tall, to the small cosmetics bag at 13cm tall – so we need to figure out how to show her bags so that they are in scale to each other, but so that the small bags don’t become little blobs of colour on the page.

Not actually a problem, but not a good solution either

This is all fairly theoretical because generally we’re perfectly happy working out that obviously the memory card is going to be a bit smaller than it is shown, and it doesn’t really matter how big it really is. You’re not going to not buy the memory card because it’s shown 10 times its relative size to the camera. Still, your shopping experience is imperfect – it is not a good virtualisation of the offline experience of shopping for a camera, but it is the best we have for now. When we come up with a better solution we’ll be sure to tell everyone – including Amazon.