skip to primary navigation skip to content

Clari-Fi

Clari-Fi uses blurring to simulate the challenges of viewing small images on mobile screens

%%%PAGETITLE%%%

Worked example

The Clari-Fi assessments are performed by examining an e-commerce image at an enlarged size, and using blurring to simulate the challenges of viewing that image at a small size on a mobile device. The following e-commerce image is now assessed for its visual clarity, focusing whether the critical details will remain visible when the image is presented at 16 x 16 mm, which is typical for a mobile search results page.

As defined in the GS1 MRHI guideline, there are 4 key messages that an e-commerce image should communicate (the 4Ws). These are ‘Who is the brand?’, ‘What is it?’, ‘Which variety is it?’ (e.g. flavour/fragrance), and ‘HoW much of it is there?’. Each of these messages will now be assessed against 3 different Check Levels of visual clarity, which are named Check Level AAA, Check Level AA and Check Level A.

Check Level AAA applies the most severe level of blurring, so details that remain visible at Check Level AAA are extremely easy to see. These details will be visible for most people, even when the image is displayed within a mobile search results page. All 4Ws passing Check Level AAA should be set as a stretch target for e-commerce images. This target can usually be achieved for products that have a reasonably square aspect ratio, but may not be achievable for products that are tall and thin or flat and wide.

The 4Ws are first assessed against Check Level AAA. Any of the 4Ws that fail Check Level AAA are then assessed at less stringent Check Levels.

Considering the above image, determining that it’s made by Dove (Who is the brand?) passes Check Level AAA, but everything else fails it. The remainder of the 4Ws are now assessed against Check Level AA.

Check Level AA applies a moderate level of blurring, so details that remain visible at Check Level AA are reasonably easy to see — at least 48% of people will probably be able to perceive these details quickly and with certainty, even when the image is displayed within a mobile search results page. See the understand page to find out more about this calibration to population data.

Check Level AA should be the minimally acceptable level of visual clarity for e-commerce images. This target should be achievable for all e-commerce images, and Unilever now requires that any new or updated e-commerce images must pass Check Level AA before they are sent to retailers.

Considering the above image, determining that it’s a box of soap bars (What is it?) passes Check Level AA, although this is a judgement call that may depend on the familiarity with the brand portfolio. The remainder of the 4Ws are now assessed against Check Level A.

Check Level A applies a small amount of blurring. When the image is displayed within a mobile search results page, details that pass Check Level A will be visible to some degree, but these do not reach the minimally acceptable level of visual clarity for an e-commerce image.

Considering the above image, determining that it’s the ‘beauty cream’ variant (Which variety is it?) passes Check Level A.

Details that fail Check Level A are impossible to see. When these details are displayed within a mobile search results page, they are so small that they are beyond the limit of human vision. Determining that the box contains 4x100g bars (HoW much of it is there?) fails Check Level A.

Many products still use pack shots for their e-commerce images, in which case it is likely that one or more of the 4Ws will fail Check Level A. Digitally enhancing these images so that they pass Check Level A would be an improvement, but Check Level AA should be the minimally acceptable level for e-commerce images. In order to pass Check level AA, it is likely that the image will need to be digitally manipulated to amplify the communication of the 4Ws, and omit unnecessary details. See the Manipulating the front of pack page within the Mobile Ready Hero Image Guidelines for further information.

 

Feedback

We would welcome your feedback on this page:

Your name:


Your email:


I would like to receive the Inclusive Design Toolkit news bulletin. This bulletin showcases people's achievements with inclusive design tools, and highlights new tools. It comes out once or twice a year.

I would be interested in contributing to the Inclusive Design Toolkit news bulletin.

I would like a FREE activation code for the Inclusive Design Toolkit's impairment simulator software.

Your comments:


Please leave this field blank (it's a spam trap):
Submit

Privacy policy. If your feedback comments warrant follow-up communication, we will send you an email using the details you have provided. Feedback comments are anonymized and then stored on our file server. If you select the option to receive or contribute to the news bulletin, we will store your name and email address on our file server for the purposes of managing your subscription. You can unsubscribe and have your details deleted at any time, by using our Unsubscribe form. If you select the option to receive an activation code, we will store your name and email address on our fileserver indefinitely. This information will only be used to contact you for the specific purpose that you have indicated; it will not be shared. We use this personal information with your consent, which you can withdraw at any time.

Read more about how we use your personal data. Any e-mails that are sent or received are stored on our mail server for up to 24 months.