Before and After Photos on Shopify: The Rules for Honest Results

The most persuasive picture on the page

For skincare, cleaning products, restoration kits, hair care and anything else that changes how something looks, a before and after pair shows the result more directly than any description. That power is why regulators look at these images closely, and why one obviously flattering pair can make a visitor doubt everything else on the page.

This guide covers taking fair photos and presenting them honestly. The before and after slider tool for Shopify checks your pair against these rules and previews it as a real store widget.

Compare like with like

The two photos should differ in one thing only: the result of using the product. Keep everything else the same:

• The same angle and distance. Mark where the camera and subject stand.
• The same light. Shoot at the same time of day, or with the same lamps in the same place.
• The same camera settings, with no beauty mode or filter on either shot.
• The same styling. Make-up, hair, clothing and background should match unless they are what the product changes.
• The same subject. Never pair photos of two different people or objects.

Write down how long passed between the photos and how the product was used. That line belongs next to the image.

Do not edit the after

Cropping and straightening both images the same way is fine. Retouching that changes the result is not. The UK Advertising Standards Authority has repeatedly ruled against cosmetics ads where production techniques exaggerated what the product does, and the same reasoning applies to a product page. If the after image has been touched up, the comparison no longer shows the product.

Typical results and evidence

The FTC's Endorsement Guides (16 CFR Part 255) say that when an advertiser shows a result it cannot show most people will get, it should clearly disclose what people can generally expect. A small "results not typical" note is not enough on its own. If your best example is unusual, either show a more representative one or say plainly what a typical result looks like.

For anything touching health, the bar is higher. The FTC's health products guidance expects claims about health benefits to be backed by competent and reliable scientific evidence, and weight loss imagery in particular draws scrutiny. In the UK and EU, cosmetic and health claims have their own rules. This is general information, not legal advice; check what applies to your category.

Customer photos need permission

A customer's own before and after is often the most believable kind, and it is also their personal data. Get clear, written permission for where you will use it, and remove it if they ask. Under the GDPR and UK GDPR, a recognisable face is personal data, and permission given for one use does not stretch to every other. If you gave the customer anything in return for the photos, disclose it, as the Endorsement Guides require for any material connection.

Make the slider usable for everyone

• Keyboard. The divider should move with arrow keys, not only by dragging, which WCAG success criterion 2.1.1 (Keyboard) asks for.
• No drag-only control. WCAG 2.2 success criterion 2.5.7 (Dragging Movements) asks for a way to operate dragging controls with a simple tap or click as well.
• Describe the difference. Alternative text for each image, under WCAG success criterion 1.1.1 (Non-text Content), should say what changed, so the comparison is not lost on someone who cannot see it.

Next step

Reshoot or re-check your best pair against the like-with-like list, and write the context line: what was used, how often, for how long. Then open the before and after slider tool, which flags anything that would weaken the comparison and previews the before and after widget from the Nudgesmart app with a sample photo. You add your own photos in the app and publish it from there. The other store widgets are in the store widget gallery.

For where a before and after belongs among the other blocks on a product page, see which product page widgets earn their place.