Kuinka tehdä animoitu GIF seuraavaa sähköpostimarkkinointikampanjaasi varten Photoshopin avulla

Photoshop-animoitu GIF sähköpostimarkkinointiin

Meillä on uskomatonta aikaa työskennellä avainasiakkaan Closet52, an verkkopukukauppa jonka brändäsimme ja rakensimme alusta alkaen vakiintuneelle ja tunnetulle muotiyritykselle New Yorkissa. Heidän johtonsa työskentelee aina kanssamme yhteisten ideoiden parissa seuraavaa toteuttamamme kampanjaa tai strategiaa varten. Osana niiden toteuttamista otimme käyttöön Klaviyo varten ShopifyPlus. Klaviyo on tunnettu markkinoinnin automaatioalusta, jossa on erittäin tiukka integraatio Shopifyyn sekä moniin Shopify-sovelluksiin.

Lempiominaisuusni on heidän / B-testaus Klaviyossa. Voit kehittää sähköpostista erilaisia ​​versioita, ja Klaviyo lähettää näytteen, odottaa vastausta ja lähettää lopuille tilaajille voittajan version – kaikki automaattisesti.

Asiakkaamme tilaa alan muotisähköposteja ja jatkoi tuotekuvien diaesityksen avulla, kuinka paljon he pitivät joistakin sähköposteista. He kysyivät, voisimmeko tehdä sen, ja suostuin ja rakensin kampanjan A/B-testillä, jossa lähetimme yhden version, jossa oli 4 tuotteen animaatio, ja toisen, jossa oli yksi kaunis, staattinen kuva. Kampanja on räjähdys syksyn mekkonsa myyntiin kun he tuovat markkinoille uusia tuotelinjoja.

Versio A: Animoitu GIF

mekkoanimaatio 3

Versio B: Staattinen kuva

RB66117 1990 LS7

Kuvan kunnia kuuluu lahjakkaille henkilöille osoitteessa Zeelum.

Kampanjan otanta on edelleen käynnissä, mutta on melko selvää, että animoitua kuvaa sisältävä sähköposti on huomattavasti parempi kuin staattinen kuva… noin 7 % avoin korko… mutta hämmästyttävää 3 kertaa napsautussuhde (CTR)! Uskon, että se, että animoitu GIF asetti tilaajalle useita eri tyylejä, johti paljon enemmän vierailijoita.

Kuinka tehdä animoitu GIF Photoshopilla

En ole mikään Photoshopin ammattilainen. Itse asiassa ainoat ajat, joita yleensä käytän Adobe Creative Cloudin Photoshop poistavat taustat ja kerrostelevat kuvia, kuten kuvakaappauksen asettaminen kannettavan tietokoneen tai mobiililaitteen päälle. Kaivelin kuitenkin nettiä ja keksin kuinka tehdä animaatio. Tämän käyttöliittymä ei ole helpoin, mutta 20 minuutissa ja muutaman opetusohjelman luettuani pystyin tyrmäämään sen.

Lähdekuvien valmistelu:

  • Mitat – Animoidut GIF-kuvat voivat olla melko suuria, joten varmistan, että asetan Photoshop-tiedostoni mitat täsmälleen 600 pikseliä leveän sähköpostimallimme leveyteen.
  • Puristus – Alkuperäiset kuvamme olivat korkearesoluutioisia ja erittäin suuria tiedostokokoja, joten muutin niiden kokoa ja pakasin ne Kraken JPG-tiedostoihin, joiden tiedostokoko on paljon pienempi.
  • siirtymät – Vaikka saatat tuntea houkutusta lisätä animaatioita tweens (esim. häipyvä siirtymä) kehysten välillä, mikä lisää tiedostoosi paljon kokoa, joten välttelisin sitä.

Animaation rakentaminen Photoshopissa:

  1. Luo uusi tiedosto mitoilla, jotka vastaavat tarkasti sähköpostimalliisi lisäämiäsi mittoja.
  2. valita Ikkuna > Aikajana ottaaksesi aikajananäkymän käyttöön Photoshopin pohjassa.

Photoshop > Ikkuna > Aikajana

  1. Lisää kukin kuva uutena tasona Photoshopissa.

Photoshop > Lisää kuvia tasoina

  1. Napauta Luo Frame Animaaikajana-alueella.
  2. Valitse aikajana-alueen oikealla puolella hampurilaisvalikko ja valitse Tee kehyksiä kerroksista.

Photoshop > Aikajana > Tee kehyksiä tasoista

  1. Aikajana-alueella voit vedä kehykset järjestykseen jossa haluat kuvien näkyvän.
  2. Napsauta jokaista kehystä, jossa lukee 0 sekuntia, ja valitse aika, jonka haluat kehyksen näkyvän. minä valitsin 2.0 sekuntia per kuva.
  3. Valitse kehysten alla olevasta pudotusvalikosta Ikuisesti varmistaaksesi animaation jatkuvan.
  4. Valitse Toista-painike esikatsellaksesi animaatiota.
  5. Napauta Tiedosto > Vie > Tallenna verkkoon (vanha).

Photoshop > Tiedosto > Vie > Tallenna verkkoon (vanha)

  1. valita GIF Vie-näytön vasemmassa yläkulmassa olevista vaihtoehdoista.
  2. Jos kuvat eivät ole läpinäkyviä, poista valinta Läpinäkyvyys vaihtoehto.
  3. Napauta Säästä ja vie tiedostosi.

photoshop vienti animoitu gif

Se siitä! Sinulla on nyt animoitu GIF ladattavaksi sähköpostialustallesi.

Disclosure: Kaappi 52 on yritykseni asiakas, Highbridge. Käytän affiliate-linkkejä koko tämän artikkelin ajan Adobe, Klaviyo, Krakenja Shopify.