Interactive — this is the real build running inside the page.Full screen
What it does
A long-form, single-product sales page for a Lebanese weighted-blanket brand in oatmeal and clay. Drag a body-weight scale and the 10% rule picks one of five weights, the size and cover fabric follow from two more questions, and a to-scale quilt redraws on the bed with grams of beads per pocket. A five-layer exploded view lets you swap the cover, then a four-step checkout handles bundles, an order bump, cash on delivery and a thank-you page with a one-tap upsell.
Signature interaction
Drag the body-weight scale and the 10% rule lands on a HAVEN weight, then the quilt redraws to scale on your sofa or bed, with the number of pockets and grams of glass beads in each one.
What works in it
Body-weight scale you drag, step or arrow-key, in kg or lb
10% rule with gentle, classic and firm feel, maths shown
To-scale quilt on a sofa or bed with grams of beads per pocket
Size and cover fabric chosen from where and how you sleep
Five-layer exploded view with a cover fabric explorer
Bundle tiers with a weight per blanket and a spare-cover bump
Honest offer countdown and live stock that drops when you order
Delivery-date timeline by Lebanese region with a 4 pm cut-off
Reviews with star bars, topic filters, sorting, helpful votes and write a review
Comparison with budget weighted blankets and heavy duvets
Four-step checkout with cash on delivery, Whish, OMT and card, plus code SITESUP10
Thank-you page with order number, delivery steps and a one-tap eye-pillow upsell
Motion preview
Screen recording of the live build, running on sample data.
Features inside this build
E-commerce
Size Finder
A two-step fit quiz for a Beirut womenswear store: set height and weight with sliders (or drag the marker on the ruler) and a mannequin scales live, then pick bust, waist and hip shape. It returns a size with a confidence bar, honest between-sizes advice, a fit preview of a dress on the figure, and pre-selects the right size on every product, adjusting for styles that run small or large.
A phone product page where colour swatches swap the gallery with a circular colour-wipe, storage options show price differences and low or sold-out stock per colour, an availability matrix shows every colour × storage combination at a glance, and the SKU, price and URL update with each choice.
Two bundle mechanics in one feature: tier cards for a single product (Single, Duo −15%, Trio −25%) with per-bottle flavour picks, and a build-your-own box where every item moves a progress bar toward the next discount tier, with a live price breakdown and an animated savings counter.
Product reviews for an optical-frame store in Beirut: a star histogram that filters, customer photos in a swipeable lightbox, verified-buyer badges, helpful votes, sort and search, a Q&A tab, and a write-a-review form with star rating, fit, photo upload and inline validation. A “Customers say” summary is built locally from the reviews and rewrites itself when a new one is posted.