Како да направите анимиран GIF за вашата следна кампања за маркетинг преку е-пошта користејќи Photoshop

Фотошоп анимиран GIF за е-пошта маркетинг

Имаме неверојатно време работејќи со клучниот клиент Closet52, а онлајн продавница за фустани што го брендиравме и изградивме од темел за етаблирана и добро позната модна компанија во Њујорк. Нивното раководство секогаш работи со нас на заеднички идеи за следната кампања или стратегија што ја спроведуваме. Како дел од нивната имплементација, ние распоредивме Klaviyo за Shopify Плус. Klaviyo е добро позната платформа за автоматизација на маркетингот со многу тесна интеграција со Shopify, како и со многу Shopify апликации.

Омилена карактеристика моја е нивната А / Б тестирање во Клавијо. Може да развиете различни верзии на е-пошта, а Klaviyo ќе испрати примерок, ќе чека одговор и потоа ќе им ја испрати на преостанатите претплатници победничката верзија - сето тоа автоматски.

Нашиот клиент се претплати на модни е-пошта во индустријата и продолжи да забележува колку им се допаѓаат некои е-пошта со слајдшоу на фотографии од производите. Ме прашаа дали можеме да го направиме тоа и јас се согласив и направив кампања со A/B тест каде што испративме една верзија со анимација од 4 производи, а друга со единствена, убава, статична слика. Кампањата е за издувам продажба на нивните есенски фустани бидејќи тие носат нови линии на производи.

Верзија А: Анимиран GIF

анимација на фустан 3

Верзија Б: Статична слика

RB66117 1990 LS7

Заслугата за фотографијата оди кај талентираните луѓе во Зелум.

Мострирањето на кампањата сè уште работи во моментов, но прилично е јасно дека е-поштата со анимирана графика е далеку подобра од статичната слика… за околу отворена стапка од 7%.... но зачудувачки 3 пати поголема од стапката на кликање (CTR)! Мислам дека фактот што анимираниот GIF стави неколку различни стилови пред претплатникот доведе до многу повеќе посетители.

Како да направите анимиран GIF со помош на Photoshop

Јас не сум никаков професионалец со Photoshop. Всушност, единствените времиња што обично ги користам Photoshop на Adobe Creative Cloud се за отстранување на позадини и за слоеви слики, како што е поставување слика од екранот на врвот на лаптоп или мобилен уред. Сепак, направив малку копање на интернет и сфатив како да направам анимација. Корисничкиот интерфејс за ова не е најлесниот, но во рок од 20 минути и откако прочитав некои упатства, успеав да го нокаутирам.

Подготовка на нашите изворни слики:

  • димензии – Анимираните GIF може да бидат доста големи, па затоа се погрижив да ги поставам димензиите на мојата датотека на Photoshop точно да одговараат на ширината на шаблонот за е-пошта широк 600 пиксели.
  • компресија – Нашите оригинални слики беа со висока резолуција и многу голема големина на датотека, па ги променив големината и ги компресирав Kraken на JPG со многу помала големина на датотека.
  • Транзиции – Иако можеби ќе бидете во искушение да додадете анимација tweens (на пр. бледнее транзиција) помеѓу рамки, што додава голема големина на вашата датотека, па затоа би избегнал да го правам тоа.

За да ја изградите анимацијата во Photoshop:

  1. Креирај нова датотека со димензии што одговараат на точните димензии што ги ставате во шаблонот за е-пошта.
  2. изберете Прозорец > Времеплов за да се овозможи преглед на временската линија во основата на Photoshop.

Фотошоп > Прозорец > Времеплов

  1. Додадете го секој сликата како нов слој во рамките на Photoshop.

Photoshop > Додај слики како слоеви

  1. Кликнете Креирај Frame Animaција во регионот на временската линија.
  2. На десната страна од регионот на Timeline, изберете го менито за хамбургер и изберете Направете рамки од слоеви.

Photoshop > Timeline > Направете рамки од слоеви

  1. Во регионот на Timeline, можете повлечете ги рамките во редоследот во кои сакате да се појавуваат сликите.
  2. Кликнете на секоја рамка каде што пишува 0 сек и изберете го времето што сакате да се прикаже таа рамка. Јас избирам 2.0 секунди по кадар.
  3. Во паѓачкото мени под рамки, изберете Засекогаш за да се обезбеди континуирано вртење на анимацијата.
  4. Кликнете на Копче за играње за да ја прегледате вашата анимација.
  5. Кликнете Датотека > Извези > Зачувај за веб (наследен).

Photoshop > Датотека > Извези > Зачувај за веб (наследен)

  1. изберете GIF од опциите во горниот лев агол на екранот Извоз.
  2. Ако вашите слики не се проѕирни, отштиклирајте го Транспарентност опција.
  3. Кликнете Зачувај и извезете ја вашата датотека.

Photoshop извоз анимиран gif

Тоа е тоа! Сега имате анимиран GIF за да го поставите на вашата платформа за е-пошта.

Обелоденување: Плакар52 е клиент на мојата фирма, Highbridge. Јас користам придружни врски низ овој напис за Adobe, Klaviyo, Kraken, и Shopify.