Marknaden
Priser
Logga inKom igång
FältguidenSociala medier
Sociala medier

Före och efter-inlägg: en layout som berättar historien

Få format övertygar lika snabbt som före och efter. Få är lika lätta att göra fel, med foton som inte matchar, trånga layouter eller resultat som fått hjälp på traven.

GradientlyVerifierat Gradiently-konto·1 oktober 2026·5 minuters läsning
Omslag: Burnt Shallows · GR·AEV5·WQ

Kortversionen

  • Ett före och efter-inlägg visar två matchande foton av samma motiv så att förändringen mellan dem är det enda som skiljer.
  • Ta båda fotona från samma vinkel, avstånd och ljus, annars slutar jämförelsen att vara rättvis.
  • Sida vid sida passar kvadratiska och liggande inlägg, staplat passar stories, och en karusell med två sidor låter efterbilden komma som ett avslöjande.
  • Märk varje halva tydligt och håll etiketterna på samma plats på båda sidor.
  • Lägg bara upp verkliga resultat, med kundens samtycke, och undvik att redigera något av fotona utöver att matcha exponeringen.
På den här sidan
Börja med foton som matcharFöre och efter-layouter som fungerarEtiketter, linjer och varumärkeEtik: visa bara verkliga resultatGör ramen till din

Ett bra före och efter-inlägg visar samma motiv två gånger, fotograferat på samma sätt, så att det enda som ändras är arbetet du gjorde. Layoutens uppgift är att göra den förändringen tydlig i en blick: två halvor, tydliga etiketter, inget som konkurrerar. Salonger, städfirmor, dekoratörer, trädgårdsfirmor, bilvårdare, sjukgymnaster och designers förlitar sig alla på formatet, eftersom ett resultat är mer övertygande än någon beskrivning av det.

Börja med foton som matchar

De flesta svaga före och efter-inlägg misslyckas innan någon öppnat ett designverktyg. Före-bilden togs i svagt kvällsljus med vidvinkel; efter-bilden togs i starkt dagsljus från en smickrande vinkel. Betraktare märker det, även om de inte kan säga varför, och hela inlägget känns arrangerat.

  1. 1

    Markera din plats

    Stå på samma ställe för båda fotona. En tejpbit på golvet, eller en anteckning om dörröppningen du fotograferade från, räcker.

  2. 2

    Matcha höjd och objektiv

    Håll mobilen på samma höjd och använd samma zoom. Att byta till vidvinkel för en bild ändrar rummets proportioner.

  3. 3

    Matcha ljuset

    Samma tid på dagen, samma lampor tända eller släckta. Om det inte går, ta båda med huvudbelysningen tänd och persiennerna i samma läge.

  4. 4

    Behåll bildens orientering

    Båda stående eller båda liggande. En stående före-bild bredvid en liggande efter-bild kan aldrig linjera.

  5. 5

    Ta några av varje

    Välj paret som matchar bäst senare. Det är mycket lättare än att återskapa en före-bild när arbetet är gjort.

Före och efter-layouter som fungerar

Det finns tre pålitliga layouter. Vilken du ska använda beror på plattformen och på hur dramatisk förändringen är.

Sida vid sida

Bäst för

Flödesinlägg, rum, bilar, trädgårdar

Storlek

Kvadrat 1080×1080 eller liggande 1080×566
StaplatStories, Reels-omslag, porträtt av människor

Storlek

Story 1080×1920 eller inlägg 1080×1350
Karusell med två sidor

Bäst för

Stora avslöjanden där efterbilden ska landa som en överraskning

Storlek

Inlägg 1080×1350, två sidor
LayoutBäst förStorlek
Sida vid sidaFlödesinlägg, rum, bilar, trädgårdarKvadrat 1080×1080 eller liggande 1080×566
StaplatStories, Reels-omslag, porträtt av människorStory 1080×1920 eller inlägg 1080×1350
Karusell med två sidorStora avslöjanden där efterbilden ska landa som en överraskningInlägg 1080×1350, två sidor
Tre layouter och storlekarna som passar dem. En staplad layout ger varje foto hela bredden, vilket hjälper på en mobil.

Sida vid sida 1080×1080

1080 × 1080

Staplat 1080×1920

