A full storefront redesign, tested in the US market first and now being adapted for the Euro market. Dated template out, modern conversion-focused build in. One technical owner, end to end.
drag the handle, scroll inside for the full page. anonymized recreation of the redesign.
The old storefront was a stock template patched for years. It was not broken, exactly. It loaded, it sold, it had every section an eCommerce site is supposed to have. But everything lived one layer too deep: categories behind a menu, offers inside a rotating banner, products under a wall of SEO text. In a world where attention spans and retention are not so great, you have to lay everything out. The site asked visitors to work, and visitors do not work.
Before touching a pixel I went through months of heatmaps and scroll maps. The pattern was blunt: clicks piled onto the first product row and the search bar, and almost nothing else. Scroll depth died before the mid-page. The offers we cared about most were the least seen things on the site. The conclusion wrote itself: our visitors depend on things being accessible and just there. If it is not on the screen, it does not exist.
Designed from the ground up in Figma, then shipped section by section on Magento 2 with Tailwind, US storefront first so every change could be measured against the old baseline. No big-bang relaunch, no six-month rewrite. Each section went live as soon as it beat the one it replaced.
Each one traceable to something in the data.
Categories became a bento on the first screen. Offers got their own section instead of a carousel slide nobody waits for. If the scroll maps said people never reached it, it moved up or it went.
The old site had five shades of blue and no order among them. The redesign runs on a navy hero, a single CTA blue, and a type scale that makes the next step obvious on every screen.
Shipping terms went into a ticker above the header instead of a footer paragraph. Guarantees, reviews and FAQ moved up where hesitation actually happens, not after the decision is already lost.
Product cards carry everything a decision needs: photo, price, stock, one tap to cart. No detour to a product page just to find out if it is available.
The rebuild cut page load from 0.79s to 0.44s. Lighter markup, fewer scripts, images sized for what they actually render at. Faster pages convert better; that is the whole argument.
The guides, reviews and FAQ earned their keep in search, so nothing was deleted. In an age where content is king, we leaned into the trend of pushing educational guides around the products, which is also a big help for AI visibility and AI search results. The guides just stopped living between the customer and the products: they now sit after the shopping flow, where they answer questions instead of blocking the path.
Customers stopped digging. The new page is noticeably longer with more scroll area, which sounds like the wrong move for short attention spans, but it worked out: when every scroll lands on something worth stopping for, people keep going. Run as an A/B test against the old storefront on the same US traffic, conversion rose 13.8% and pages load in roughly half the time. Next up: adapting the same playbook for the Euro storefronts.