Redesigning a PDP that only half the users finished scrolling.
End-to-end redesign of the Bed Threads product page using research, testing, methodologies and best practices. HotJar, two personas, a card sort, hand sketches, and 12 bespoke components — shipped to engineering with a hand-off doc the squad still references.
Brief
Work end-to-end to redesign the Bed Threads product page using research, testing, methodologies and best practices.
Problem
The original PDP buried the moments shoppers actually used. HotJar showed only half of users scrolled past the size selector, swatches absorbed roughly 60% of all on-page taps, and reviews picked up under 1% — even though 90% of 18-34 shoppers say they trust online reviews as much as a personal recommendation. Hierarchy, not content, was the bottleneck.
My role
I led the PDP arc end-to-end alongside the broader Bed Threads platform work:
- Competitor audit across linen, bedding, and adjacent e-commerce
- HotJar heatmap and session-recording review on the live page
- Two personas, a card-sort workshop, and stakeholder sessions
- Hand sketches of overall structure, then 12 bespoke components individually
- Mid/high-fidelity components in Figma against the brand system
- Mobile size-selector pattern (bottom-of-viewport popup)
- Dev hand-off doc and QA
A PDP rebuilt around what shoppers actually do.
Competitor analysis
I audited PDPs across linen, bedding, and adjacent e-commerce. The patterns worth carrying: square hero images that pull more content above the fold, small breadcrumbs for context, minimal product copy, on-page bundling instead of cross-sells, "Order Swatch" CTAs, and an image-with-dimensions slot inside the gallery. Patterns to leave behind: BNPL messaging subdued to the point of invisibility, "Buy it now" buttons that skipped the cart, and review pages hidden behind a click.
- Square PDP image brings more content above the fold; landscape variants tested too
- Sophisticated image gallery with 360° and VR feature
- "On-page" bundling — duvet insert and pillow options surfaced inline
- Order Swatch CTA, "NEW" callouts on colour swatches, USP callout
- Stylists framing for CS agents; commonly-asked questions on the PDP itself
- Mobile sticky add-to-cart positioned at the top of page to stay out of viewport focus
HotJar insights
The heatmaps gave a falsifiable read on the original page: 97% scrolled below the fold, 75% made it to swatches, 50% past the size selector. Colour swatches absorbed roughly 60% of all on-page taps; lifestyle imagery 14%; "Read More" 5%; reviews under 1%. Session recordings showed the same friction in motion — shoppers oscillating between BYOB and Bedding Sets, hovering between Bedding Sets and Sheet Sets without knowing which to click, and tapping the checkout thumbnail expecting it to be a link.
Synthesised research
Product images
60% of US digital shoppers needed an average of 3-4 images when shopping online; 13% needed five or more (Salsify, Feb 2018). Merchandise shown in context is more memorable — "don't sell your product, sell the experience your product offers" (ecommerceuxdesign.com).
Reviews
90% of 18-34 consumers trust online reviews as much as personal recommendations (Bright Local 2015). 68% of consumers are inclined to trust more when there are both bad and good reviews; 30% suspect inauthenticity when they don't see anything negative.
User behaviour
79% of test users always scanned new pages; only 16% read word-by-word (NN/g). The PDP had to reward scanning before it rewarded reading.
Personas
Two personas, named and grounded in household and lifestyle context. They became the tie-breaker every time hierarchy decisions got noisy — which trust signal goes above the fold, what reads first on mobile, when a swatch needs a "NEW" badge.
Card sort & sketches
A card-sort workshop with stakeholders set the order of operations on the PDP. From there, hand sketches: first the overall structure, then each of the 12 bespoke components on its own page so the system could be reasoned about one piece at a time.
Mid-fi components
Mid- and high-fidelity in Figma to understand the experience and reflect the brand. Each component carried its own props, states, and content rules — colour swatches, size selector, reviews module, dimensions strip, on-page bundle, USP callout, FAQ, sticky add-to-cart.
Sticky add-to-cart
A sticky add-to-cart sits within reach but stays out of viewport focus, modelled on the competitor pattern that shoppers already understood. Mid- and high-fidelity ideation tested placement, density, and the moment it should become visible relative to the size selector.
Mobile size-selector pattern
Half of mobile shoppers never made it past the size selector on the original page. The fix treats size as a deliberate moment, not a row in a list: a bottom-of-viewport popup brings the selector to the thumb, keeps the product image visible behind it, and confirms the choice in place. The pattern became a small piece of methodology the team reused.
Dev hand-off
Annotated specs covering each component's states, content rules, breakpoint behaviour, and the conditional logic between catalogue data and the PDP UI. The hand-off doc became the squad's source of truth for engineering and the merchandising team writing the back-end copy.
Final design
The redesigned PDP lifts the information hierarchy around what shoppers actually do — swatches, size, reviews, dimensions, on-page bundling — and trims everything that competed for tap-share without earning it.
Live result: View the product page on bedthreads.com.au.