1080 × 1920

Karusellsida 1080×1350

1080 × 1350

Dela en kvadrat på mitten så blir varje foto en hög remsa på 540×1080. Dela en story över mitten så blir varje halva en nästan kvadratisk 1080×960.

Lägg märke till vad delningen gör med varje foto. Sida vid sida på en kvadrat lämnar varje halva hög och smal, vilket passar en dörröppning eller en person som står, men beskär ett brett rum hårt. Staplat i en story lämnar varje halva nästan kvadratisk, vilket passar de flesta motiv. Om dina foton är liggande slösar en staplad layout oftast mindre av dem. I en story håller du etiketterna fria från de översta och understa 250 pixlarna, där appens eget gränssnitt sitter, som säkra zoner i sociala medier förklarar.

Karusellavslöjandet

En karusell låter före-bilden stå själv först. Första sidan visar problemet med en kort rad (”Sex år av mossa.”), andra sidan visar resultatet. Svepet blir avslöjandet, vilket tenderar att hålla uppmärksamheten bättre än att se båda på en gång. Håll fotona inramade identiskt så att svepet känns som en enda bild som ändras. Storlek på Instagram-karuseller har sidornas mått.

Före
Sex år av mossa.
Garageuppfart, lördag förmiddag
Gradiently · @gradiently

Sida ett: före-bilden, märkt, med en rad som sätter upp problemet.

Efter
Samma uppfart, söndag.
Högtryckstvättad och ommassad med sand
Gradiently · @gradiently

Sida två: efter-bilden, med etiketten på samma plats så att ögat jämför direkt.

Etiketter, linjer och varumärke

Märk varje halva ”Före” och ”Efter” på samma plats, i samma storlek och samma färg. Läsare jämför genom att flytta blicken mellan matchande punkter, och en etikett uppe till vänster på ena sidan och nere till höger på den andra bryter den rytmen. Små versaler eller en kort flik fungerar bra.

  • Lägg en tunn avdelare mellan halvorna, eller ett mellanrum i din varumärkesfärg, så att fotona inte flyter ihop.
  • Lägg till en rad sammanhang: jobbet, tiden det tog eller produkten som användes. Inte ett stycke.
  • Håll logotypen liten och i ett hörn. Resultatet är annonsen.
  • Använd samma ram för varje före och efter du lägger upp, så att de blir en igenkännbar serie.

Ord ovanpå foton kräver omsorg, eftersom ett ljust fönster eller en vit vägg kan svälja en vit etikett. Gör text läsbar på foton går igenom alternativen. Att lägga etiketterna på ett varumärkt band ovanför eller under fotona, i stället för på dem, kringgår problemet helt.

Etik: visa bara verkliga resultat

Formatets kraft är också dess risk. Ett före och efter är ett påstående: det här kan vi göra. Om resultatet retuscherades, lånades eller var exceptionellt är påståendet falskt, och inom vissa områden, som kosmetiska behandlingar, hälsa och viktminskning, är reklamreglerna för sådana bilder stränga. Kontrollera reglerna för din bransch och ditt land innan du lägger upp.

Undvik

  • Att retuschera efter-bilden eller mörka före-bilden
  • Olika belysning som smickrar resultatet
  • Stockbilder eller ett annat företags foton
  • Ditt enda bästa resultat presenterat som typiskt
  • En kunds ansikte eller hem utan samtycke

Gör så här

  • Matcha bara exponering och vitbalans
  • Samma vinkel, avstånd och ljus för båda
  • Ditt eget arbete, fotograferat av dig
  • Säg hur lång tid det tog och vad som ingick
  • Skriftligt tillstånd, och möjlighet att vara anonym

För människor snarare än platser betyder samtycke ännu mer. Fråga innan före-fotot tas, förklara var det kommer att visas och erbjud dig att beskära bort ansikten eller tatueringar. Många kunder delar gärna sitt resultat när de vet att de kan säga nej.

Gör ramen till din

När varje städfirma och varje salong lägger upp samma vita delade mall är ramen där du kan skilja dig från mängden. En konsekvent bakgrund runt fotona, samma etikettstil och samma typsnitt gör en rad resultat till något folk känner igen som ditt i flödet. Instagram-idéer för småföretag och inlägg för salonger visar hur detta passar in i en bredare plan.

