I redesigned this mobile offer section of product page on @Figma to create a clearer, more persuasive buying experience.

The original page presented the essential information, but the benefits, product options and purchase controls were difficult to scan.

For the redesign, I improved:

• Product and offer hierarchy • Benefit-focused messaging • Product gallery and visual presentation • Flavour and bundle selection • Pricing and savings visibility • Trust signals near the CTA • Mobile usability and buying flow

The goal was to help shoppers understand the product, compare their options and move toward purchase with less friction.

This is a concept redesign created to demonstrate my approach to conversion-focused Shopify product page design.

Good hierarchy fix, the before version buries the flavor picker and quantity discount below a wall of bullet points. On the bundle tiers, are the 10/20/30% discounts pulled from a real margin model for a shake product, or placeholder numbers for the concept? That third tier...

What do you think?

Should work on animation, the blur - visible during transition to another element doesn't feels good as an user