How to Make a Before and After Post That Sells

A detailer I know posts the same thing every week: two photos of a car interior, stacked in whatever app opens fastest, with "BEFORE ➡️ AFTER 🔥" mashed across the middle in a stroke font. The work is genuinely impressive. The post gets eleven likes.

The problem isn't the work and it isn't the photos. It's that the two images don't line up — different distance, different angle, different light — so your brain can't do the one job a before-and-after post exists to do: subtract one image from the other and see what changed. When the frames don't match, the viewer reads it as two unrelated pictures with a graphic on top. When they do match, the improvement hits before anyone reads a word.

This post is about that alignment problem, and how to build the graphic around it. If you want the "here's what a happy customer said" version of proof, that's a different tool — I covered it in how to make a testimonial graphic. This one is about proof you can see.

The rule that fixes most before and after post designs

Match the frame, not the photo.

You can't reshoot the before. It's already on your camera roll, taken in a hurry, probably at a bad angle. So you don't try to make the two photos identical — you make the two frames identical, and let the crop do the work:

• Same aspect ratio, both sides. Two 1:1 crops or two 4:5 crops. Never one square and one tall. A shape mismatch alone makes people distrust the comparison.
• Same subject size in frame. If the sofa fills 80% of the after shot, crop the before until the sofa fills roughly 80% too. This is the single highest-impact fix, and it's just dragging a crop box.
• Same horizon or eye-line. Line up one horizontal feature — the countertop edge, the shoulder line, the floor. Your eye uses it as an anchor and reads the rest as change.
• Same orientation. If the before is landscape and the after is portrait, crop both to portrait and lose the extra width. Losing pixels beats losing the comparison.

You'll throw away parts of both photos. That's the trade. A tight, matched pair beats two full-frame shots that don't agree with each other.

Where the labels go (and where they don't)

The instinct is to slap BEFORE and AFTER across the photos in big text. Don't. You're covering the exact pixels you're asking people to compare, and text over a busy photo is a legibility fight you don't need to pick — see how to put readable text over a photo if you do end up needing it.

Put the labels in their own strip: a small solid bar directly under each image, or a tiny pill in the corner outside the photo area. Small — 24 to 32px on a 1080px canvas is plenty. Nobody is confused about which one is the before. The photos already say it.

Then there's the divider. A 4–8px gap or a single thin neutral line between the two images does more than any arrow. It tells the eye "these are two panels of one thing." Skip the giant animated arrow, the lightning bolt, the fire emoji. The transformation is the drama; you don't need to add any.

The line that actually sells

Here's the part most people skip. A before-and-after shows what changed. It doesn't say what it cost the customer — in time, money, or hassle. That's the line that turns a satisfying picture into an inquiry.

Put one specific claim under the split:

• "Full interior detail — 3 hours, $180"
• "Same kitchen. New doors and handles only. Two days."
• "12 weeks. No cardio."
• "Storefront repaint, done overnight — zero closed days"

Numbers, duration, or scope. Specific beats superlative every single time. "AMAZING RESULTS 🤩" tells a stranger nothing; "3 hours, $180" tells them whether to message you. And put that line below the split, not on top of it — the images earn attention first, the claim collects it.

A worked example: the mobile detailer

Let's build the detailer's post properly. Canvas 1080×1350, because 4:5 takes the most vertical space in the Instagram feed.

The split. Two panels side by side, each 528px wide by roughly 760px tall, with a 24px gap down the middle. Vertical split, not horizontal — car interiors are wide, so two tall crops of the same seat read as a comparison. (For a room or a haircut, a horizontal stack often works better; the rule is that the split runs against the subject's long axis.)

The crops. Before shot was taken from the open door, further back. After was taken leaning in. So the before gets cropped in hard until the driver's seat occupies the same share of the frame, and both crops are aligned on the seam where the seat back meets the base. Now the eye can subtract.

The labels. A 56px bar under each panel: "BEFORE" on a dark grey #3a4a66, "AFTER" on the brand blue. 26px Inter, uppercase, letter-spaced. Small and calm.

The claim. Under the whole split, one line at 46px: "Full interior detail — 3 hours, $180." Bold, white, left-aligned to the left edge of the left panel so it sits on the same vertical line as everything else. That alignment discipline is the least glamorous and most reliable trick in design — more on it in design principles for non-designers.

The footer. Business name and city, 24px, muted grey. That's it. Six elements total. The restraint is the design.

Building one in Ridvay Studio

Open Studio and type this:

A before and after Instagram post for a mobile car detailing business, 1080x1350, dark navy background, two photo panels side by side with a 24px gap, small BEFORE and AFTER label bars under each panel, one bold headline underneath reading "Full interior detail — 3 hours, $180", business name and city in small grey text at the bottom

What comes back isn't a flat picture you'd have to regenerate to change. It's an editable design — the two panels, each label bar, the headline, and the footer are all separate layers you click and change. That matters here more than on most designs, because the whole job is fitting your two photos into a frame someone else built.

Four edits get you the rest of the way:

1. Drop your photos in. Click each panel, upload your before and after. Then drag inside the frame to reposition the crop until the subject fills the same share of both panels — that's the match-the-frame rule, and it's the only part you shouldn't rush.
2. Shrink the labels if the AI made them proud. Click "BEFORE", pull the size down to ~26px. Labels are signposts, not headlines.
3. Fix the claim line. Replace the placeholder with your real number. If it wraps to two lines, drop the font size rather than widening the text box — keep the left edge locked to the panel edge.
4. Apply your brand kit. One click swaps the fonts and the accent colour on the AFTER bar to yours, so this post matches everything else you publish. If you haven't set one up, how to build a brand kit walks through it.

Then use one-click resize to get a 1080×1920 version for Stories from the same design — the split re-lays-out vertically instead of you rebuilding it. And if you want the panels to wipe in one after the other for a Reel, Studio's animation tools will export it as video.

Make your before-and-after post in Studio →

Four ways these posts go wrong

The lighting cheat. Dim before, bright after. Everyone can tell, and it makes the real improvement look fake too. If your before was genuinely shot in bad light, say so in the caption rather than letting the graphic imply the light was the work.

Too many pairs in one image. Four before-and-afters crammed into a grid means eight photos at thumbnail size, which is zero readable comparisons. One pair per image. If you have four, that's a carousel.

The slider that isn't. A diagonal split with the two photos bleeding into each other looks slick and reads as one confusing image. Keep the panels separate and rectangular.

Burying the result. The post exists to make someone think "I want that." If your claim line is smaller than your logo, you've built an ad for your logo.

The honest test

Shrink the finished design to thumbnail size and look at it for one second — the same second it gets in a feed. Can you tell what changed? If yes, it works. If you have to squint and hunt, go back and re-crop; it's almost always the frames not matching, not the design.

The whole format works because it's evidence, not a claim. Every design decision above is in service of keeping the evidence legible. Get out of its way.

Ready to build one? Open Studio with this prompt → — swap in your own trade and your own numbers, then drop your two photos into the panels.