I Gradiently är en karusell helt enkelt sidor i en och samma design, så före och efter delar varje inställning, och storleksändring gör storyformatet av samma design, redo för dig att stapla fotona. Bakgrunden är din Mark, en look som inget annat företag kan använda när den är din.

Designa med en levande gradient

Inlägg, stories, presentationer och banners i alla storlekar, med text som alltid går att läsa.

Börja designa, gratis

Vanliga frågor

Hur gör man ett före och efter-inlägg?

Fotografera motivet från samma plats, höjd och ljus före och efter arbetet, och placera sedan fotona sida vid sida eller staplade med matchande etiketter för Före och Efter.

Vilken storlek har ett före och efter-inlägg på Instagram?

Använd 1080×1080 för sida vid sida, 1080×1920 för en staplad story eller två karusellsidor i 1080×1350 för ett svepavslöjande.

Är det okej att redigera före och efter-foton?

Att matcha exponering och vitbalans är bra. Att retuschera resultatet eller få före-bilden att se sämre ut vilseleder folk och kan bryta mot reklamregler.

Behöver jag tillstånd för kunders före och efter-foton?

Ja. Fråga innan före-fotot tas, förklara var det kommer att visas och erbjud dig att dölja ansikten eller identifierande detaljer.

Ska ett före och efter vara sida vid sida eller en karusell?

Sida vid sida visar förändringen direkt och passar ett enskilt flödesinlägg. En karusell med två sidor håller tillbaka efterbilden till ett svep, vilket fungerar bäst när förändringen är dramatisk.

Dela den här guiden

Skriven av GradientlyVerifierat Gradiently-konto

Teamet bakom Gradiently, ett designverktyg byggt kring Marks: levande gradienter som får allt du gör att kännas som ditt.

Se vår profil

På den här sidan

Börja med foton som matcharFöre och efter-layouter som fungerarEtiketter, linjer och varumärkeEtik: visa bara verkliga resultatGör ramen till din

Dela den här guiden

Nästa i Sociala medier

Giveaway-inlägg: design, regler, priser och tydlig uppmaning

Läs vidare

Alla guider om Sociala medier
Sociala medier

Instagram karusell: design för slides som folk sveper igenom

5 minuters läsning

En karusell är en liten bok som folk bläddrar i med tummen. Så skriver du första sidan så att de vänder blad, och designar resten så att de fortsätter.

Användning

Instagram-idéer för småföretag: 40 inlägg när du kört fast

5 minuters läsning

Varje småföretag kör fast på samma sätt: du vet att du borde publicera men har ingen aning om vad. Här är fyrtio idéer som fungerar för butiker, studior, kaféer och tjänsteföretag, och ett sätt att få dem att se ut som du.

Typografi och text

Så gör du text läsbar på foton utan ruta bakom

5 minuters läsning

En enfärgad ruta bakom rubriken fungerar, men den får varje inlägg att se ut som en meme. De här teknikerna håller fotot helt och orden tydliga, med kod för webben och inställningar för inlägg i sociala medier.

Hitta looken som bara är din.

Varje Mark är en levande bakgrund med en enda ägare. Prova en ledig Mark och säkra din när det känns rätt.

Börja designa

Kontrollera ett certifikat

Skriv ett certifikatnummer eller en Marks kod för att se vem som äger den.

Fungerar med ChatGPT och Claude

Be din AI om en design. Den skapar den i din Mark, redo att redigera.

ChatGPTClaude
Så ansluter du

Produkt

  • Marknaden
  • Utforska
  • Priser
  • Certifikat

Lär dig

  • Fältguiden
  • Hjälpcenter
  • Nyheter

Utvecklare

  • Översikt
  • ChatGPT och Claude
  • API-referens
  • API-nycklar

Företaget

  • Om oss
  • Kontakta oss
  • Logga in

Juridik

  • Villkor
  • Integritet
  • Återbetalningar
  • Mark-skydd
  • Cookies
  • Alla policyer
Rör dig över bokstäverna. Var och en bär en riktig Mark.Tryck på en bokstav för att se dess Mark.Ett namn. Tio Marks inuti.
© 2026 Gradiently