Как создать GIF-анимации и видео для соцсетей: подробное руководство
45579 42
Контент-маркетинг | – Читать 10 минут |
Прочитать позже
Иллюстрация: Наталья Сорока
Олег Бурков
Региональный специалист Canva
Тексты и картинки, картинки и тексты. Репертуар SMM-специалиста часто страдает однообразием. Как добиться увеличения конверсии без роста затрат на контент? В этой статье я расскажу, как использовать анимацию в маркетинговых каналах.
В 2018 году никого не нужно убеждать в важности визуального контента. По оценке агентства Reuters, 84% всего интернет-трафика в этом году будет приходиться на видеоконтент.
Тот же тренд давно прослеживается и в социальных сетях: количество коротких видео и смешанных форматов, включающих фото, текст, видео и анимацию растет на глазах. На сегодняшний день пользователи Facebook расшаривают GIF-анимацию в 2 раза чаще, чем статичные изображения.
Но если рисовать баннеры и макеты email-рассылок для штатных дизайнеров — привычное дело, то поточное производство видео или анимированных гифок, как кажется, требует иной квалификации, а также дополнительных временных и финансовых затрат.
Если, конечно, вы хотите использовать уникальную графику, продвигающую ваш продукт, а не иллюстрировать посты трендовыми гифками из огромного архива Giphy и других подобных ресурсов.
Покажу, как создавать анимированную графику на примере конструктора Canva, который позволяет конвертировать статические изображения в видео или GIF.
Создаем анимацию
#1
Выбираем тип иллюстрации
Первое, с чем нужно определиться — для какой платформы и каких целей нужна анимация. Каждый из видов графики создается с заданным размером картинки, например:
- пост в Facebook: 940x788px;
- пост для Instagram: 1080x1080px;
- пост для социальных сетей (можно использовать для ВКонтакте): 800x800px;
- Веб-баннер: 560x315px;
- Рекламный баннер «небоскреб»: 160x600px.
Для удобства возьмем квадратный формат поста для Инстаграма.
#2
Выбираем макет
Поскольку создание графики происходит на основе редактируемых макетов, нужно определиться с конкретным образцом. Если у вас уже сформировался определенный фирменный стиль, подберите макет максимально близкий к тому, что вы использовали в маркетинге ранее.
Условно их можно разделить на несколько стилей:
- Макеты с использованием фотографий — подойдут для заведений, туристических компаний, недвижимости и других сфер, предлагающих нечто осязаемое. Среди таких макетов тоже встречаются более или строгие — черно-белые или цветные, с одним фоновым фото или коллажом.
- «Мультяшные» макеты — для тех, кому по душе «домашний» стиль. Подойдет для детских товаров, сфера образования, рукоделия, различных бытовых сервисов.
- Абстракция / орнамент — ни к чему не обязывающие дизайны, которые можно использовать для иллюстрации разовых акций или скидок. Весь акцент с самой графики переносится на сообщение.
При выборе макета не обязательно зацикливаться на конкретной фотографии или цветах, поскольку любой элемент можно заменить на другой из встроенного каталога или загрузить собственную графику.
Однако учитывайте размер дизайна: фотография с меньшим разрешением, чем размеры вашей иллюстрации, будет смотреться плохо. Чем лучше качество фото — тем лучше.
NB! Чем больше отдельных элементов используется в дизайне, тем длиннее по времени (а значит, и размеру файла) может получиться анимация.
Кроме того, исходя из опыта, рекомендую не редактировать выбранный макет слишком радикально, иначе есть риск, что программа не справится с конвертацией картинки в видео:
- Не вставляйте три или четыре фотографии, если в макете использована одна.
- Не добавляйте слишком много дополнительных иконок и фигур, сверх изначального количества.
- Не используйте фотофильтры и кастомные шрифты — они не будут отображены в итоговой анимации.
#3
Брендируем картинку
Перейдя во вкладку «Мое», редактор может загрузить собственную графику: например, логотип для брендирования изображений (а также их защиты от плагиата). Загруженный логотип, если он представляет собой не сплошной прямоугольник с заливкой, а некую эмблему или просто название компании, нужно загружать в формате PNG с прозрачным фоном.
Расположите логотип в одном из углов дизайна, чтобы он не перекрывал другие детали или надписи, а стоял особняком и занимал примерно ⅕ высоты и ширины, в зависимости от горизонтальной или вертикальной ориентации дизайна.
Хотя Canva позволяет сделать логотип или любую другую деталь макета полупрозрачной, рекомендуем сохранять лого в полном цвете и подбирать контрастный фон — вряд ли ваш бренд настолько узнаваем, чтобы скромничать в этом вопросе.
#4
Скачиваем GIF или видео
Когда дизайн готов, остается сохранить его в анимированном виде — здесь и начинается магия. При выборе формата для скачивания просто выберите «GIF-анимация/видео» вместо стандартных JPEG, PNG или PDF. Редактор предложит шесть вариантов анимации: с элементами, постепенно вылетающими сбоку, падающими снизу, наплывающими «изнутри» кадра и т. д.
Анимация — опция, доступная в платной подписке Canva for Work. Этой функцией можно воспользоваться во время бесплатного триального периода подписки.
Длина роликов составит от 3 до 8 секунд — это позволяет ограничить размер анимации несколькими мегабайтами и сделать ее удобной для просмотра на стационарных и мобильных устройствах. Выбрав стиль анимации, можно скачать файл в .gif или .mp4 в зависимости от платформы, на которой нужно его использовать.
Где использовать GIF
Facebook
В 2017 году Фейсбук начал поддержку отображения гифок в ленте, комментариях и рекламных постах. Однако файл должен быть расположен на стороннем сервисе и иметь свой URL. Для вставки гифки нужно скопировать ее адрес в пост, чтобы соцсеть «подгрузила» анимацию, после чего сам адрес можно стереть.
Самая популярная платформа для хостинга GIF-файлов — все тот же Giphy. Есть ряд ограничений: размер не более 8 МБ, размеры, которые чаще всего рекомендуют: 400×400 px, а в случае использования GIF для рекламы, как и в случае с обычными баннерами — текст не должен занимать более 20% от площади изображения.
В то же время, загрузить GIF-файл в пост все-таки можно, однако он все равно будет распознан как видео.
ВКонтакте
В отличие от глобального конкурента, ВКонтакте поддерживает как сторонний, так и внутренний хостинг GIF-файлов: гифку можно прикрепить к посту как «Документ». В ленте гифки отображаются в миниатюре и увеличиваются до полного размера при клике. GIF также отлично смотрится в новом «Редакторе статей», ставшем более интуитивной альтернативой wiki-страницам.
Twitter
Важно помнить, что Twitter может отобразить только одну гифку в записи. Кроме того, анимированные GIF-файлы нельзя опубликовать в твите, который содержит сразу несколько изображений. В остальном добавление гифок работает так же, как в случае с обычными фотографиями.
Где использовать MP4-видео
В целом, ситуация с поддержкой видео проще, чем с GIF. Все крупные социальные платформы поддерживают загрузку видео к постам и их органичное отображение в верстке статей (к примеру, в Facebook Notes или новом «Редакторе статей» ВКонтакте). Поэтому специально остановимся только на трех менее очевидных случаях.
Instagram
Короткие видео встречаются в ленте Инстаграма так же часто, как фотографии, а рекламодатели активно используют их в своих промо-кампаниях. Длина анимации, созданной в Canva, оптимальна для этих целей — короткие ролики не требуют долгой загрузки и не успевают надоесть. В то же время, они привлекают внимание читателей.
Популярная в России платформа автоматически зацикливает короткие ролики в 10-секундные ролики с наложенным поверх саундтреком.
Другими словами, Coub создает бесконечную гифку со звуком — этот формат может придать короткому ролику неожиданный комический эффект, как, например, в этом популярном коубе с кивающим в такт музыке Джоном Траволтой.
Воспроизведение коубов поддерживается ВКонтакте. Продолжительность видеофрагмента, который можно зациклить, начинается с 0.1 секунды.
Яндекс Дзен
Создатели Дзена рекомендуют авторам «нарративов» использовать ролики длинной до 10 секунд, поэтому анимация Canva может органично вписаться в этот новый для Рунета медиаформат. Настройки редактора в Дзене позволяют адаптировать изображение под ширину экрана.
Сохраняем баланс
В маркетинговом плане предпочтительно сохранять баланс между различными видами контента. Не стоит полностью отказываться от статичных изображений и фотографий, ведь несмотря на то, что гифки и видео лучше резонируют с большей частью аудитории, их нельзя назвать универсальным инструментом для популяризации контента.
Избыточное увлечение одним из медиаформатов часто приводит к тому, что аудитория начинает от него уставать. Используйте анимацию там, где действие или внимание аудитории действительно нужно.
Ненавязчивая анимация может стать по-настоящему действенным инструментом увеличения конверсии и привлечь внимание к вашему сообщению в бесконечной ленте, где СМИ, блогеры и бренды конкурируют за каждую лишнюю секунду внимания пользователя.
Особенно актуальным этот инструмент делает внедрение автозапуск видео в ленте. Поэтому если вы еще не попробовали этот вид медиа — самое время попробовать. Тем более, что на создание одного мини-ролика уходит не больше 15 минут.
Serpstat — набор инструментов для поискового маркетинга!
Находите ключевые фразы и площадки для обратных ссылок, анализируйте SEO-стратегии конкурентов, ежедневно отслеживайте позиции в выдаче, исправляйте SEO-ошибки и управляйте SEO-командами.
Набор инструментов для экономии времени на выполнение SEO-задач.
Получить бесплатный доступ на 7 дней
Оцените статью по 5-бальной шкале
4.45 из 5 на основе 62 оценок
Нашли ошибку? Выделите её и нажмите Ctrl + Enter, чтобы сообщить нам.
Рекомендуемые статьи
Контент-маркетинг
Author
Катерина Ерошина: «Как понять, что пора приниматься за контент-маркетинг (и надо ли вообще)»
Контент-маркетинг +1
Igor Gorbenko
25 советов, которые помогут вам продвинуться на Reddit
Контент-маркетинг
Author
Как увеличить органический трафик с помощью контент-маркетинга — советы Toggl
Кейсы, лайфхаки, исследования и полезные статьи
Не успеваешь следить за новостями? Не беда! Наш любимый редактор подберет материалы, которые точно помогут в работе. Только полезные статьи, реальные кейсы и новости Serpstat раз в неделю. Присоединяйся к уютному комьюнити 🙂
Нажимая кнопку, ты соглашаешься с нашей политикой конфиденциальности.
Поделитесь статьей с вашими друзьями
Вы уверены?
Спасибо, мы сохранили ваши новые настройки рассылок.
Сообщить об ошибке
Отменить
Как создать GIF анимацию самостоятельно
Сделать анимацию можно из фото, видео и собственно рисунка. Рассмотрим самые простые и популярные варианты создания Gif -изображений.
Сделать Gif из видео
Шаг 1: откройте видео на сайте или просто скопируйте ссылку в адресную строку, добавьте перед «YouTube .com » буквы «Gif ».
Шаг 2: дождитесь перенаправления на сайт «gifs .com » и обработки видео. Используя таймлайн, выберите отрезок видеоролика для создания изображения.
Шаг 3: нажмите «Обрезать клип». Используя меню справа, можно добавить подпись, свой логотип, изображение, сделать вставку баннера , изменить палитру, насыщенность цветов, развернуть по горизонтали или вертикали, исказить пропорции.
Шаг 4: после всех настроек нажмите «Create Gif », укажите в новом окне название, тэги , добавьте звук.
Пример:
Чтобы скачать изображение, необходимо зарегистрироваться. Сервис условно бесплатный. Для получения доступ к VIP -функциям – убрать вотермарк, необходимо заплатить $2 в месяц.
Похожие сервисы: Giphy, Convertio.
Сделать Gif из фото
Шаг 1: зайдите на сайт и выберите несколько фотографий. Нажмите «Загрузить и сделать Gif ».
Шаг 2: перетащите картинки так, чтобы они стояли в нужном порядке. Определите время задержки, при необходимости обрежьте изображения.
Шаг 3: выставьте параметры других настроек и нажмите «Создать Гифку !».
Шаг 4: после создания изображения его можно дополнительно обработать. Нажмите «Спасти», чтобы сохранить.
Ezgif – предоставляется бесплатно, много настроек, связанных со временем появления изображения, есть инструменты оптимизации.
Пример:
Похожие сервисы: Gifovina, Htmlweb, Canva.
Нарисовать Gif анимацию самому
Шаг 1: посетите сайт , выберите кисть для рисования. Сделайте первый рисунок, затем нажмите «ADD +», сделайте второй рисунок.
Шаг 2: Нажмите на изображении спидометра, чтобы выставить скорость от 0,1 до 30 кадров в секунду. Нажмите кнопку «Play ».
Brush.ninja – функций мало, зато все интуитивно понятно и максимально просто.
Итог
Gifs.com – быстро и удобно, много полезных инструментов, недорогая подписка, гифками можно делиться с друзьями в социальных сетях в один клик. Работает с Vine, Instagram, Facebook и YouTube, можно загрузить свой ролик с HDD. Не работает с фотографиями и рисунками.
Ezgif – не работает с видео, в остальном идеальный сервис.
Brush .ninja – простой, но не самый удобный веб -иснтрумент для рисования. Для сохранения изображения необходимо зарегистрироваться.
Также не стоит забывать что все это вы можете сделать в фоторедакторах для компьютера, например в Gimp по этой инструкции, а редактировать уже готовую гифку можно в бесплатном редакторе Krita вот по этой инструкции.
Данный материал является частной записью члена сообщества Club.CNews.
Редакция CNews не несет ответственности за его содержание.
1 год назад | категории: Графика: Графические утилиты Графика: Редакторы Образование: Работа на компьютере Образование: Справки и мануалы
Как преобразовать видео в GIF, чтобы улучшить взаимодействие — Screencast-O-Matic
Три простых шага. Это все, что нужно для бесплатного преобразования видео в файл GIF. Весь процесс создания GIF можно легко выполнить всего за несколько кликов, что делает его быстрым и достаточно простым для любого.
Анатомия GIFGIF — это короткие клипы, не более десяти секунд, без звука. GIF-файлы часто воспроизводятся автоматически в цикле. Файлы загружаются быстро и могут работать на разных платформах. Небольшой размер файла позволяет без проблем делиться, загружать или встраивать GIF-файлы на веб-сайт или в электронную почту.
Большинство людей создают GIF, используя видео или простые анимации. Любой, у кого есть редактор видео Screencast-O-Matic, может бесплатно настраивать и конвертировать видео в GIF. Узнайте больше об уникальных аспектах файлов GIF из нашей статьи о том, как сделать анимацию GIF бесплатно.
Креативные способы использования GIF-файловGIF-файлы могут быть быстрым и простым способом улучшить профессиональные проекты, создавать инструкции по рабочему процессу, проводить маркетинговые кампании и улучшать публикации в социальных сетях. Вы также можете отправлять забавные причудливые GIF-файлы друзьям, семье и коллегам, чтобы донести свою точку зрения в увлекательной форме.
Вот несколько творческих советов по использованию и созданию GIF, которые привлекут внимание людей:
1 — Профессиональные презентации
Преобразуйте видео в GIF, чтобы сэкономить время во время деловых встреч и сделать презентации более эффективными. Вместо того, чтобы показывать полные, трудоемкие видеоролики во время презентаций, вместо этого сократите видео до основных моментов при создании файла GIF. Вы можете отправить электронное письмо и ссылку на полное видео, если коллеги захотят просмотреть весь контент.
2 – Инструкции по рабочему процессу
Скринкасты — популярный инструмент среди профессионалов, создающих онлайн-учебники. Если ваше руководство короткое и простое, обычно не более 10 секунд, вы можете создать файлы GIF, чтобы пояснить его наглядно.
Улучшите свое видео в редакторе видео Screencast-O-Matic, добавив текст, наложения фигур или изображения. Наложения фигур особенно полезны в кратких руководствах по указанию важных кнопок или функций в записи.
3 – Маркетинговые кампании
Вставьте GIF-файлы в свое следующее маркетинговое письмо. Будь то главное изображение, рекламное изображение, изображение продукта или другие полезные изображения в вашем контенте, когда вы создаете анимацию GIF, это может помочь вашему изображению выделиться больше, привлекая зрителей к важной информации. Циклические GIF-файлы придают дополнительную ценность электронным письмам, чтобы зрители могли видеть полную информацию в случае, если они пропустили полную анимацию при первом отображении..
4 – Контент в социальных сетях
GIF-файлы являются отличной стратегией для кампаний в социальных сетях и поддерживаются большинством платформ социальных сетей из-за их небольшого размера и качества файла изображения. Тот факт, что GIF-файлы воспроизводятся автоматически, — это золото социальных сетей. Когда вы создаете GIF-анимацию, это поможет привлечь их внимание, когда они прокручивают контент, и вам больше не нужно рассчитывать на аудиторию, решившую воспроизвести ваш контент.
5 – Забавные видеомемы
Вы можете использовать анимированные GIF-файлы для создания забавных видеомемов, которыми вы можете поделиться и использовать для привлечения внимания. Мемы часто представляют собой статические изображения или короткие видеоклипы с текстом, чтобы донести сообщение.
Превратите свои видео в GIF за 3 простых шагаScreencast-O-Matic упростил создание GIF с помощью функций GIF Maker нашего видеоредактора. Когда вы закончите создание видео, выполните следующие простые действия, чтобы преобразовать видео в формат GIF, чтобы использовать его в качестве графических файлов, которыми легко делиться.
Шаг 1: Существует несколько вариантов загрузки и сохранения видео. В меню нажмите «Сохранить как видеофайл».
Шаг 2: Выберите «Тип» и выберите «GIF» в раскрывающемся меню. Вы также можете добавить имя файла, выбрать папку и тип качества.
Шаг 3: Когда вы закончите, нажмите «Опубликовать».
Это все, что нужно сделать за 3 простых шага!
Твори!
Есть много способов привлечь аудиторию с помощью GIF. Вы можете использовать бесплатные функции создания GIF в нашем видеоредакторе, чтобы создать анимацию GIF и улучшить свой контент. Добавьте выноски с форматированным текстом или используйте фигуры, чтобы подчеркнуть свои мысли.
Вы также можете настроить скорость всего видео или вырезать фрагменты с помощью редактора.
У вас нет идеального изображения? Используйте изображения или видео из стоковой библиотеки или комбинируйте контент с нескольких устройств. Есть так много вариантов для создания идеального GIF. Так что проявите творческий подход и используйте Screencast-O-Matic, чтобы начать!
Профессор рассказывает, как она использует видеоотзыв для связи со студентами 3 Эффекты видеоредактора, призванные удивить вашу аудиториюКак создать анимированный GIF с помощью InDesign (и in5) — Ajar Productions
единый файл, который работает во всем Интернете (хотя, в частности, не в формате PDF).
Несколько отличных вариантов использования анимированных GIF-файлов:
- Рассылки по электронной почте (которые не поддерживают сложный контент)
- Баннеры и реклама (когда HTML5 не требуется или не поддерживается)
- Изображения из социальных сетей (, например, для хроник Twitter, Facebook и Linkedin)
До сих пор лучшим способом создания анимированного GIF для креативщика был
- Открыть Adobe Animate
- Создание анимации с использованием анимации
- Экспортировать как видео
- Откройте видео в Photoshop (потому что Animate плохо справляется с цветами)
- Экспорт в формате GIF с помощью диалогового окна «Сохранить для Интернета»
С этим процессом все в порядке, если вы достаточно хорошо разбираетесь и в Animate, и в Photoshop, но даже в этом случае он немного запутан (особенно при создании анимации движения).
Недавно я открыл Adobe Animate, ранее называвшуюся Flash Professional, для создания анимированного GIF. Несмотря на то, что я много лет жил во Flash Pro, мне все же потребовалось полчаса, чтобы создать простую рекламу размером 125 x 125 пикселей.
Не поймите меня неправильно, Animate отлично подходит, если вы хотите точно контролировать свою анимацию, но иногда это излишне.
Зачем использовать InDesign?
Для сравнения, инструменты анимации InDesign чрезвычайно просты: просто примените набор настроек движения (при необходимости отрегулируйте). Нет ключевых кадров, нет временной шкалы.
Этот рабочий процесс InDesign идеально подходит, если вам просто нужны простые переходы и всплывающие окна.
Основное ограничение: раньше не было возможности экспортировать анимацию InDesign в виде анимированных GIF-файлов, но теперь она есть.
Вот краткое описание шагов.
- Создайте новый файл в InDesign. in5 v3.5.1 поставляется с удобной предустановкой документа Social Media Image .
- Добавьте предустановку движения с помощью панели «Анимация» ( «Окно» > «Интерактив» > «Анимация» ). При необходимости отрегулируйте и повторите с другими элементами.
- (Необязательно) Отрегулируйте последовательность нескольких анимаций с помощью панели «Время» ( «Окно» > «Интерактив» > «Время» ).
- Экспорт с использованием in5 (
in5 > Easy Export Wizard ). - Откройте экспортированный контент в Google Chrome и используйте расширение in5 Animated GIF Maker для записи и сохранения GIF.
Теперь вы можете поделиться файлом по электронной почте или через обновления в социальных сетях.
Ознакомьтесь с шагами в видео ниже.
Вы можете проверить это, используя бесплатную пробную версию in5.
Расширение in5 Animated GIF Maker доступно бесплатно в магазине расширений Chrome.