The BAB formula (Before – After – Bridge) for a landing page that convinces

We've already covered AIDA and PAS: two structures that start from the problem. BAB starts somewhere else — from the image. Before, After, Bridge: the Before (the current situation, with its friction), the After (the desired situation, made concrete), the Bridge (your offer, as the only passage from one to the other). It's the natural structure for anything that sells a transformation rather than an object: coaching, fitness, courses, therapy, organisation, personal finance. Where PAS lingers on the pain, BAB moves quickly through the Before to give the After its real weight — that's the whole spirit of the method.

Why showing the After works: mental contrasting

BAB rests on a precise mechanism, studied for decades in motivation psychology: Gabriele Oettingen's fantasy realization theory. Her 2012 review published in European Review of Social Psychology, "Future thought and behaviour change", shows that mental contrasting — first imagining the desired future, then confronting it with the present reality that stands in its way — drives action more than daydreaming about the future alone or dwelling on the present alone. Fantasising about the After without ever colliding it with the Before produces the opposite of the intended effect: relaxation, not motivation. That's exactly the mechanics of a good BAB page: it doesn't show the After floating in a vacuum, it shows it in direct contrast with the visitor's Before, on the same screen, almost in the same sentence.

B — The Before: set the scene without lingering

The Before describes the visitor's current state — but in one or two sentences, not a full paragraph. Unlike the agitation step in the PAS formula, which digs into the pain, BAB's Before simply names it precisely enough for the visitor to recognise themselves: "You're still tracking your accounts on a spreadsheet every Sunday night", "You've tried three diets this year". The goal isn't to hurt, it's to set the scene as fast as possible so the rest of the page can take over — see our article on message match to calibrate this opening moment.

A — The After: make the desired state concrete and sensory

This is the heart of BAB, and the section most pages rush through. The After shouldn't be a vague adjective ("calmer", "more organised") but a scene: what the visitor sees, does, feels once the problem is solved. "You open the app on Sunday night, everything's already categorised, all that's left is a two-minute review" beats "simplified finance management" ten times over. The coach & consultant template shows the exercise well: the benefits section doesn't describe sessions, it describes a morning where the client knows exactly which decision to make. Visual proof backs up that scene better than any adjective — which is why BAB pages lean so heavily on before/after testimonials or verifiable numbers rather than abstract promises.

B — The Bridge: show the path, not just the destination

This is where most BAB pages lose their effect: they run Before straight into After, then drop a "Get started" button — skipping the explanation of how you get from one to the other. A study by Shelley Taylor, Lien Pham, Inna Rivkin and David Armor, published in 1998 in American Psychologist, "Harnessing the Imagination", compared two forms of visualisation: imagining the successful final outcome (outcome simulation) versus imagining the concrete steps to get there (process simulation). The result held across several studies: process simulation moves people toward the goal, while outcome simulation alone doesn't — and can even slow it down. Translated for a landing page: the Bridge shouldn't just re-describe the After as a promise, it should show the steps — "1. Answer 5 questions, 2. We build your plan, 3. First check-in on day 7" — so the visitor visualises the route, not just the arrival.

1. Name the bridge, literally — a method or programme name ("the Sprint method", "the 3-step plan") makes the passage tangible, not just a generic product.
2. List the path in 3 to 5 steps — each step is an action the visitor takes, not a product feature: see our anatomy of a landing page that converts for where to place this block.
3. Lower the perceived risk of the first step — a trial, a guarantee or a free call reassure the visitor that crossing the bridge doesn't cost full price right away.
4. Close with a CTA that names the first step, not the final destination: "Answer the 5 questions" converts better than an abstract "Transform my life" — see our CTA examples.

BAB, PAS or AIDA: how to choose

All three structures share one principle: speak to the visitor before speaking about the product. What sets BAB apart is that it makes this principle visual rather than argumentative — two images that answer each other, and a bridge between them. That's exactly the skeleton the LanderKit templates offer for transformation-driven offers, such as the coach & consultant template or ebook & digital product: a Before section, an After section backed by proof, and a step-by-step path that serves as the Bridge all the way to the buy button.