Files available to download for free
The following files are made freely available for commercial use, including modifying and distributing without attribution.
You can also download a detailed presentation on the research and rationale that underpins these recommendations.
- Mobile is becoming the majority platform for grocery shopping.
- In order to help shoppers get the right product, e-commerce images should communicate:
- Type of product (format)
- When shopping online, the size is usually impossible to interpret from a pack shot.
- For personal care and household products, the type of product is often difficult or impossible to interpret from a pack shot.
- We recommend using off-pack communications to supplement a pack shot and provide the missing information.
- These are typically coloured stripes and icons that do not overlay the image, as shown in the best practice examples above.
- When using coloured stripes, we recommend that:
- The bottom right box should be the brand colour.
- The larger stripe should be the variant colour.
- The text in the larger stripe should be the technical product name, as the retailer would describe it.
- When using the laundry icons, the colour of the icon should change according to the variant.
- Whenever size information is communicated off-pack, it should be bottom right. This is the only position that is consistently available for products that are tall and thin, and also for products that are flat and wide.
- The font within the coloured stripes is Google's 'Open Sans'. This was chosen because its free to download, and it was designed to be legible on all screen sizes.
- In order to avoid 'Visual Armageddon', off-pack communications should be consistent within each product category. Therefore, retailers will typically only accept off-pack communications if the source files are freely available for commercial use.
- The initial scope of these recommendations is:
- Solely limited to the design of off-pack communications.
- Non-perishable products only.
- Single packs only, not multi-packs.
- These recommendations were authored by the University of Cambridge, Engineering Design Centre. They were commissioned by Unilever.
How do we know they are better?
Most people want to complete their online grocery shop as fast as possible.
Our research found that shoppers rarely read the caption that accompanies the image, this is typically the cause of people accidentally buying the wrong size.
We tested best-practice images against typical pack shots using our SEE-IT tool. The outcome is reported in this news bulletin.
When we tested these off-pack communications with shoppers, they helped them shop faster and they preferred them.
More best-practice examples of e-commerce images
Images © Unilever plc. Reproduced with permission.