Why Are Media Roles Necessary?

Sometimes the best image to show a customer doesn't work at all sizes. Sometimes different images for every role will be needed, and sometimes just one or two images will be sufficient. However, in many cases one image will work in all situations, and all roles can be assigned to the single media file. It just depends on the media.

Looks fine at 900 pixels

This image looks fine as a primary image when it's large.

Hard to see at 200 pixels

The same image is more difficult to see when it's smaller in a collection of items.

Better at 200 pixels

This image is better for a collection of items. (Compare the key, welcome vertical banner, and gather accent.)

Difficult to see at 72 pixels     Difficult to see at 72 pixels

At the thumbnail size — such as a shopping cart summary list — both images are difficult to see.

Best at 72 pixels

This image is better for the thumbnail.

swatch  swatch  swatch  swatch  swatch 

Swatches, for configuring options like color, are usually shown at a very small size as part of the website's interface.

When preparing swatch assets, remember that swatches can also be seen at larger sizes.

Brick Wall Better Than Paper

Assigning Media Roles

Media can be assigned to one or more possible roles.

Primary Role

Primary role illustration

Collection Role

Collection role illustration

Thumbnail Role

Thumbnail role illustration

Swatch Role

Swatch role illustration