Файлы в формате GIF повсюду. Некогда скромные анимированные изображения теперь являются неофициальным языком интернета. GIF анимация — это самый быстрый способ выразить эмоции в Twitter, а ещё мы можем тратить часы на её просмотр пролистывая ленту новостей в VK, Facebook или Одноклассниках.
Существует достаточно большое количество сайтов, на которых можно найти уже готовые гифки на самые различные тематики. Но ничто не сравнится с GIF анимацией, которая сделана своими собственными руками. Думаете, что это сложный процесс? Вы ошибаетесь, это довольно просто. Быстро создать GIF анимацию можно в графическом редакторе Photoshop, конвертируя уже существующее видео, либо используя серию статических изображений. Давайте рассмотрим подробнее, как это делается.
Примечание: Во всех примерах из этой статьи я использую Photoshop CC 2017.
Как создать GIF анимацию из видео
Для начала необходимо запустить Photoshop, перейти в «Файл» > «Импортировать» > «Кадры видео в слои» и выбрать необходимую видеозапись.
В открывшемся диалоговом окне можно будет выполнить импорт всей видеозаписи, либо выбрать только её определённую часть. Если вы выберете второй вариант, перетащите ручки под окном предварительного просмотра, чтобы установить начальную и конечную точки. Часть видеозаписи, находящаяся между этими ручками, будет импортирована.
Примечание: Имейте в виду, что чем больше видео, которое вы импортируете, тем больше будет ваш GIF. Также, если вы импортируете слишком длинную видеозапись, выбор «Оставить каждый 2 Кадры» (или больше) — это простой способ уменьшить размер, не слишком сильно влияя на качество.
Убедитесь, что установлена галочка в окошке «Создать покадровую анимацию», затем нажмите «OK». Начнется процесс импортирования видеозаписи. Это может занять некоторое время, в зависимости от размера клипа. После завершения импорта откроется рабочая область, в которой каждый кадр видеозаписи будет размещен на собственном слое.
В нижней части экрана находится палитра шкала времени. Она показывает все кадры, из которых будет состоять ваша GIF анимация.
Вы можете добавлять и удалять кадры по своему усмотрению, или редактировать любой из существующих слоев так же, как редактируете слои на любом другом изображении. Для предварительного просмотра вашей GIF-анимации просто нажмите кнопку «Воспроизвести» внизу шкалы времени.
В итоге должно получиться что-то вроде этого:
Создание GIF анимации из серии статических изображений
Если у вас нет видеозаписи для использования её в качестве основы для вашей GIF анимации, вы сможете создать её вручную из серии статических изображений. Это немного сложнее, особенно если вы хотите сделать что-то крутое, но основной процесс прост.
Вы создаёте свой GIF из одного файла изображения, содержащего несколько слоев. Каждый слой – это отдельный кадр вашей будущей анимации. Существует два способа начать работу:
- Если вы уже создали изображения для своей анимации, импортируйте их, выбрав «Файл» > «Сценарии» > «Загрузить файлы в стек…». Нажмите «Обзор» и выберите свои изображения, затем нажмите «ОК». Каждое изображение будет помещено на отдельный слой внутри одного и того же файла.
- Если вы еще не создали изображения, сделайте это сейчас. Помните, что каждое отдельное изображение — это часть будущей анимации.
Теперь вы готовы начать создавать анимацию.
Анимирование статических изображений
Вот как это работает. Когда вы вручную создаете кадр анимации, в него включается каждый видимый слой. Слои, которые отключены, не будут участвовать в создаваемом кадре.
Для создания первого кадра сделайте самый первый слой видимым, а все остальные отключите. Затем, создавая второй кадр, сделайте второй слой видимым, а затем третий слой в третьем кадре и так далее. Когда вы начнете, всё станет понятнее.
Для начала создания анимации откройте шкалу времени, если она у вас не открылась автоматически. Для этого в верхней панели нажмите «Окно» и в открывшемся меню выберите «Шкала времени». В центре раскрывшейся панели нажмите «Создать анимацию кадра». Это действие приведёт к созданию первого кадра вашей анимации. В палитре «Слои» скройте слои, которые не должны быть частью кадра.
Теперь нажмите кнопку «Новый кадр», которая будет дублировать предыдущий кадр. Еще раз скройте лишние слои, а те, которые должны участвовать в кадре, сделайте видимыми.
Повторяйте этот процесс, пока не добавите все необходимые для анимации кадры.
Завершение
В завершение, установите время отображения каждого кадра. Выделите первый кадр, а затем щелкните по последнему с зажатой кнопкой «Shift», для того чтобы выделить их все. Теперь щелкните стрелку вниз под одним из кадров и выберите задержку. Отсутствие задержки означает, что анимация будет работать быстро, в то время как установленное количество секунд заставит кадры оставаться на экране в течение заданного периода времени.
Наконец, установите параметры цикла, которые вы найдете в нижней части панели «Шкала времени». Этот параметр отвечает за то, сколько раз будет воспроизводиться ваша анимация. В большинстве случаев вы будете выбирать вариант «Всегда».
Теперь нажмите кнопку «Воспроизвести» в нижней части экрана, чтобы просмотреть получившуюся анимацию. Вы должны увидеть что-то вроде этого:
Вы можете редактировать кадры, просто выбирая их и меняя видимость слоёв (вы также можете изменить непрозрачность или сделать другие более сложные настройки). Добавьте дополнительные слои, если они вам нужны, или нажмите значок корзины, чтобы удалить их.
Когда вы будете довольны получившимся результатом, можете переходить к разделу «Сохранение анимации», либо читайте дальше, чтобы улучшить получившуюся анимацию.
Усовершенствование анимации путём добавления промежуточных кадров
Photoshop поддерживает мощную анимационную функцию создания промежуточных кадров. Это позволяет создавать более плавные анимации, автоматически генерируя переходные кадры между двумя существующими кадрами. В этом примере я собираюсь обойти все кадры, чтобы придать звездному небу эффект мерцания.
Для начала выберите первый кадр и нажмите кнопку «Создание промежуточных кадров» панели инструментов в нижней части шкалы времени.
В открывшемся диалоговом окне установите пункт «Промежуточные кадры» в значение «Следующий кадр», а для пункта «Добавить кадров» укажите значение по своему усмотрению. Более высокое значение означает более плавный, но медленный переход. Нажмите «OK», чтобы создать промежуточные кадры.
Теперь повторите этот процесс для других исходных кадров, которые вы добавили. Когда доберётесь до последнего, установите «Промежуточные кадры» в значение «Первый кадр». Это поможет создать плавный переход к началу цикла вашей анимации.
Нажмите кнопку воспроизведения, чтобы просмотреть эффект.
Сохранение анимации
Когда вы закончите, сначала сохраните файл в формате «.PSD». Это сохранит всю информацию о слоях и анимации для того, чтобы вы смогли позже отредактировать вашу анимацию, если потребуется. После этого можно переходить непосредственно к сохранению.
Для сохранения созданной анимации перейдите в «Файл» > «Экспортировать» > «Сохранить для Web (старая версия)…». В открывшемся окне выберите формат GIF, а в поле «Цвета» укажите 256. Для того, чтобы уменьшить общий размер файла, уменьшите размер в поле «Размер изображения».
Вы cможете увидеть, размер анимации в левом нижнем углу окна предварительного просмотра. Если он слишком большой, перетащите ползунок «Потери» вправо. Это повлияет на качество, но значительно уменьшит размер файла.
3. Ищем свою папку с подготовленными фото и кликаем левой кнопкой мыши на первую фотографию, зажимаем клавишу Shift, и кликаем по последней, тогда они выделяются все. Жмем ОТКРЫТЬ.
4. В вашем фотошопе открываются все фотографии. Начинаем создавать слои, которые нам понадобятся для анимации или создания gif картинки . Я открыла специально широкую фотографию. И она будет 1-ым слоем.
Чтобы преобразовать фото в слой, кликаем по нему два раза левой кнопкой мыши.
5. Чтобы создать второй слой, нам нужно кликнуть по иконке, на которую показывает стрелка. На втором слое мы будем располагать другую фотографию.
6. Топаем в наши фотографии, которые открыты рядом с первой, и выбираем узкую фотографию. Напоминаю, что это необязательно… С одинаковыми фотографиями легче работать. Итак, находим нужную фотографию, идем в меню — выделение — выделить ВСЕ.
7. После этого вокруг картинки начнут бегать маленькие тире, это и есть выделение. Теперь идем в меню — редактирование — скопировать.
8. Возвращаемся к нашей первой фотографии, которая уже со слоями, идем в меню — редактирование — вставить. И наша узенькая фотка вставляется на новый слой. Но она не может оставаться такой узкой. Нам нужно добавить фон под нее. Для этого кликаем по иконке (1), перетаскиваем слой под узкое фото, затем пипеткой (2) подбираем любой понравившийся вам цвет, кликнув курсором по фото. Я выбрала светло-зеленый. И заливаем новый слой, для чего мы активизируем инструмент заливка (3) и потом кликаем левой кнопкой мыши по рабочему полю фотографии. Обратите внимание, что в этот момент активным должен быть новый прозрачный фон. Активные слои выделяются синим цветом. После ваших действий прозрачный слой окрасится.
9. Теперь нам надо объединить два слоя (узкую фотографию и фон). Наступаем левой кнопко мыши на первый слой. Зажимаем клавишу Shift и кликаем по второму слою. Они выделились синим цветом. Идем в меню — слои — объединить слои.
10. Получаем такую картинку.
11. Повторяем пункты 6 — 10 моего урока, чтобы создать слой с еще одной узкой фотографией. Он у меня слой 2. И создаем еще один новый прозрачный слой для размещения там последней широкой фотографии (слой 3).
12. Для этого выполняем пункты урока 6, 7, 8. Все. Готово. Слои для нашей gif картинки мы создали.
13. Можно начинать анимирование и с вашими слоями, но я решила создать подложку под нашу картинку. Для этого топаем в меню — изображение — размер холста. Увеличиваем наш холст на 50 пк по ширине и высоте. Жмем ОК.
14. У нас получилось вот так.
15. Создаем новый слой (у меня слой 4), перетаскивам его в самый низ под все фотографии, вы можете сделать подложку того же цвета, что и фон в ваших узких фотографиях. Я выбрала цвет подложки немного темнее.
Оформляете вашу подложку любым способом. Надеюсь, что вы знаете, как выставляются параметры слоя, но если нет, то это просто. Наступаете на нужный слой и кликаете по нему дважды левой кнопкой мыши и у вас открывается окно с параметрами вашего слоя, а там отдельно открываете каждый отдельный параметр и вы применяете или изменяете его настройки. Я применила эффект в параметрах слоя Внутренняя тень и Внутреннее свечение с параметром слоя Умножение… Цвет тени немного темнее тона подложки. Но здесь я не берусь навязывать вам мое мнение. У вас есть свое видение. Пробуйте, меняйте настройки. Это не страшно. Всегда можно вернуться к первоначальному результату, для чего идете в меню — редактирование — вернуться назад.
Кстати, на моей последней фотографии куст глицинии, ее много во Франции и время ее цветения конец апреля — начало мая. Этот куст я сфотографировала в саду у родителей моего друга. В моем болгарском дворе тоже есть кусты глицинии и думаю, что скоро она порадует нас своими цветами, похожими на сиреневые облака.
16. Настало время поставить свой логотип, особенно это важно, если ваша картинка будет располагаться на вашем сайте. Для обычных пользователей это можно не применять. Напомню, что я делала урок фотошопа о . Пробегусь вкратце: идем в меню — файл — поместить. Ищем свой файл PSD с подготовленным заранее логотипом, наступаем на него и кликаем по кнопке Поместить.
17. Перетаскиваем слой с логотипом на самый верх, как у меня. При необходимости увеличиваем логотип до нужного размера, для чего идем в меню — редактирование — масштабирование. С зажатой клавишей Shift растягиваем или уменьшаем логотип. Активируем инструмент «перемещение» (самый верхний инструмент со стрелкой и + в панели инструментов) и перемещаем логотип на нужное место.
Все подготовлено с созданию анимации.
17. В самом первом кадре анимации у вас должна быть открыта видимость со слоем подложки, первый слой с вашей фотографией (в моем случае слой 0) и логотип (позиция 1). Для хорошего просмотра вашей фотографии устанавливаем время задержки 5 сек (позиция 2). После определения времени задержки и установки его в первом кадре, все последующие кадры будут с заданным временем 1 кадра, т.е. 5 сек в моем случае. Для создания второго кадра жмем на иконку, показанную на позиции 3.
18. Во втором кадре меняем видимость слоя с первой картинки на вторую, так же, как показано на моем скрине.
Формат GIF – это растровая технология, которая состоит из чередующихся изображений или видео. Существует и единое изображение, сохраняющее высокое разрешение и максимально сжатый размер. Формат создан в 1987 году и имел некоторые модификации. Правда, не об этом будем говорить, а о том, как сделать гифку.
В область истории создания погружаться мы не будем, так как цель статьи показать пользователям о создании GIF-анимации с помощью различных способов.
Надеюсь, вы в курсе, что сделать гифку можно онлайн, а также с помощью программного обеспечения. Я постараюсь охватить максимальное количество средств, позволяющих это сделать. Поехали!
Для начала разберём онлайн сервисы. Представляю вашему вниманию ToolsOn – популярный ресурс по созданию GIF-анимации. Присутствуют и другие функции, к примеру, создание коллажей, иконок формата ICO, создание логотипа и конвертер рингтонов.
Чтобы создать гифку онлайн необходимо перейти в раздел . Нам предлагают загрузить пару изображений. Вы можете как выбрать файлы с компьютера с помощью соответствующей кнопки «Выберите файлы» или просто их перетащить.
Следующий шаг. Даём название, интервал, в течении которого изображения будут меняться, в других полях вводим высоту и ширину гифки.
В прочих параметрах вы можете выбрать повторяться ли анимации, а также накладывать эффекты или нет.
После завершение настроек гифки нужно нажать кнопку «Создать» и немного подождать. Скачиваем получившуюся анимацию на компьютер и использует в своих целях.
Здесь вы можете создать гифку при нажатии на кнопку «Create Animation» . Выбираете изображения с компьютера или сразу с камеры.
Справа появится выбор скорости изменения анимации в миллисекундах.
Также есть возможность скачать приложения для Android, iOS и Windows.
Если еще изучить сайт, то на главной странице вы можете увидеть гифки других людей. Конечно, при просмотре выясняется, что правил размещения вообще никаких, можно выкладывать, что хотите.
Google заслуживает доверия, у него множество продуктов, которые имеют много положительных отзывов и не зря. Сервис Google Фото не только позволяет хранить изображения в облаке, которые в итоге будут доступны с любого устройства, но и создавать гиф анимацию.
Чтобы сделать гифку онлайн в данном сервисе вам нужно выделить необходимое количество изображений. Потом нажать на плюсик вверху справа, выбрав там пункт «Анимация» . Создатся она автоматически и очень быстро.
Выделяем гифку и скачиваем. Причем загрузится архив, в котором присутствует сама анимация и все использованные изображения.
Наконец-то мы переходим к вопросу о гиф анимации, созданной из видео. Здесь тоже все очень просто, мы рассмотрим несколько полезных сервисов, погнали!
Сервис GIF Maker
Англоязычный, но очень крутой и функциональный сервис по созданию гифок из видеороликов. На главной странице находится большое поле с кнопкой «Browse» , на которую мы нажимаем и выбираем видео.
Когда оно загрузится появятся функциональные параметры. Например, «Start Time» означает, с какого момента начинать анимацию.
Ползунок ниже означает конец анимации, выбираете, как хотите.
Еще вы можете на гифку добавить текст, для этого есть поле «Caption»
. После ввода текста появляются функции форматирования. Можно менять цвет, и размер шрифта.
После настройки параметров нажмите «Create GIF» и ждём окончания процесса. Если видео по размеру было большое, то придётся долго ждать.
Какие недостатки в этом сервисе можно наблюдать?
- Создание только одной надписи на гифке.
- Нельзя выбрать размер анимации.
Создание гифок из видео с помощью Imgflip
Очередной. Доступно для Windows и OSX.
Что эта программа умеет? Она записывает видео с определённой области на экране и сохраняет его в формате GIF. Кто занимается компьютерной деятельностью и даёт какие-то советы может использовать этот способ.
Gifcam
Делает тоже самое, что и предыдущая программа. Плюс ПО только в более новом интерфейсе. Короче выбирать вам. Скачать можно .
Пока что это все варианты того, как сделать гифку . Методов на самом деле очень много, пока что я остановлюсь именно на указанных. Еще можно делать гифки в фотошопе, им я довольно часто пользуюсь и уже делал гиф-анимацию. Скорее всего напишу отдельную статью, . Материал буду, естественно пополнять, а если у вас есть собственные предложения, то напишите о них в комментариях.
Инструкция
На самом деле сделать gif-изображение довольно просто, если воспользоваться GIF Animator. В качестве анимации вы можете выбрать серию фотографий природы, несколько , кадры из любимого и т.д. Перед началом работы с Ulead GIF Animator необходимо подготовить кадры будущего gif-изображения: их можно создать из мультфильма, сохраняя в отдельную папку.
После запуска программы нажмите меню File и выберите пункт Open Image для открытия первого изображения, которое будут задействовано в gif-анимации. В открывшемся окне укажите путь до папки со скриншотами и название файла (первой ). В нижней части программы появится первый кадр.
Затем нажмите меню File и выберите Add Image, чтобы добавить второе изображение. Оно отобразится в нижней части программы под цифрой 2. Если ваши картинки в папке уже или располагаются в правильной последовательности можно загрузить сразу . Таким образом, все выбранные вами картинки окажутся в полосе кадров (в нижней части).
Казалось бы, что вы сделали минимум действий, но gif- уже готова, чтобы просмотреть ее, нажмите на значок воспроизведения. Просмотрев все кадры анимации можно увеличить или уменьшить скорость просмотра. Нажмите правой кнопкой мыши на одном или нескольких (зажав клавишу Shift) и выберите пункт Frame Properties. В открывшемся окне измените длительность задержки (Delay), пробуйте разные значения, чтобы получить оптимальный вариант.
В программе Ulead GIF Animator есть возможность применять различные видеофильтры для создаваемой анимации. Для наложения эффекта на любой кадр необходимо выделить его и нажав меню Video F/X выбрать желаемый .
После всех произведенных изменений необходимо сохранить получившуюся , нажав меню File и выбрав пункт Save As. В данной программе можно сохранить анимацию в одном из трех форматов: Gif, Psd или Avi.
Видео по теме
Изменение размера изображения – одна из самых распространенных задач при работе с графикой. И хорошо, если нужно уменьшить статичное изображение. А если анимированный gif? Его без потери анимации в обычный фото редактор не загонишь. Впрочем, для того, чтобы уменьшить размер файла в формате gif, можно воспользоваться программами, которые работают с анимированными изображениями.
Вам понадобится
- - Программа ImageReady;
- - Утилита GIF Resizer
Инструкция
Загрузите файл gif, размер которого собираетесь уменьшать, в программе ImageReady при помощи команды Open («Открыть»), которую можно обнаружить в меню File («Файл»).
Обрежьте ненужную часть изображения инструментом Crop Tool, оставив прямоугольник, соответствующий пропорциям будущей аватарки. Для применения обрезки нажмите на клавишу Enter.
Измените размер многослойного документа до размера картинки пользователя, разрешенной правилами того ресурса, где вы собираетесь ее использовать. Это можно сделать командой Image Size из меню Image. Вставьте нужные значения в поля для ширины и высоты изображения и кликните по кнопке ОК.
Отключите все слои в созданном документе кроме самого нижнего. Для этого в палитре слоев щелкните по пиктограмме в виде глаза слева от каждого слоя.
Откройте палитру анимации. Это можно сделать командой Animation меню Window. Содержимое видимого слоя уже отображено в этой палитре в качестве первого кадра анимации. Создайте второй кадр кнопкой Duplicate Selected Frames, находящейся в нижней части палитры анимации. Включите второй снизу слой в палитре слоев. После этого изображение во втором кадре анимации будет соответствовать содержимому включенного слоя.
Создайте столько кадров анимации, сколько слоев содержится в вашем документе. Установите продолжительность кадров. Для этого выделите все содержимое палитры анимации и выставите нужное время, кликнув по кнопке Sets frame delay time. Это треугольник, который можно заметить в нижней части каждого кадра.
Запустите воспроизведение анимации при помощи кнопки Play. Отредактируйте результат, удалив ненужные кадры. Для этого кликните по кадру и нажмите на значок корзины в нижней части палитры.
Видео по теме
Источники:
- Создание анимации в Photoshop в 2019
- как нарисовать анимированный gif аватар в 2019
Frame per second (FPS) представляет собой количество кадров в секунду, т.е. частоту обновления игровой картинки на мониторе. От этого значения зависит эффективность вашей игры в Counter Strike. Поэтому нужно не только хорошо играть, но и знать, как правильно настроить свой компьютер, чтобы одержать победу.
Инструкция
Обратите внимание, что оптимальное значение параметра FPS для Counter Strike – 101. От этого параметра зависит точность вашего попадания по цели, которая движется. К примеру, если у вас значение 60, то ваша картинка на мониторе будет отличаться от реальности, т.е. вы видите игрока в одном месте, а реальное его местонахождение – немного правее или левее, потому как он находится в движении.
Пропишите в консоли две команды, для того чтобы просмотреть фпс: fps_max 101, а также cl_showfps 1. Теперь посмотрите на левый верхний угол, в нем появятся цифры. Если значение 99, тогда вам изменять Fps не нужно. Если же у вас 60 фпс, это может быть вызвано ограничениями, установленными видеокартой для CS 1.6.
Выполните увеличение fps, для этого скачайте и установите последние драйвера для видеокарты. Далее перейдите в свойства экрана и в настройках видеокарты отключите вертикальную синхронизацию. Щелкните «Применить».
Перейдите в главное меню, выберите опцию «Выполнить», введите команду Regedit, затем найдите ветку HKEY_LOCAL_MACHINE/SOFTWARE и откройте ветку, соответствующую вашей видеокарте, например, /NVIDIA Corporation/Global/NVTweak. Создайте ключ, присвойте ему имя NvCplDisableRefreshRatePage, установите для него значение 0.
Вызовите свойства рабочего стола, перейдите в настройки видеокарты, найдите пункт Refresh Rate Overrides. Установите флажок в пункте Override refresh rates, напротив нужного разрешения, которое используется в КС, установите частоту 100 Гц. Обратите внимание, что данный параметр должен соответствовать типу монитора.
Пропишите значение фпс в самой игре. Для этого щелкните правой кнопкой мыши по исполняемому файлу игры, выберите пункт «Свойства». Затем щелкните по кнопке «Установить параметры запуска». Пропишите здесь следующее: -freq 75 или 100 (зависит от параметров вашего монитора).
Чтобы воспользоваться изображением-анимацией в своих целях, например, для последующего редактирования, его необходимо скопировать с интернет-страницы. При сохранении и редактировании gif-файлов следует придерживаться некоторых правил.
Вам понадобится
- - программа Gimp.
Инструкция
Для сохранения файла-анимации на жесткий диск с интернет-страницы необходимо запустить браузер, открыть новую вкладку, перейти по нужному адресу и произвести копирование. Как правило, это можно сделать через контекстное меню, используя команды «Сохранить изображение как...».
Существует несколько способов коммуникации, способных очень точно передать ваше настроение, состояние и даже внутренний монолог. Одним из таких способов является GIF-анимация.
Посредством мемов, рекламных сообщений и социальных сетей GIF-анимация проникает в наше повседневное личное и профессиональное общение. И, согласитесь, было бы большой ошибкой не попытаться извлечь из этого пользу. К тому же создание GIF-анимации займет у вас считанные секунды — и это не шутка.
Facebook, iPhone сообщения, Android-платформы — все они имеют клавиатуру со встроенным набором анимированных изображений. Осмелимся сказать, что GIF-анимация — это новые (emoji).
Если вы испытываете трудности с поиском идеальных «гифок» или у вас появилась блестящая идея новой GIF-анимации, то предлагаем вам ознакомиться с этой статьей, где вы узнаете, как легко и быстро создать GIF-анимацию. При этом вам абсолютно не понадобится знание Photoshop.
Создание гифки, которую вы видите ниже, заняло всего 75 секунд:
Создание анимированного GIF-изображения
1. Зарегистрируйтесь в Canva
Если вы никогда раньше не использовали сервис Canva — то сейчас самое время исправить это. Canva — это фантастический бесплатный онлайн-инструмент с обширной библиотекой стоковых изображений, шрифтов и графики. Благодаря ему любой человек может сойти за гения графического дизайна.
2. Выберите изображения
Вы можете использовать собственные изображения, либо выбрать готовые решения, которых на Canva огромное количество. Проверьте их библиотеку, и, возможно, вы найдете то, что идеально вам подойдет.
Также бесплатную графику вы можете найти на таких ресурсах как Vecteezy.com, HubSpot (если вы являетесь их клиентом) и Creative Market.
За основу было взято следующее изображение из библиотеки Canva:
3. Создайте слои
Анимированные GIF-изображения выглядят «анимированными» за счет того, что они объединяют несколько статичных изображений/слоев в циклы. Вам необходимо создать каждый из этих слоев.
Чтобы создать гифку как в примере с текстом в качестве анимированной части, вам необходимо:
- Убрать с исходной картинки все надписи и оставить только фон, границы, и т.д.
- Добавить первую строку текста: «Только представьте!» (Guess what!)
- Скачать полученное изображение.
После этого:
- Больше ничего не трогайте. Это важно! Если передвинуть элементы или текст между слоями, у вас не получится плавной анимации.
- Добавьте вторую строку текста: «Я создал этот GIF» (I made this GIF).
- Скачайте полученное изображение (теперь у вас их два).
Повторите эти шаги еще раз с последней строкой текста «За 75 секунд» (In 75 seconds) и снова скачайте полученное изображение.
В итоге у вас получилось три слоя для вашего будущего GIF-изображения. Вы можете добавить столько слоев, сколько захотите, но важно помнить о следующем:
- Вы рассказываете историю.
- Обеспечьте соответствие элементов между слоями.
- Когда это возможно, используйте готовую графику.
- Canva позволяет вам загружать свои собственные изображения.
4. Создайте анимированное GIF-изображение
Для создания анимированного GIF-изображения рекомендуем вам воспользоваться сервисом GIPHY.
GIPHY — это одна из крупнейших библиотек анимированных GIF-файлов, которой пользуется даже Apple.
С помощью этого инструмента вы можете создать видео или анимированное GIF-изображение и сохранить его на своем компьютере в любом из предложенных форматов.
Вот как им пользоваться:
1. Перейдите на сайт GIPHY и нажмите кнопку «Create» («Создать»).
2. Для создания анимированного GIF-изображения перейдите на вкладку Slideshow:
3. Загрузите ваши слои.
4. Организуйте слои в том порядке, в котором вы хотите, чтобы они появлялись:
7. Поздравляем! Вы только что создали анимированное GIF-изображение за считанные секунды.
Создание GIF-анимации из видео
В GIPHY вы можете создать GIF-анимацию не только из изображений, но также из видеофайлов. Вот как это можно сделать:
1. Загрузите видеофайл
2. Выберите нужный фрагмент видео
3. Сохраните полученный файл
Дополнительные возможности
GIPHY позволяет сделать вашу GIF-анимацию еще привлекательнее за счет добавления различных фильтров, стикеров и текста.
Для этого перейдите на вкладку GIF Editor и вставьте в поле ввода ссылку на ваш GIF-файл.
Выберите наиболее подходящий фильтр, стикер и добавьте надпись к своей новой GIF-анимации.
GIF-анимация — это интересный и мощный способ самовыражения, который можно с успехом применять в маркетинге. И как вы могли убедиться, создавать ее действительно очень просто!
