Как мы создали GIF-пак, который за 20 дней собрал 1,5 млн просмотров
КейсыИ зачем нужны GIF вашему бизнесу
Люди не любят рекламу. Этот факт заставляет креативную индустрию изобретать интересные и ненавязчивые способы продвижения. GIF-стикеры – один из них. Этот инструмент в своих коммуникациях использовали Lexus, Puma, Vivienne Sabo и другие мировые бренды. Мы в Unisender решили не отставать и создали свой брендированный GIF-пак.
Создание гифок мы начали с анализа платформ, самые популярные из них – Giphy, Imgur, Gfycat, Tenor. Остановились на Giphy, потому что этот сервис самый крупный: ежедневно им пользуется 500 миллионов человек. Еще Giphy легко интегрируется по API почти со всеми мессенджерами и соцсетями: Facebook*, Instagram*, Telegram, Snapchat, Messenger, WhatsApp, TikTok. Гифки из Giphy можно добавлять в email-рассылки или на сайт.
Как гифки продвигают продуктПрелесть в том, что гифки находятся в публичном доступе и не требуют платного продвижения. При правильном оформлении, их увидят миллионы пользователей, а потратитесь вы только на отрисовку анимации.
В стикеры можно нативно встроить свой бренд: использовать маскота, лого, фирменные цвета. При этом пользователь не обязательно будет искать вас по названию бренда. Чаще всего это происходит по ключевым словам или тегам. Такой подход расширяет аудиторию. А когда вашу гифку добавят в stories, вы автоматически получите брендированный контент.
Давайте посмотрим, что делают глобальные бренды с помощью гифок.
Lexus воюет с конкурентами. Lexus создал серию из 19 GIF-стикеров и пометил их своим логотипом. Хитрость была в том, что в описании гифок ребята использовали теги конкурентов. Когда пользователи искали гифки по запросу Audi, BMW или Mercedes, то видели стикеры Lexus. За первые сутки стикер-пак набрал 1 млн, за месяц – 38,6 млн просмотров. И никакого платного продвижения!
General Electric объясняет научные факты. Корпорация популяризирует науку через диджитальные инструменты. General Electric сделали образовательный гиф-пак, который объясняет сложные технологические вещи через анимации.
Adidas продвигает новые кроссовки. Бренд использует гифки для промоакций новых моделей обуви, создает гиф-паки, посвященные паре кроссовок или лимитированным коллекциям. Также на канале можно найти гифки на беговую тематику и разные мотивационные надписи.
Как мы создавали GIF-пакШаг 1. Выбрали идею. Прежде чем рисовать стикеры, подумайте, что вы хотите через них донести. Например, Starbucks регулярно выпускает гифки к разным инфоповодам: выход нового напитка, месяц Прайда, осознанное потребление. Так, стикеры существуют не только ради фана, но и создают позитивный образ бренда.
Мы в Unisender хотели сделать классные стикеры для email-маркетологов в Instagram*. Нишевые гифки мы замиксовали с типичными инстаграмными, которые часто добавляют в stories. Например, надпись New Post, анимированная стрелка. В дизайне использовали фирменные цвета, лого, а сюжеты всех гифок объединили общей концепцией стритстайла.
Если вы хотите повысить ваши гифки в выдаче, посмотрите, что сейчас в тренде на Giphy. Так вы сможете сделать правильное описание и на будущее узнать, какие гифки больше всего вирусятся.
Шаг 2. Зарегистрировались на giphy.com. Для начала мы создали канал бренда на Giphy.
Потом заполняем страницу для верификации профиля.
Указываем контактную информацию и ссылки на страницы соцсетей и сайт бренда.
Контактный email должен совпадать с доменом вашего бренда или официального дистрибьютора. Если вы будете регистрировать аккаунт компании в Giphy на личную почту или почту подрядчика, то верификацию он не пройдет.
Шаг 3. Нарисовали стикеры. Рассмотрение заявки занимает около 2 недель. Мы изначально сделали все по правилам и через день у нас уже был подтвержденный аккаунт.
Гифки тоже проходят модерацию. Поэтому важно соблюдать технические и этические требования Giphy:
- Размер гифки – 512 на 512 пикселей.
- Ограничений по размеру файла нет, сервис автоматически сжимает картинку, если она больше нужного значения.
- Гифки обязательно рисуем в режиме цвета RGB.
- Анимацию нужно зациклить.
- Фон и не менее 20% точек должны быть прозрачными.
- Можно использовать статичные картинки, но только с анимированным элементом: сияние, снег, дымок, блестки.
- Стикеры загружаются в формате Gif.
- На гифках запрещено изображать сцены насилия, жестокое обращение с животными, травлю и все, что запрещают правила сообщества и здравый рассудок.
- Один аккаунт — один бренд. Нельзя загружать изображения под чужим логотипом.
Шаг 4. Загрузили гифки. Итак, гифки готовы и можно их загружать. На этом этапе нужно прописать теги, чтобы пользователи могли нас искать.
Есть несколько правил:
- Максимальное количество тегов — 20 штук.
- Используйте английский язык. Платформа автоматически переводит запросы на другие языки и ваши стикеры подтягиваются как для русскоязычной, так и англоязычной аудитории.
- Не нужно придумывать какие-то уникальные теги. Пользователь ищет по названию бренда, отрасли, эмоции или ему нужна просто стрелочка для stories.
- Теги в описании гифок должны соответствовать их содержанию, иначе стикеры не пройдут модерацию.
- Не забудьте добавить название своего бренда и слоган. Это нужно для вашей целевой аудитории, которая будет искать контент по названию компании.
Шаг 5. Прошли модерацию. После модерации гифки появляются в публичном доступе. Введите ключевые теги, чтобы проверить видны ли они вашим пользователям. Если вы делали гифки под Instagram*, то чекните их в редакторе stories.
Какие результаты получилиУвидеть аналитику можно в разделе Dashboard в личном кабинете.
Там можно посмотреть:
- общее количество просмотров за день, неделю, все время. Платформа сводит показы по всем соцсетям и мессенджерам;
- количество просмотров по каждой гифке и их ранжирование по популярности;
- динамику показов.
В Unisender за 20 дней мы получили 1,5 млн просмотров. Количество просмотров продолжает расти каждый день.
У этой гифки спустя 20 дней было 606 тыс. просмотров
У этой — 234 тыс. просмотров
Вместо выводовГифка — это:
- нативный контент, который работает на повышение узнаваемости бренда;
- органический канал продвижения, который дает большие охваты без платной рекламы;
- ненавязчивый способ попасть в stories к любому пользователю.
Поделиться
СВЕЖИЕ СТАТЬИ
Другие материалы из этой рубрики
Не пропускайте новые статьи
Подписывайтесь на соцсети
Делимся новостями и свежими статьями, рассказываем о новинках сервиса
«Честно» — авторская рассылка от редакции Unisender
Искренние письма о работе и жизни. Свежие статьи из блога. Эксклюзивные кейсы и интервью с экспертами диджитала. Оставляя свой email, я принимаю Политику конфиденциальностиНаш юрист будет ругаться, если вы не примете 🙁
Как запустить email-маркетинг с нуля?
В бесплатном курсе «Rock-email» мы за 15 писем расскажем, как настроить email-маркетинг в компании. В конце каждого письма даем отбитые татуировки об email ⚡️
*Вместе с курсом вы будете получать рассылку блога Unisender
Оставляя свой email, я принимаю Политику конфиденциальностиЧем редактировать GIF-анимацию | Топ-6 программ для обрезки GIF
Когда на форуме или в соцсети встречаешь симпатичную анимацию, то хочется сохранить ее себе – на память или чтобы использовать в собственных проектах. Однако чаще всего приходится сначала редактировать GIF-изображение, так как оно слишком длинное или неряшливо склеено. Либо же хочется добавить или, наоборот, удалить кадры, надпись, какой-то визуальный эффект.
Давайте разберем, как правильно и аккуратно обрезать GIF, отредактировать их, добавить или удалить элементы. В этом нам помогут как онлайн-сервисы, так и стационарные программы – выбирайте, что больше нравится.
Команда Movavi стремится предоставлять только актуальную и проверенную информацию. Вот что мы делаем для этого:
Все продукты в этой статье протестированы командой Movavi.
При тестировании мы сравниваем ключевые параметры, включая обрезку видео и аудио, визуальные эффекты, стабилизацию, настройку качества видео, сохранение видео и другие важные характеристики.
Редактирование GIF: топ-6 программ
Какая программа лучше всего подходит для обработки гифок? Все зависит от задачи. Для конвертации или изменения соотношения сторон подойдут одни программы, для добавления элементов или фильтров – другие. Например, для изменения размера картинки достаточно даже самого простого инструмента. Мы постарались составить обзор из разных сервисов, чтобы каждый пользователь нашел подходящий инструмент под свои потребности. Обратите внимание, что очередность программ в обзоре произвольна.
Movavi Video Editor – это стационарная программа, которую можно скачать на свой компьютер. Она предназначена для обработки медиа, включая возможности обрезать ГИФ по времени, создавать анимированные файлы и их редактировать: менять цвета, добавлять и удалять текст, фильтры и многое другое. Богатый инструментарий приложения позволяет добавлять к исходному изображению другие медиафайлы, получая уже, по сути, новые гифки.
Если нужно сделать просто обрезку GIF-картинки, перетащите ее в рабочую область, отрегулируйте рамки и нажмите Применить. При необходимости настройте другие визуальные параметры (обрезка по длине, поворот, изменение скорости и др.). Этот редактор работает не только с форматом GIF, но и любыми другими популярными видеоформатами.
Анимайзер
Онлайн-редактор Анимайзер предлагает обширный инструментарий для работы с изображениями. Сервис обрабатывает анимацию в форматах GIF и APNG, умеет редактировать картинки, перекрашивать их, менять фоны и скорость смены кадров, инвертировать оттенки, а также – переворачивать изображения и многое другое. Получившуюся в результате обработки картинку можно скачать на свой компьютер.
Англоязычный онлайн-сервис Ezgif не имеет русской версии, но в нем легко разобраться. Тут можно выполнить редактирование GIF, загруженной с ПК, или же добавить картинку по ссылке с другого сайта. Размер изображения можно настроить вручную при помощи сетки, или же ввести нужные значения в соответствующие поля. Также можно выбрать другое соотношение сторон файла при обрезке.
Дополнительный функционал весьма широк. Сервис позволяет сделать разворот изображения, изменить скорость анимации, добавить надписи: на выбор несколько десятков шрифтов, богатая палитра цветов, центровка текста и возможность задать диапазон фреймов, где надпись будет появляться и пропадать.
Сервис предлагает большой перечень эффектов: фильтры, изменение цветовой палитры, трансформация по любой оси и т. д. Здесь также анимацию легко обрезать по длительности, предварительно разбив на фреймы, и оптимизировать исходную картинку с помощью различных опций. Полученное изображение можно сохранить на свой компьютер.
Онлайн-площадка Gifs способна работать с файлами, загруженными с ПК или по ссылке. Чтобы обрезать анимированное изображение, просто выберите область, которую желаете сохранить, и нажмите кнопку Создать. Доступны такие опции редактирования, как размытие изображения, поворот, некоторые другие эффекты. Как они будут смотреться в результате, вы можете узнать благодаря опции предпросмотра. Итоговую картинку можно сохранять на компьютер или делиться ею в соцсетях. Для экспорта изображения понадобится регистрация. Кстати, на этом сайте можно посмотреть гифки, созданные другими пользователями.
iLoveIMG
iLoveIMG – это многофункциональный онлайн-сервис, где есть инструментарий не только для обработки анимированных картинок. Чтобы сделать обрезку GIF, загрузите файл на вкладку Обрезать изображение. Вы сможете изменить размер картинки, выставив необходимые параметры вручную, или же перетащив рабочую область при помощи мыши. Полученное после обрезки изображение можно скачать на диск компьютера. Весь функционал предоставляется бесплатно, регистрация не нужна.
Inettools
Еще одна онлайн-платформа, где можно обрезать ГИФ по размеру, – Inettools. Нужный файл можно загрузить с ПК или перетащить в поле сервиса. Задавайте финальный размер, прописав цифры в каждом из соответствующих полей, или указывайте нужные области, перетащив на них сетку при помощи мыши. Тут можно сделать обрезку без потери качества по краям, задать сохранение пропорций одним кликом и сразу скачать на компьютер обработанный файл.
В нашей статье мы познакомили вас с самыми известными и популярными инструментами для редактирования GIF. Некоторые из них позволяют выполнять только базовые операции – это очень удобно, когда большего и не требуется. Другие, как например Movavi Video Editor, дают возможность собрать из исходных картинок баннеры, анимационные изображения для презентаций и даже целые видеоролики. Попробуйте на практике эти сервисы и программы, чтобы понять, что вам подойдет лучше всего.
Создавайте видео. Творите. Вдохновляйте.
* Бесплатная версия Movavi Video Editor имеет следующие ограничения: 7-дневный пробный период, водяной знак на сохраненных видео и, если вы сохраняете проект как аудиофайл, возможность сохранить только ½ длины аудио.
Остались вопросы?
Если вы не можете найти ответ на свой вопрос, обратитесь в нашу службу поддержки.
Подпишитесь на рассылку о скидках и акциях
Подписываясь на рассылку, вы соглашаетесь на получение от нас рекламной информации по электронной почте и обработку персональных данных в соответствии с Политикой конфиденциальности Movavi. Вы также подтверждаете, что не имеете препятствий к выражению такого согласия. Читать Политику конфиденциальности.
Что такое GIF? — The Media Plant
Формат GIF или Graphics Interchange Format — это тип файла, обычно используемый для изображений в Интернете. Он поддерживает как статические, так и анимированные изображения и может быть сжат для уменьшения размера файла без потери качества изображения. Одним из преимуществ использования GIF является его способность показывать быстрое движение, не занимая слишком много места или времени загрузки. Это делает его популярным выбором для коротких клипов или анимации. Однако цветовой диапазон GIF ограничен по сравнению с другими форматами изображений, поэтому они могут быть не лучшим выбором для высококачественных фотографий или сложной графики. В целом, GIF-файлы — это универсальный и простой способ добавить визуального интереса к вашему онлайн-контенту.
История файла GIF
Формат файла GIF был разработан CompuServe в 1987 году. Он был разработан, чтобы обеспечить способ сжатия изображений для легкой передачи через ранний коммутируемый Интернет. Формат поддерживает до 256 цветов и использует сжатие без потерь, что означает, что никакая информация не теряется при сохранении изображения в формате GIF. Сегодня GIF в основном используются для передачи эмоций и добавления юмора в онлайн-разговоры. Они стали популярным способом создания коротких последовательных анимаций. Независимо от того, используются ли они для серьезных или беззаботных целей, GIF-файлы стали одним из основных элементов интернет-культуры.
Когда использовать GIF
В общем, GIF — отличный вариант для обмена изображениями и анимацией в Интернете. GIF-файлы можно использовать для самых разных целей: от создания простых анимаций до добавления визуального интереса к веб-сайту или презентации. Их можно использовать, чтобы просто показать действие, например, человек хлопает в ладоши или аплодирует. GIF также можно использовать для создания коротких видеоклипов или рекламных роликов. Они могут быть особенно эффективными для привлечения внимания и быстрой и лаконичной передачи сообщения. Таким образом, они часто используются рекламными агентствами и предприятиями как способ привлечь потенциальных клиентов.
Когда следует избегать GIF
В некоторых ситуациях GIF не лучший выбор. Например, если вам нужно напечатать изображение, GIF — не лучший формат для использования, поскольку он, скорее всего, приведет к получению изображения более низкого качества. Использование GIF для высококачественной фотографии или графики также не рекомендуется, поскольку файл изображения ограничен только 256 цветами.
Преимущества GIF
GIF-анимация может быть не самым сложным вариантом, но она быстрая и эффектная. Они просты в изготовлении, не требуют большого количества технических навыков и могут быстро стать вирусными в социальных сетях в виде мемов.
GIF-файлы имеют ограничение на размер файла, что, в свою очередь, ускоряет их загрузку на веб-страницах.
GIF-файлы используют сжатие без потерь, что означает, что их изображение не ухудшается при сжатии данных.
GIF-файлы часто короче и меньше по размеру, чем традиционные видеофайлы, что упрощает и ускоряет их загрузку и просмотр.
Недостатки GIF
GIF имеют несколько недостатков по сравнению с другими форматами файлов изображений.
Одним из самых больших недостатков является то, что GIF-файлы поддерживают только 256 цветов, что может привести к полосам и размытым изображениям.
GIF-файлы не поддерживают альфа-прозрачность, поэтому их нельзя использовать для всего.
Как открыть GIF
Просмотр на компьютере Mac или Windows:
Первый шаг — найти файл изображения, который вы хотите просмотреть. GIF-файлы можно найти на многих веб-сайтах и в социальных сетях. Найдя изображение, щелкните его правой кнопкой мыши и выберите «Открыть с помощью». Появится выпадающее меню со списком различных программ, которые могут открыть файл. Выберите предпочитаемую программу из списка, и начнется воспроизведение GIF. Вот и все!
Браузер:
Вы можете открывать GIF-файлы в любом веб-браузере, включая Chrome, Firefox и Internet Explorer.
Как создать GIF
Существует несколько различных способов создания GIF, в зависимости от используемого программного обеспечения и желаемого результата. Многие мобильные и настольные приложения конвертируют видео в анимированные GIF-файлы. Другой вариант — создать анимированный GIF с использованием фотографических изображений. Это можно сделать, начав с серии неподвижных изображений, а затем добавив анимацию движения между кадрами. Наконец, вы также можете создавать GIF-файлы с нуля, используя программное обеспечение для векторного рисования.
Как редактировать GIF
Редактировать GIF легко с помощью правильных инструментов. Несколько онлайн-редакторов позволяют загружать гифки и вносить изменения в изображение. Вы можете обрезать GIF, изменить его размер, добавить текст и даже изменить скорость воспроизведения. Когда вы будете довольны своими правками, вы можете экспортировать gif. Если вам нужны более продвинутые функции, несколько настольных программ редактирования предоставят вам больший контроль над вашими GIF-файлами.
Анимация или фото?
Хотя они обычно используются для беззаботных целей, таких как мемы и GIF-файлы реакции, они могут быть весьма универсальными. Один малоизвестный факт о GIF-файлах заключается в том, что их можно использовать для неподвижных изображений, но они имеют некоторые ограничения. GIF-файлы поддерживают только ограниченное количество цветов, поэтому они плохо подходят для фотографий с большим количеством деталей.
Можно ли использовать файлы GIF для фотографий с высоким разрешением?
Файлы изображений GIF ограничены только 256 цветами, что делает их плохим выбором для фотографий с высоким разрешением. Файлы JPEG чаще используются для фотографий, поскольку они могут отображать миллионы цветов.
Ограничения на создание файлов GIF
Большинство онлайн-инструментов для создания GIF позволяют создавать файлы размером не более 200 МБ. Некоторые инструменты также имеют ограничения по времени для анимированных GIF-файлов, например 15 секунд.
Могу ли я добавить звук в свой GIF-файл?GIF-файлы не могут содержать звук. Это связано с тем, что формат GIF не поддерживает аудиоданные. В результате любой звук, связанный с GIF, должен храниться в отдельном файле.
Вектор или GIF
Файлы GIF представляют собой тип растровых файлов. Это означает, что файлы GIF состоят из сетки пикселей, где каждый пиксель соответствует своему цвету или оттенку. Файлы GIF обычно имеют небольшой размер, что делает их идеальными для использования в Интернете. Векторные файлы, с другой стороны, состоят из линий и кривых. Это делает их гораздо более подходящими для таких вещей, как логотипы и иллюстрации, где нет необходимости в большом количестве цветов. Векторные файлы также можно масштабировать до любого размера без потери качества, в то время как растровые файлы станут пикселизированными, если они будут увеличены слишком сильно.
Анимированные GIF-файлы в электронной почте: примеры и способы их создания [Руководство]
Как продавец электронной почты, вы всегда пытаетесь улучшить свои кампании с помощью текста, дизайна и изображений. Но с такой большой конкуренцией за внимание подписчиков вам нужно проявить творческий подход к тому, как побудить читателей перейти по ссылке и заинтересоваться вашим сообщением. Введите: Анимированные GIF-файлы в электронной почте.
Маркетологи электронной почты все чаще обращаются к анимированным GIF-файлам в электронной почте, чтобы обеспечить дополнительный визуальный интерес к своим сообщениям. Согласно нашим данным о состоянии электронной почты за 2020 год, 51,28% маркетологов заявили, что хотя бы иногда используют анимированные GIF-файлы в своих маркетинговых электронных письмах.
Итак, как вы можете принять участие в этом действии? В этом сообщении блога мы рассмотрим:
- Что такое GIF
- Преимущества (с вдохновляющими примерами)
- Недостатки анимированных GIF
- Как создавать анимированные GIF с помощью Adobe Animate
- Рекомендации по созданию анимированных GIF
- Поддержка почтового клиента и время загрузки
Что такое анимированный GIF?
GIF (сокращение от Graphics Interchange Format) — это формат изображения, разработанный CompuServe в 1987. Благодаря широкой поддержке браузеров и почтовых клиентов GIF-файлы были популярным форматом изображений с первых дней существования Интернета.
Что еще более важно, GIF-файлы можно анимировать. Подобно тому, как работает флипбук, GIF-файлы быстро отображают серию изображений, создавая иллюзию движения. В первые годы существования Интернета GIF-файлы (а также теги выделения и мигания) были основным методом добавления движения на веб-страницу.
Многое изменилось с 1990-х годов. Анимированные GIF-файлы переживают ренессанс как в Интернете, так и в электронном маркетинге. Хотя до сих пор ведутся споры о том, как на самом деле произносится «GIF», большинство согласится с тем, что GIF-файлы могут быть отличным маркетинговым инструментом.
Каковы преимущества анимированных GIF-файлов в электронной почте?
Предпочитаете ли вы твердую «G» или любите рифмовать GIF с определенной маркой арахисового масла, давайте посмотрим, почему GIF так полезны в электронных письмах.
1. Привлеките внимание ваших подписчиков
Добавление анимации в электронную почту с помощью GIF — отличный способ привлечь внимание ваших подписчиков, указать им на действие, которое вы хотите, чтобы они предприняли, или заставить их прокручивать, чтобы убедиться, что они получили ваше сообщение. целое сообщение.
Grammarly использует тонкую анимацию, чтобы привлечь внимание к своему предложению.
Источник: Really Good Emails
Xfinity размещает свои GIF дальше в письме, чтобы привлечь подписчиков и побудить их прокручивать страницу.
Источник: Really Good EmailsМы использовали псевдо-видео GIF, чтобы привлечь внимание к нашему видео и заинтересовать подписчиков кликнуть, чтобы увидеть больше.
См. полный текст электронного письма в действии2. Покажите свои продукты и услуги
Вы знаете, что ваш продукт великолепен. Убедитесь, что ваши подписчики тоже знают об этом. Нет ничего лучше анимированного GIF, чтобы показать, как работает ваш продукт или услуга.
ILIA Beauty демонстрирует свой продукт в действии с реальными людьми.
Источник: Really Good Emails
Webflow показывает свой продукт в действии, чтобы подписчики знали, чего ожидать.
Источник: Really Good EmailsMagic Spoon демонстрирует разнообразие вкусов и потрясающий дизайн упаковки.
Источник: Really Good Emails3. Упростите сложную идею
Если изображение стоит тысячи слов, то анимированное изображение , вероятно, стоит даже больше. Используйте анимированный GIF, чтобы проиллюстрировать сложную идею или показать своим подписчикам, что все еще проще, чем они думают.
Баггу вывел простые инструкции по уборке на новый уровень, анимировав их. Сделав четыре разных анимации, подписчикам приходится прокручивать страницу, чтобы увидеть всю историю.
Источник: Really Good EmailsHeadspace показывает вам, как обрести спокойствие с помощью GIF, лучше, чем кто-либо может объяснить словами.
Источник: Really Good Emails4.
Расскажите о чем-то новом или о том, что скоро появитсяУ вас есть новый контент или продукт, который вы собираетесь выпустить? У вас скоро появится отличное предложение? Используйте анимированный GIF-файл, чтобы повысить осведомленность или интерес к вашему продукту, и пусть подписчики будут ждать вашего следующего письма.
Apple объявляет о расширенной распродаже в Черную пятницу и призывает подписчиков «сохранять даты» покупок, чтобы не упустить выгодные предложения.
Источник: Really Good EmailsЭлектровелосипед Линуса в этом письме только намекается. Подписчики должны будут щелкнуть, чтобы увидеть фактический продукт.
Источник: Really Good EmailsTinker тизерит как распродажу в Черную пятницу, так и часы с ограниченным тиражом с помощью этого анимированного GIF, чтобы подписчики с нетерпением ждали следующего электронного письма с дополнительной информацией.
Источник: Really Good EmailsНедостатки анимированных GIF-файлов в электронном маркетинге
Какими бы замечательными ни были анимированные GIF-файлы, они не лишены недостатков.
Отсутствие доступности
Анимированные GIF-файлы могут создавать проблемы с точки зрения доступности по целому ряду причин.
Частота мигания контента от 2 Гц до 55 Гц может нанести вред пользователям, страдающим светочувствительной эпилепсией. Кроме того, у слабовидящих пользователей могут возникнуть трудности с чтением или просмотром контента в формате GIF до изменения анимации. Поэтому убедитесь, что ваши анимированные GIF-файлы имеют плавные переходы или не анимируются от одного кадра к другому с высокой скоростью.
И, поскольку GIF-файлы являются файлами изображений, вы всегда должны включать соответствующий альтернативный текст для пользователей, которые полагаются на вспомогательные технологии, такие как программы чтения с экрана. Изображения по своей природе недоступны для многих людей, поэтому предоставление текста и контекста позволяет им более четко понять ваше сообщение.
Создавайте доступные, инклюзивные электронные письма для всех ваших подписчиков Получите информацию и пошаговые советы, необходимые для написания, дизайна и кодирования электронных писем, которыми может наслаждаться каждый — независимо от их способности. Узнайте, как → |
Плохая прозрачность фона
Если вам нужно добавить больше цвета или немного прозрачности фона в анимированный контент, тогда анимированный GIF не подойдет.
GIF-файлы некрасивы, когда дело доходит до прозрачного фона. Но вы можете предоставить анимированную альтернативу электронной почте в виде анимированного PNG (APNG). Обязательно обратите внимание на те же советы и рекомендации по сжатию, которыми мы поделимся далее, поскольку APNG также любят накапливать килобайты (КБ).
И если вы ищете еще одну альтернативу анимированным GIF-файлам, вы можете изучить анимацию CSS.
Создание анимированных GIF-файлов для кампаний по электронной почте с помощью Adobe Animate
Вы можете создавать GIF-файлы несколькими способами. Онлайн-конструкторы позволяют вам анимировать выбранные фотографии или превращать видео в анимированный GIF, или вы можете использовать программное обеспечение, такое как Adobe Photoshop или Adobe Animate, для перемещения пользовательских дизайнов.
Вот обзор того, как сделать анимированный GIF в Adobe Animate.
Шаг 1: Создайте новый файл и введите размеры
Чтобы создать GIF в Adobe Animate, сначала создайте новый файл и введите желаемые размеры. Совет для профессионалов: создавайте анимацию в два раза больше для дисплея сетчатки, как и для статических изображений.
Шаг 2. Импорт графики для анимации
Вы можете создать анимацию прямо на холсте, используя формы и инструменты рисования программы, создавая слой для каждого элемента. Если вы создали дизайн для своей анимации в Adobe Illustrator, вы можете просто скопировать и вставить векторную графику на свой холст. В противном случае вы можете импортировать графику в Adobe Animate, выбрав «Файл» > «Импорт» > «Импортировать в рабочую область». Или, если вы импортируете графику, которая будет повторно использоваться несколько раз, вы можете «импортировать в библиотеку».
Шаг 3: Создайте анимацию
Теперь вы можете использовать временную шкалу для создания анимации. Есть много возможностей с таким программным обеспечением, и было бы трудно затронуть все это в одном посте в блоге. Тем не менее, существует множество ресурсов с множеством полезных руководств на YouTube, в онлайн-руководствах Adobe и в самом программном обеспечении.
Я бы порекомендовал обратить особое внимание на контент, связанный с символами, анимацией и простотой. Только с помощью этих трех функций вы можете создать привлекательную анимацию, которая поможет привлечь внимание, донести ваше сообщение и порадовать вашу аудиторию. Все это привносит в ваши электронные письма ведра индивидуальности бренда.
Символы
Символ — это изображение, кнопка или фрагмент ролика, который вы создаете один раз, а затем повторно используете, выбирая его из библиотеки.
После того как вы создали символ, вы можете повторно использовать его в своей анимации — это называется экземпляром. Если бы вы отредактировали свой символ, например, изменив цвет, это было бы сделано во всех экземплярах (аналогично частям электронной почты). Но если бы вы редактировали экземпляр, ваши изменения применялись бы только к этому экземпляру.
Для анимированных GIF-файлов мы предлагаем только преобразовать элементы дизайна в графические символы. К клипам роликов и кнопкам прикреплена собственная временная шкала, поэтому их можно анимировать независимо от основной временной шкалы. Однако, поскольку любые анимации, созданные за пределами основной временной шкалы, не учитываются при экспорте анимации в формате GIF, имеет смысл придерживаться графических символов, которые анимируются только на основной временной шкале.
Анимация
Анимация — это способ анимации из одного состояния в другое. Вы можете использовать форму, движение или классическую анимацию.
Анимация формы может использоваться только с фигурами или элементами, которые вы нарисовали на холсте или векторах, импортированных с помощью настроек средства импорта AI (а не в виде растрового изображения). Это связано с тем, что анимация формы позволяет изменять форму объекта. Например: вы можете добавить круг к одному ключевому кадру на временной шкале, добавить квадрат к другому, а затем превратить свой круг в квадрат с помощью анимации формы.
Анимации движения используются для создания анимационных движений путем задания разных значений между первым и последним кадрами. С помощью этого типа анимации вы можете изменять свойства объекта, включая положение, размер, цвет, эффекты, фильтры и вращение.
Классическая анимация очень похожа на анимацию движения. Он был перенесен из Flash и сохранен в Animate в качестве дополнительной опции. Это мой предпочтительный способ применения анимации движения, так как методы смягчения (обсуждаемые ниже) немного проще в применении.
Замедление
Замедление идет рука об руку с анимацией. Если перемещение объекта из одного положения в другое с помощью временной шкалы — это торт, то замедление — это глазурь!
С помощью функции замедления Animate можно ускорить или замедлить анимацию движения в начале или в конце. Или добавьте небольшой отскок, когда анимация будет завершена. Это действительно помогает привнести индивидуальность в вашу анимацию.
Легкость, примененная к этой анимации, запускает анимацию быстро и замедляет ее в конце.
В этом примере мы применили плавность отскока к анимации движения.
Для получения информации о том, как применить смягчение, посмотрите это видео на YouTube.
Шаг 4. Экспортируйте анимированный GIF-файл
Сохранение анимации из Adobe Animate в формате GIF — это удобно и просто. Просто выберите «Файл» > «Экспорт» > «Экспорт анимированного GIF».
Как уменьшить размер GIF-файла
Независимо от того, используете ли вы Adobe Animate или что-то еще — сохранение небольшого размера GIF для электронной почты имеет решающее значение для электронной почты. Есть несколько вещей, которые стоит учитывать, чтобы сделать ваши анимации максимально легкими.
Сжатие
Такие инструменты, как Animate и Photoshop, имеют ограниченные параметры сжатия для файлов GIF; часто вместо сжатия лучше использовать внешнее программное обеспечение. Мы рекомендуем ImageOptim, который можно загрузить бесплатно, или EZgif, бесплатный онлайн-инструмент для оптимизации GIF, чтобы уменьшить размер файла до оптимального веса. Мы рекомендуем оставить размер меньше одного мегабайта (МБ), но оптимальный размер файла будет варьироваться и зависит от времени загрузки электронной почты.
Плоский цвет
Включение фотографии или градиентов в вашу анимацию добавляет веса из-за количества содержащихся в них цветов и оттенков. GIF может содержать только 256 цветов — по сравнению с JPEG, который может включать более 16 миллионов — что часто приводит к снижению качества. Главное, чтобы все было просто.
Ограниченное количество кадров
Чем короче анимация, тем лучше. Каждый кадр, который содержит ваша анимация, добавляет вес GIF. Поскольку анимация действительно должна дополнять ваш текст, ограничьте продолжительность воспроизведения анимации и поощряйте читателей двигаться дальше по электронной почте.
Если вы обнаружите, что ваш GIF-файл имеет слишком большой вес после сохранения и сжатия, вы можете удалить кадры с помощью Photoshop или EZgif.
Проверка вашего анимированного GIF-файла
Теперь, когда вы завершили свой GIF-файл, вы можете получить отзыв или одобрение, прежде чем отправлять его по электронной почте. С помощью инструмента для совместной работы в режиме реального времени, такого как Litmus Proof, вы можете централизовать все комментарии и одобрения.
Дружелюбное предупреждение: доступно только в планах Litmus Enterprise.Соедините GIF-файлы с CTA
Анимированные GIF-файлы можно использовать для привлечения подписчиков к определенному действию, которое вы от них хотите.
Pond5 использует анимированный GIF-файл, чтобы привлечь внимание к основному призыву к действию (CTA) электронного письма «Скачать бесплатный клип».
Источник: Really Good EmailsДумайте о малом
Когда дело доходит до GIF, думайте о малом: немногое может иметь большое значение. Анимируя только часть письма, вы можете добавить немного анимации, не переусердствуя. Кроме того, это помогает уменьшить общий размер файла GIF.
Вот пример от Adobe — они сохраняют анимацию в небольшой части электронного письма, но это имеет большое значение.
Еще один способ уменьшить масштаб — создать короткую анимацию, которую можно зацикливать. Это ограничивает количество кадров в анимации, а также помогает уменьшить размер файла.
Используйте GIF-файлы, чтобы добавить индивидуальности
Подчеркните индивидуальность вашего бренда в электронной почте с помощью анимированных GIF-файлов, как это делает Рип Ван Вафелс с помощью этой игривой анимации ниже.
Внедрение анимированных GIF-файлов в электронную почту
Когда у вас есть готовый GIF-файл, вы можете включить его в свое электронное письмо почти так же, как и любой другой файл изображения:
Однако есть несколько уникальных вещей, которые вам нужны. рассмотреть: какие почтовые клиенты поддерживают анимированные GIF-файлы и как долго они загружаются в вашу электронную почту.
Другие рекомендации по электронной почте с анимированными GIF-файлами
Кроме того, при добавлении анимированных GIF-файлов в электронные письма следует учитывать следующие три фактора: поддержку, время загрузки и среднюю скорость загрузки содержимого.
Поддержка
Анимированные GIF поддерживаются почти везде. В 2019 году Outlook расширил поддержку анимированных GIF-файлов, но это касается только Office365. Outlook 2007-2019 по-прежнему не поддерживает анимированные GIF-файлы.
Вот краткая таблица того, какие почтовые клиенты поддерживают и не поддерживают анимированные GIF-файлы:
Настольные клиенты | Клиенты веб-почты | Мобильные клиенты |
Gmail ✓ | iOS Mail ✓ | |
Outlook 2007–2019 ✘ | G Suite ✓ | Gmail ✓ |
Outlook для Mac ✓ 900 03 | Yahoo! Почта ✓ | Gmail IMAP ✓ |
Apple Mail ✓ | AOL ✓ | 9034 6|
Windows 10 Mail ✓ | Outlook. com ✓ | Outlook ✓ |
Office365 ✓ | Office365 ✓ | Yahoo ✓ 900 03 |
Комкаст ✓ | AOL ✓ | |
Orange.fr ✓ | ||
SFR.fr ✓ | ||
GMX.de ✓ | ||
Web.de ✓ | ||
T-Online.de ✓ | ||
Freenet.de ✓ 900 03 | ||
Mail.ru ✓ |
Чтобы обеспечить наилучшее качество изображения в условиях, когда анимированные GIF-файлы не поддерживаются, убедитесь, что первый кадр содержит все необходимое в качестве резервного статического изображения.
Вы также можете предоставить резервный вариант для Outlook, скрыв обычное изображение GIF и отобразив статическое изображение и/или другое содержимое внутри условий Outlook: клиенты пользуются популярностью у вашей аудитории. Если оутлук 2007-2019является основным клиентом с вашей базой подписчиков, найдите время, чтобы убедиться, что резервный вариант работает, как и планировалось. (Согласно данным, полученным с помощью Litmus Email Analytics, Outlook был самым популярным настольным клиентом на июнь 2022 г.)
Время загрузки
Ранее мы обсуждали размеры файлов. Время загрузки — это то место, где размер файла становится очень важным.
Вы можете проверить время загрузки с помощью такого инструмента, как автоматизированный контрольный список тестирования перед отправкой Litmus, чтобы увидеть, не слишком ли долго загружаются ваши изображения. В среднем мы обнаружили, что чуть более половины получателей тратят на электронное письмо менее двух секунд. Таким образом, ваши анимированные GIF-файлы должны загружаться быстро, чтобы произвести впечатление.
Мы протестировали файлы разных размеров, чтобы определить их среднюю скорость загрузки при разных подключениях. В среднем анимированный GIF-файл размером 4,4 МБ загружается в два раза дольше при подключении 4G LTE, чем при подключении Ethernet.
Вот некоторые средние скорости для разных размеров файлов при разных подключениях, основанные на нашем собственном эксперименте:
Средняя скорость загрузки контента (в секундах)
Размер файла | 4G LTE | WiFi | Ethernet |
180kB GIF | 0,37 | 0,29 | 0,22 |
1MB .18 | 0,54 | 0,44 | |
3,2 МБ 9 1,44 | 1,04 | ||
4,4 МБ GIF 2 1,34 |
Это время является скоростью загрузки контента и не учитывает время до первого байт (TTFB). TTFB — это способ измерения скорости отклика веб-сервера. Поэтому, если вы размещаете свои изображения на сервере, который медленно отвечает, время загрузки анимированных GIF-файлов для ваших подписчиков увеличится.
Помимо более медленной загрузки, анимированные GIF-файлы с большими размерами файлов также будут быстрее использовать данные, что, вероятно, не понравится вашим подписчикам.
Поскольку вы не можете контролировать скорость вашего сервера, подключение вашего подписчика или тарифный план вашего подписчика, становится чрезвычайно важно убедиться, что ваши анимированные GIF-файлы достаточно малы, чтобы ваша аудитория могла просматривать их независимо от того, где они открываем вашу электронную почту. Мы рекомендуем не более 1 МБ.
Проверьте свои анимированные GIF-файлы в электронной почте с помощью Litmus
Анимированные GIF-файлы способны восхищать, удивлять и очаровывать ваших подписчиков электронной почты. Но убедитесь, что вы используете свои GIF-файлы с умом! Ваши подписчики всегда должны быть в центре внимания при создании и внедрении GIF-файлов в ваши электронные письма. Не анимируйте только потому, что можете — подумайте, какую пользу это принесет вашей аудитории.
Кроме того, чтобы ваши анимированные GIF-файлы выглядели правильно, убедитесь, что тестирование электронной почты является частью вашего рабочего процесса. Время, потраченное на тестирование, будет иметь большое значение и поможет вам действительно предоставить незабываемый (и ценный) опыт для подписчиков. А с помощью такого инструмента, как Litmus Email Builder, вы можете тестировать свою электронную почту по мере ее создания и предварительно просматривать ее в более чем 100 популярных почтовых клиентах в едином удобном представлении, что экономит ваше время и помогает работать более эффективно.
Убедитесь, что ваш дизайн выглядит правильно Неработающие электронные письма приводят к снижению конверсии. Предварительно просматривайте свои электронные письма в более чем 100 почтовых клиентах, приложениях и устройствах, чтобы обеспечить безошибочное взаимодействие с подписчиками. Оставить комментарий
|