# Ennen ja jälkeen -julkaisu: taitto, joka kertoo muutoksen

[Canonical HTML page](https://gradiently.design/fi/guide/before-and-after-post)

Harva formaatti vakuuttaa yhtä nopeasti kuin ennen ja jälkeen. Harva menee yhtä helposti pieleen erilaisilla kuvilla, ahtaalla taitolla tai parannelluilla tuloksilla.

## The short version

- Ennen ja jälkeen -julkaisu näyttää samasta kohteesta kaksi samalla tavalla otettua kuvaa, joiden ainoa ero on niiden välinen muutos.
- Kuvaa molemmat samasta kulmasta, etäisyydestä ja valossa. Muuten vertailu ei ole tasapuolinen.
- Rinnakkainen taitto sopii neliö- ja vaakajulkaisuihin, päällekkäinen tarinoihin ja kaksisivuinen karuselli antaa lopputuloksen paljastua vasta pyyhkäisemällä.
- Merkitse molemmat puoliskot selvästi ja pidä tekstit samoissa kohdissa.
- Julkaise vain aitoja tuloksia asiakkaan luvalla. Älä muokkaa kuvia valotuksen yhtenäistämistä enempää.

Hyvä **ennen ja jälkeen -julkaisu** näyttää saman kohteen kahdesti samalla tavoin kuvattuna, jolloin vain tekemäsi työ muuttuu. Taiton tehtävä on näyttää muutos heti: kaksi puoliskoa, selkeät merkinnät, ei kilpailevia asioita. Kampaamot, siivoojat, sisustajat, pihasuunnittelijat, autonhoitajat, fysioterapeutit ja suunnittelijat käyttävät formaattia, sillä tulos vakuuttaa paremmin kuin mikään kuvaus.

## Aloita toisiaan vastaavista kuvista

Useimmat heikot vertailujulkaisut epäonnistuvat jo ennen suunnittelutyökalun avaamista. Ennen-kuva on hämärässä iltavalossa laajakulmalla, jälkeen-kuva kirkkaassa päivänvalossa edullisesta kulmasta. Katsojat huomaavat sen, vaikkeivät osaisi selittää miksi, ja julkaisu tuntuu lavastetulta.

1. **Merkitse kuvauspaikka** Seiso samassa kohdassa molemmissa kuvissa. Teippipala lattiassa tai muistiinpano käytetystä oviaukosta riittää.
2. **Pidä korkeus ja objektiivi samoina** Pidä puhelin samalla korkeudella ja käytä samaa zoomausta. Yhden kuvan laajakulma muuttaa huoneen mittasuhteita.
3. **Yhtenäistä valo** Sama vuorokaudenaika ja samat lamput päällä tai pois. Jos se ei onnistu, kuvaa molemmat päävalot päällä ja kaihtimet samassa asennossa.
4. **Säilytä kuvan suunta** Molemmat pysty- tai vaakakuvina. Pystykuva ennen ja vaakakuva jälkeen eivät koskaan asetu kohdakkain.
5. **Ota useampi kuva kummastakin** Valitse parhaiten vastaava pari myöhemmin. Se on paljon helpompaa kuin ennen-tilanteen uudelleenrakentaminen työn valmistuttua.

## Toimivat ennen ja jälkeen -taitot

Kolme taittoa toimii luotettavasti. Valinta riippuu alustasta ja muutoksen näyttävyydestä.

| Taitto | Sopii parhaiten | Koko |
| --- | --- | --- |
| Rinnakkain | Syötejulkaisut, huoneet, autot ja puutarhat | Neliö 1080×1080 tai vaakakuva 1080×566 |
| Päällekkäin | Tarinat, Reels-kannet ja henkilökuvat | Tarina 1080×1920 tai julkaisu 1080×1350 |
| Kaksisivuinen karuselli | Suuret muutokset, joiden lopputulos saa yllättää | Julkaisu 1080×1350, kaksi sivua |

Kolme taittoa ja niiden koot. Päällekkäinen asettelu antaa molemmille kuville täyden leveyden, mikä auttaa puhelimessa.

- Rinnakkain 1080×1080: 1080 × 1080
- Päällekkäin 1080×1920: 1080 × 1920
- Karusellisivu 1080×1350: 1080 × 1350

Keskeltä pystysuunnassa jaettu neliö antaa kuville korkeat 540×1080-kaistaleet. Vaakasuuntaan jaettu tarina antaa lähes neliön muotoiset 1080×960-puoliskot.

Huomaa jaon vaikutus kuvaan. Neliön rinnakkaiset puoliskot ovat korkeita ja kapeita. Se sopii oviaukkoon tai seisovaan henkilöön, mutta rajaa leveää huonetta voimakkaasti. Tarinan päällekkäiset puoliskot ovat lähes neliöitä ja sopivat useimpiin kohteisiin. Vaakakuvista päällekkäinen taitto hukkaa yleensä vähemmän. Pidä tarinan merkinnät poissa ylä- ja alareunan 250 pikselistä, joissa sovelluksen käyttöliittymä on. [Sosiaalisen median turva-alueet](https://gradiently.design/fi/guide/social-media-safe-zones) selittää tarkemmin.

### Karusellin paljastus

Karuselli antaa ennen-kuvan olla ensin yksin. Ensimmäinen sivu näyttää ongelman lyhyellä rivillä (”Kuuden vuoden sammal.”), toinen tuloksen. Pyyhkäisystä tulee paljastus, joka pitää usein huomiota paremmin kuin molempien näyttäminen kerralla. Kehystä kuvat täsmälleen samoin, jotta pyyhkäisy tuntuu yhden kuvan muuttumiselta. [Instagram-karusellin koko](https://gradiently.design/fi/guide/instagram-carousel-size) antaa sivumitat.

Karusellin ensimmäinen sivu, merkintä Ennen ja teksti Kuuden vuoden sammal

Sivu yksi: merkitty ennen-tilanne ja ongelman esittelevä rivi.

Karusellin toinen sivu, merkintä Jälkeen ja teksti Sama ajotie, sunnuntai

Sivu kaksi: jälkeen-tilanne ja merkintä samassa paikassa suoraa vertailua varten.

## Merkinnät, viivat ja brändi

Merkitse puoliskot ”Ennen” ja ”Jälkeen” samalla sijainnilla, koolla ja värillä. Lukija vertaa siirtämällä katsetta vastaavien kohtien välillä. Yhden puolen vasen yläkulma ja toisen oikea alakulma rikkoo rytmin. Kapiteelit tai lyhyt tunniste toimii hyvin.

- Lisää puoliskojen väliin ohut jakoviiva tai brändivärinen rako, etteivät kuvat sulaudu yhteen.
- Lisää yksi rivi asiayhteyttä: työ, sen kesto tai käytetty tuote. Ei kappaletta.
- Pidä logo pienenä kulmassa. Tulos on mainos.
- Käytä samaa kehystä joka vertailussa, niin ne muodostavat tunnistettavan sarjan.

Kuvien päälle asetetut sanat vaativat huolellisuutta, sillä kirkas ikkuna tai valkoinen seinä nielee valkoisen merkinnän. [Luettava teksti valokuvissa](https://gradiently.design/fi/guide/readable-text-on-photos) käsittelee vaihtoehdot. Brändivärinen nauha kuvien ylä- tai alapuolella kiertää ongelman kokonaan.

## Eettisyys: näytä vain aitoja tuloksia

Formaatin voima on myös sen riski. Ennen ja jälkeen on väite: tähän me pystymme. Jos tulosta on retusoitu, lainattu tai se on poikkeuksellinen, väite on väärä. Joillakin aloilla, kuten kosmeettisissa hoidoissa, terveydessä ja painonpudotuksessa, näiden kuvien mainontasäännöt ovat tiukat. Tarkista toimialasi ja maasi säännöt ennen julkaisua.

### Vältä

- Jälkeen-kuvan retusointia tai ennen-kuvan tummentamista
- Tulosta kaunistavaa erilaista valaistusta
- Kuvapankin tai toisen yrityksen kuvia
- Parhaan yksittäisen tuloksen esittämistä tavallisena
- Asiakkaan kasvoja tai kotia ilman suostumusta

### Tee näin

- Yhtenäistä vain valotus ja valkotasapaino
- Sama kulma, etäisyys ja valo molemmissa
- Oma työsi itse kuvattuna
- Kerro työn kesto ja mitä siihen kuului
- Kirjallinen lupa ja mahdollisuus nimettömyyteen

Ihmisten kohdalla suostumus on vielä paikkoja tärkeämpi. Kysy ennen ennen-kuvan ottamista, kerro missä se julkaistaan ja tarjoa kasvojen tai tatuointien rajaamista pois. Moni jakaa tuloksensa mielellään tietäessään voivansa kieltäytyä.

## Tee kehyksestä omasi

Kun jokainen siivousyritys ja kampaamo käyttää samaa valkoista jaettua pohjaa, kehys on erottautumisen paikka. Yhtenäinen tausta kuvien ympärillä, samat merkinnät ja sama fontti muuttavat tulossarjan syötteessä omaksesi. [Pienyrityksen Instagram-ideat](https://gradiently.design/fi/guide/small-business-instagram) ja [kampaamon somejulkaisut](https://gradiently.design/fi/guide/salon-social-media-posts) näyttävät yhteyden laajempaan suunnitelmaan.

Gradientlyssä karuselli on yhden suunnitelman sivuja, joten ennen ja jälkeen jakavat kaikki asetukset. Koon muuttaminen tekee samasta suunnitelmasta tarinakoon, johon voit pinota kuvat. Taustana on Markisi, ilme, jota muu yritys ei voi käyttää sen ollessa sinun.

## FAQ

### Miten teen ennen ja jälkeen -julkaisun?

Kuvaa kohde samasta paikasta, korkeudelta ja valossa ennen työtä ja sen jälkeen. Aseta kuvat rinnakkain tai päällekkäin yhdenmukaisilla Ennen- ja Jälkeen-merkinnöillä.

### Minkä kokoinen ennen ja jälkeen -julkaisu on Instagramissa?

Käytä rinnakkaisiin kuviin kokoa 1080×1080, päällekkäiseen tarinaan 1080×1920 tai paljastuskaruselliin kahta 1080×1350-sivua.

### Saako ennen ja jälkeen -kuvia muokata?

Valotuksen ja valkotasapainon yhtenäistäminen sopii. Tuloksen retusointi tai ennen-tilanteen huonontaminen johtaa harhaan ja voi rikkoa mainontasääntöjä.

### Tarvitsenko luvan asiakkaan ennen ja jälkeen -kuviin?

Kyllä. Kysy ennen ennen-kuvan ottamista, kerro julkaisupaikka ja tarjoa kasvojen tai tunnistetietojen piilottamista.

### Kannattaako näyttää kuvat rinnakkain vai karusellina?

Rinnakkainen taitto näyttää muutoksen heti ja sopii yksittäiseen syötejulkaisuun. Kaksisivuinen karuselli säästää lopputuloksen pyyhkäisyyn, mikä toimii parhaiten näyttävässä muutoksessa.