A teardown you run on any store, and the order you build your own page in.
Fourteen people put your blue-light glasses in the cart yesterday and one paid. Nothing is missing from the page. The returns policy exists, the delivery window exists, the size chart exists — in the footer, at the bottom, inside a tab. The other thirteen met the delivery window at checkout.
THE ORDER IS THE WORK. THE PAINT IS NOT.
fix the sequence before anything visual
01 THE FIRST SCREEN Effectively all paid traffic arrives on a phone, mid-scroll, from something that interrupted it.
The above-the-fold stack of a product page on a phone: product name a stranger can parse, one image that reads at thumb size, the price plus whether tax and shipping sit on top, one line saying what it does or who it is for, and an add-to-cart reached without stretching that does not move. Below the fold, the remaining questions in the order they arrive: is it for me, what does it look like in real life, what exactly do I get, who else bought it, what if it is wrong, when does it arrive, and how do I pay. No load time, price or rate is shown. IT ARRIVES ON A PHONE, MID-SCROLL. PRODUCT NAME 01 A STRANGER CAN PARSE IT IMAGE 02 IT READS AT THUMB SIZE PRICE 03 AND WHETHER TAX AND SHIPPING SIT ON TOP ONE LINE 04 WHAT IT DOES, OR WHO IT IS FOR. NOT A SLOGAN. ADD TO CART 05 REACHED WITHOUT STRETCHING, AND IT DOES NOT MOVE THE FOLD EVERYTHING BELOW IS SCROLLED TO 01 WHAT IS IT — ANSWERED ABOVE, OR NOT AT ALL. THE ORDER THE REST ARRIVE IN 02 IS IT FOR ME 03 WHAT DOES IT LOOK LIKE IN REAL LIFE 04 WHAT EXACTLY DO I GET 05 WHO ELSE BOUGHT IT 06 WHAT IF IT IS WRONG 07 WHEN DOES IT ARRIVE ON THE PAGE, NOT FIRST AT CHECKOUT. 08 HOW DO I PAY ORDER ONLY. NO LOAD TIME OR PRICE SHOWN. BEING PRESENT IS NOT ARRIVING IN TIME.
Four jobs. Anything else there competes with them. A name a stranger can parse, and an image that reads at thumb size. The price, and whether tax and shipping sit on top. Discovering either later is where trust leaks. An add-to-cart a thumb reaches, that does not move as the page settles. One line saying what it does, or who for. Not a slogan. A price on a line, with the alternatives a buyer already has sitting on both sides of it. To the cheaper side: doing nothing, the option they already have at no cost, which asks them for nothing at all, and the cheapest lookalike, the same shape from a name they do not know, which asks them to gamble and to wait. To the dearer side: the name they already trust, bought before or seen everywhere else, which asks them for nothing new, and the proper fix, a service or a professional or a dearer category, which asks for more money and more time. Your price is the only position on the line you choose, and it is never read alone. No currency figure appears; the positions are relative only. WHERE YOUR PRICE SITS, AND AGAINST WHAT YOUR PRICE THE ONLY POSITION YOU CHOOSE 01 02 03 04 CHEAPER DEARER 01 DOING NOTHING THE OPTION THEY ALREADY HAVE, AT NO COST ASKS THEM FOR NOTHING AT ALL 02 THE CHEAPEST LOOKALIKE THE SAME SHAPE, FROM A NAME THEY DO NOT KNOW ASKS THEM TO GAMBLE, AND TO WAIT 03 THE NAME THEY TRUST BOUGHT BEFORE, OR SEEN EVERYWHERE ELSE ASKS THEM FOR NOTHING NEW 04 THE PROPER FIX A SERVICE, A PROFESSIONAL, A DEARER CATEGORY ASKS FOR MORE MONEY AND MORE TIME YOUR PRICE IS NEVER READ ALONE. NO CURRENCY FIGURE APPEARS HERE. MOVING IT CHANGES WHO YOU SIT BESIDE.
The price is read against what the buyer would do instead. YOUR CALL
You have torn down three competitor pages and your own. Yours loads faster and the photography is better. Theirs put the rating beside the price and the delivery window under it; yours keeps delivery in the shipping policy and reviews at the bottom. Yours has the lowest add-to-cart rate of the four.
YOU HAVE ONE HOUR. WHICH CHANGE DO YOU MAKE?
A Move a review block above the product name, so proof is the first thing anyone sees B Move the delivery window and the returns line directly under the price C Reshoot the hero so it reads at thumb size D Cut the description to three lines so the page feels lighter 02 THE ORDER QUESTIONS ARRIVE IN What is it. Answered on the first screen or not at all. Is it for me. The use case, the person, the problem. What does it look like in real life, at real size. What exactly do I get. Contents, dimensions, materials. Who else bought this, and what happened. What if it is wrong. Returns and sizing. When does it arrive. Here, not at checkout. Is this a checkout I recognise. PRESENCE IS NOT THE SAME AS ARRIVING ON TIME.
delivery below the reviews is delivery nobody read
03 IMAGES: FIVE JOBS What a stranger checks before entering a card, the signal that answers each doubt, and where on the page that signal lives. Is this a real shop: a contact route with a real address, in the footer of every page. Will it actually arrive: a delivery window in one sentence, on the page above the reviews. Will it look like the photo: customer photographs, with the reviews. Is it worth this: a rating summary with the moderate ones left in, beside the price. What if it is wrong: the return window and who pays postage, on the page rather than only the footer. Am I safe typing a card: the same name and branding as the page before, in the checkout header and on the card statement. Below, four fabrications that reverse all of it, struck out. WHAT A STRANGER CHECKS, AND WHERE IT LIVES IS THIS A REAL SHOP A CONTACT ROUTE WITH A REAL ADDRESS LIVES: FOOTER, ON EVERY PAGE WILL IT ACTUALLY ARRIVE A DELIVERY WINDOW IN ONE SENTENCE LIVES: ON THE PAGE, ABOVE THE REVIEWS WILL IT LOOK LIKE THE PHOTO CUSTOMER PHOTOGRAPHS, NOT ONLY STUDIO ONES LIVES: WITH THE REVIEWS IS IT WORTH THIS A RATING SUMMARY, MODERATE ONES LEFT IN LIVES: BESIDE THE PRICE WHAT IF IT IS WRONG THE RETURN WINDOW, AND WHO PAYS POSTAGE LIVES: ON THE PAGE, NOT ONLY THE FOOTER AM I SAFE TYPING A CARD THE SAME NAME AND BRANDING AS THE PAGE BEFORE LIVES: CHECKOUT HEADER, AND THE CARD STATEMENT AND WHAT REVERSES ALL OF IT A TIMER THAT RESETS ON RELOAD A STOCK COUNTER THAT NEVER MOVES ONLY PERFECT REVIEWS, ALL ONE WEEK A CROSSED-OUT PRICE NEVER CHARGED PLACEMENT ONLY. NO RATE OR LIFT IS SHOWN. PROOF PLACED BEFORE THE DOUBT IS BRAGGING.
One of these is only ever answered by a photograph. Scale. Something recognisable in frame, or the product held. Detail. Close enough to show material and construction. In use. A real environment, worn or held. What is in the box, laid out. Nobody asks, everybody minds. Variants photographed as themselves, not one shot and a swatch. YOUR CALL
A quarter of your posture-corrector orders are coming back, and the reason field says "too small" or "did not sit right" almost every time. The page has a size chart inside a tab, five images on a white background, and a rating a shade under five stars.
WHAT IS THE FIRST FIX?
A Photograph it worn, on a person, and put the sizing on the page rather than in a tab B Add a line explaining that return postage is at the buyer's cost C Surface the reviews that mention fit, so buyers can self-select D Cut the range down to the one size that comes back least An offer taken apart into the four things it is made of, drawn as four equal quarters of one bar. Promise answers what am I actually getting, and is about what changes for the buyer rather than what the thing is. Proof answers why would I believe you, and has to be something the buyer can check without trusting you. Price answers is this worth it to me, and is the only quarter most people ever touch. Risk answers what if it is wrong, and covers returns, warranty and who pays the postage. A reader who changes only the price has changed one quarter of the offer and left the other three exactly as they were. The quarters are drawn equal and no weighting is claimed. ONE OFFER, CUT INTO FOUR PROMISE PROOF PRICE RISK FOUR EQUAL QUARTERS. NO WEIGHTING IS CLAIMED. PROMISE ANSWERS WHAT AM I ACTUALLY GETTING? NOT WHAT IT IS. WHAT IT DOES TO THEIR DAY. PROOF ANSWERS WHY WOULD I BELIEVE YOU? SOMETHING THEY CAN CHECK WITHOUT TRUSTING YOU. PRICE ANSWERS IS THIS WORTH IT TO ME? THE ONLY QUARTER MOST PEOPLE EVER TOUCH. RISK ANSWERS WHAT IF IT IS WRONG? RETURNS, WARRANTY, AND WHO PAYS THE POSTAGE. CHANGE THE PRICE AND YOU HAVE CHANGED ONE QUARTER. PRICE IS THE EASIEST QUARTER TO CHANGE. IT IS NOT THE ONLY ONE THAT MOVES.
What the copy has to cover. COPY AND PROOF Write the objection list before a word of copy. Is this a real shop, will it arrive, will it be the thing in the photograph, how do I get my money back. Leave the moderate reviews visible. Perfect scores alone read as filtered. How a stranger's trust responds to reviews, drawn as two shapes rather than as numbers. The first is a curve of trust against how many reviews there are: it climbs steeply out of nothing, because the first few are the difference between nobody having said anything and somebody having, and then it flattens, because each one after that adds less. The second compares the shape of the ratings themselves. A wall of perfect ones reads as chosen rather than collected, and leaves nothing to weigh it against. A few with a spread across them reads as collected rather than chosen, and the unflattering one is what makes the rest readable. No counts, ratings or star figures are shown, and both the curve and the two spread shapes are illustrative. TRUST DOES NOT RISE IN A STRAIGHT LINE THE FIRST FEW MOVE IT MOST EACH ONE AFTER ADDS LESS NONE MANY MORE REVIEWS → MORE TRUST → AND THE SHAPE OF THEM CHANGES THE READING A WALL OF PERFECT ONES READS AS CHOSEN, NOT COLLECTED THERE IS NOTHING TO WEIGH IT AGAINST WORST → BEST A FEW, WITH A SPREAD READS AS COLLECTED, NOT CHOSEN THE UNFLATTERING ONE MAKES THE REST OF THEM READABLE WORST → BEST NO COUNTS, NO RATINGS, NO STAR FIGURES. THE CURVE AND BOTH SHAPES ARE ILLUSTRATIVE. WHAT IS DRAWN IS THE SHAPE OF THE RESPONSE. Volume without spread is the shape buyers distrust. 05 WHERE PEOPLE LEAVE The path from add-to-cart to paid, with the specific reason a stranger leaves at each step. Add to cart: the button has scrolled out of reach. The cart: a total that does not include shipping yet. Checkout opens: it looks like a different company. Details: forced account creation and too many fields. Shipping: the cost and the delivery date both seen for the first time here. Payment: no method they recognise, or a currency to convert. Every exit is a reason, not a rate. ADD TO CART IS NOT THE SALE 01 ADD TO CART THE BUTTON HAS SCROLLED OUT OF REACH LEAVES 02 THE CART A TOTAL THAT DOES NOT INCLUDE SHIPPING YET 03 CHECKOUT OPENS IT LOOKS LIKE A DIFFERENT COMPANY 04 DETAILS FORCED ACCOUNT CREATION, AND TOO MANY FIELDS 05 SHIPPING THE COST AND THE DATE, BOTH SEEN FIRST HERE 06 PAYMENT NO METHOD THEY KNOW, OR A CURRENCY TO CONVERT PAID THE ONLY STEP THAT COUNTS EVERY EXIT ABOVE IS A REASON, NOT A RATE. NOTHING SHOULD APPEAR HERE FOR THE FIRST TIME. The add-to-cart scrolled out of reach, with no persistent buy button. Shipping, tax or delivery appearing first at the payment step. Forced account creation, or a currency the buyer converts in their head. A checkout that looks like a different company from the page before. What makes a store page slow, drawn as five weights stacked on the page beneath them. Images and video are the heaviest, and the heaviest thing loads before anything can be read. Apps and their scripts come next, because every page pays for a feature that one page uses. Then tracking and pixels, because measurement is not free and loads too. Then chat, popups and widgets, which arrive before they are wanted. Then fonts and theme extras, because a second typeface is a second download. Underneath all of it is the page itself: a photo, a price and a button, carrying the lot. The thickness of each weight is a rank, not a measurement, and no timing figure appears. WHAT THE PAGE IS CARRYING IMAGES AND VIDEO THE HEAVIEST THING LOADS BEFORE ANYTHING IS READ APPS AND THEIR SCRIPTS EVERY PAGE PAYS FOR A FEATURE ONE PAGE USES TRACKING AND PIXELS MEASUREMENT IS NOT FREE. IT LOADS TOO. CHAT, POPUPS, WIDGETS THEY ARRIVE BEFORE THEY ARE WANTED FONTS AND THEME EXTRAS A SECOND TYPEFACE IS A SECOND DOWNLOAD THE PAGE UNDERNEATH A PHOTO, A PRICE, A BUTTON. CARRYING ALL OF IT. THICKNESS IS A RANK, NOT A MEASUREMENT. NOBODY REPORTS THE PAGE THEY DID NOT WAIT FOR.
On mobile data, speed is the first thing a page says. on record
06 PROCEDURE ONE: THE TEARDOWN One competitor advertisement broken into its five parts, with what each part tells the reader about the advertiser. The hook, the first two seconds before any argument, tells you what they think stops this audience. Who it talks to, read from the casting, setting and pronouns, tells you who they have decided the buyer is. The promise, the change it says it will make, tells you which problem they sell against. The proof, meaning what is shown rather than what is said, tells you which objection they expect to meet. The ask, what it wants done next, tells you how warm they think the viewer already is. This is a reading key: you are reading their assumptions, not their results, because no result is visible from outside an ad. A READING KEY, NOT A TEMPLATE 01 THE HOOK THE FIRST TWO SECONDS, BEFORE ANY ARGUMENT TELLS YOU WHAT THEY THINK STOPS THIS AUDIENCE 02 WHO IT TALKS TO THE CASTING, THE SETTING, THE PRONOUNS TELLS YOU WHO THEY HAVE DECIDED THE BUYER IS 03 THE PROMISE THE CHANGE IT SAYS IT WILL MAKE TELLS YOU WHICH PROBLEM THEY SELL AGAINST 04 THE PROOF WHAT IS SHOWN, NOT WHAT IS SAID TELLS YOU WHICH OBJECTION THEY EXPECT 05 THE ASK WHAT IT WANTS DONE NEXT TELLS YOU HOW WARM THEY THINK THE VIEWER IS YOU ARE READING THEIR ASSUMPTIONS, NOT THEIR RESULTS. COPY THE QUESTIONS, NEVER THE AD.
You arrive through their ad, so read that too. 01 Open the store through one of their ads, not by typing the domain. 02 Screenshot the first screen. Note which of the four jobs it misses. 03 Scroll to the bottom and list the sections in order. Order only, no judgement. 04 Against each, write the objection it answers. Sections answering nothing are decoration. 05 Reach the payment step without paying. Note everything appearing for the first time. 06 Repeat on two more stores, then your own. 07 Put the section lists side by side. The differences are your work list. A branded product page for an invented posture-corrector store, drawn phone-shaped with seven numbered pins down the left margin. Pin one, the first screen: a name a stranger can parse, one image that reads at thumb size, the price with tax and shipping said there rather than at checkout, and a single add-to-cart. Pin two, the problem named before the product, in the buyer's words, including what they already tried and why it did not hold. Pin three, proof placed at the doubt: the rating beside the price, reviews after the description, and the moderate ones left in. Pin four, the offer: what you get, what it costs, what happens next, and one call to action rather than three. Pin five, the guarantee, a money-back window stated plainly in a sentence you would be held to. Pin six, the delivery promise, above the reviews and never first at checkout, with the slowest realistic figure first. Pin seven, the objections — returns, sizing, whether this is a real shop — answered where the doubt occurs rather than in the footer. The store is invented and no real company is depicted. THE ANATOMY OF A BRANDED PRODUCT PAGE SEVEN PARTS, PINNED IN THE ORDER THEY ARE READ POSTURE CORRECTOR — AN INVENTED STORE 1 THE FIRST SCREEN NAME A STRANGER CAN PARSE. ONE IMAGE THAT READS AT THUMB SIZE. PRICE, WITH TAX AND SHIPPING SAID HERE, NOT AT CHECKOUT. ADD TO CART 2 THE PROBLEM, BEFORE THE PRODUCT THE MOMENT, IN THEIR WORDS. WHAT THEY HAVE ALREADY TRIED, AND WHY IT DID NOT HOLD. 3 PROOF, PLACED AT THE DOUBT RATING BESIDE THE PRICE. REVIEWS AFTER THE DESCRIPTION. THE MODERATE ONES LEFT IN. 4 THE OFFER WHAT YOU GET, WHAT IT COSTS, WHAT HAPPENS NEXT. ONE CALL TO ACTION, NOT THREE. 5 THE GUARANTEE A MONEY-BACK WINDOW STATED PLAINLY, IN A SENTENCE YOU WOULD BE HELD TO. 6 THE DELIVERY PROMISE ABOVE THE REVIEWS, NEVER FIRST AT THE CHECKOUT. SLOWEST REALISTIC FIGURE FIRST. EXAMPLE SHAPE: DISPATCH IN 2 DAYS, THEN 5 TO 9 DAYS TO YOUR DOOR. 7 THE OBJECTIONS, ANSWERED IN PLACE RETURNS, SIZING, IS THIS EVEN A REAL SHOP — ANSWERED WHERE THE DOUBT OCCURS, NOT DOWN IN THE FOOTER WHERE NOBODY GOES. AN INVENTED STORE, DRAWN AS A TEACHING EXAMPLE. NO REAL STORE, BRAND OR RETAILER IS DEPICTED, AND NO PRICE OR RESULT IS CLAIMED. THE ORDER IS THE WORK. THE PAINT IS NOT.
One branded page pinned part by part. 07 PROCEDURE TWO: THE BUILD ORDER The operator's daily loop drawn as a closed circuit. Check: one look at what actually happened. Decide: kill it, change one thing, or leave it. Change one thing: so the next reading means something. Wait: the answer arrives on its own clock. Then the return leg carries you back to the top and it is the same four again tomorrow. Drawn outside the circuit and struck through, because they feel like work and move no decision forward: watching the numbers refresh all day, changing two things at once, starting a second product mid-test, and deciding without writing the reason down. No hours, frequency or schedule is asserted here. FOUR STEPS. THEN THE SAME FOUR AGAIN. CHECK ONE LOOK AT WHAT ACTUALLY HAPPENED. DECIDE KILL IT, CHANGE ONE THING, OR LEAVE IT. CHANGE ONE THING SO THE NEXT READING MEANS SOMETHING. WAIT THE ANSWER ARRIVES ON ITS OWN CLOCK. TOMORROW, THE SAME FOUR WHAT FALLS OUT OF THE LOOP WATCHING THE NUMBERS REFRESH ALL DAY CHANGING TWO THINGS AT ONCE STARTING A SECOND PRODUCT MID-TEST DECIDING WITHOUT WRITING THE REASON THE LOOP IS FOUR STEPS, AND IT CLOSES. EVERYTHING STRUCK OUT ABOVE FEELS LIKE WORK AND MOVES NO DECISION FORWARD. Change one thing, then look again. 01 Write the objection list first. Nothing starts until it exists. 02 Build the first screen to do its four jobs. The rest goes below. 03 Place the sections in the order the questions arrive. 04 Shoot images against the five jobs, then delete any not doing one. 05 Write copy section by section, each answering one objection. 06 Place proof at the doubts: rating near the price, reviews after the description. 07 Put delivery above the reviews, never first at checkout. 08 Walk it on a phone and fix whatever appears first after the page. FROM TEARDOWN TO YOUR PAGE
A PAGE CANNOT OPEN YOUR PRODUCT PAGE
The teardown and the build order are the method, whole. Applying them means somebody reading the order your sections are in.
Your own page torn down section by section · The objection each one fails to answer
SEE THE ROOM WHAT I WOULD ACTUALLY TELL YOU
Run the teardown on three stores in one sitting, your own page last. They mostly do the same things in the same order, and the differences you were about to copy transfer worst. One thing from this module: move delivery above the reviews.