Программа для создания GIF-анимации Easy GIF Animator Pro (русскоязычная). Знакомимся: программа для создания анимации Easy Gif Animator Создать анимированный gif в animator

3.5K

Помните, как в школе на скучных уроках рисовали в блокнотах разные рожицы? А затем, быстро перелистывая страницы, заставляли эти рожицы анимировать. Так и со скучными сайтами, под завязку набитыми нудной, но очень нужной информацией. Вот если бы туда тоже добавить пару кривляющихся рожиц! Это вполне осуществимо, если использовать gif анимацию:

Анимация на основе GIF

Формат GIF (Graphics Interchange Format ) разрабатывался специально для внутрисетевого обмена растровыми изображениями. В недалеком прошлом он был основным форматом для изображений, размещаемых в веб-пространстве. Основные характеристики формата GIF :

• Способность сохранять изображения в 256 цветовой гамме;
• Малый вес изображения – это идеально подходило для первоначальной стадии развития всемирной паутины, когда скорость соединения с интернетом была намного ниже сегодняшних стандартов;
• Графические форматы в GIF хранятся построчно, поддерживая лишь определенную цветовую палитру (256 цветов );
• При этом один из 256 оттенков может быть помечен как прозрачный;
• Поддержка анимированных объектов.

Последний пункт списка и послужил новым толчком для роста популярности этого графического формата.

Создание gif анимации по сравнению с более современной технологией flash имеет несколько преимуществ. Главным из них является меньший вес графического объекта. Поэтому новой областью применения gif анимации стало создание рекламных объектов для интернета.

Гиф анимация позволяет создавать один графический объект, состоящий из нескольких обычных изображений (кадров ), расположенных в определенном порядке. Анимация происходит за счет их смены с заданной очередностью и периодичностью. При этом чаще всего применяют цикличное повторение кадров анимации.

Благодаря нескольким изображениям полностью снимаются ограничения на использование лишь 256 оттенков цвета. Это связано с тем, что каждый из рисунков может содержать свою палитру. Уменьшение общего веса анимированного объекта достигается также за счет использования прозрачности, когда происходит лишь частичное изменение следующего кадра относительно предыдущего.

В следующем кадре прорисовываются лишь изменяющиеся части изображения. Остальные можно установить прозрачными, и для их отображения использовать первоначальный статический кадр.

Немного практики

Но все это теория, а хотелось бы на практике рассмотреть, как происходит создание анимации в формате GIF . Мы предвидели это, и подготовили маленький мастер-класс по созданию анимированного баннера.

Для демонстрации воспользуемся специализированным графическим редактором Easy GIF Animator . Как показывает опыт, большинство подобных программ имеют схожий пользовательский интерфейс и функционал. Поэтому показанный ниже порядок действий не будет сильно отличаться от того как сделать gif анимацию в других подобных графических редакторах.

• На стартовой странице программы нам предлагается выбрать тип задачи, который нужно решить. Мы воспользуемся «услугами » встроенного мастера по созданию баннера. Для этого нажимаем на пункт «Создание анимированного баннера »:

• На следующем шаге задаем размеры будущего баннера. Можно воспользоваться стандартными значениями, но мы введем свои параметры длины и ширины объекта:

• Затем мы настроили фон баннера. В качестве стиля заполнения выбрали градиент, установили его тип и основные цвета:

• В следующем окне мастера мы вводим текст для отображения, устанавливаем его размеры, шрифт и цвет. Из выпадающего списка выбираем эффект анимации в момент появления текста и его исчезновения. А также устанавливаем время всего периода. Обратите внимание, что таким образом можно настроить эффекты для нескольких фраз (до трех ). Они располагаются на отдельных вкладках («Текст 1 », «Текст 2 »):

• До того как создать gif анимацию, осталось лишь сохранить файл баннера в нужном нам месте. Что и предлагается сделать в следующем окне:

• После закрытия мастера и сохранения баннера перед нами открывается рабочий интерфейс приложения. Обратите внимание, что слева наша анимация представлена покадрово. И каждый из кадров можно отредактировать отдельно:

Ссылка для скачивания архива с «полновесным » оригиналом будет приведена в конце статьи. А вот статическое превью того, что у нас получилось:

Как сделать анимацию из видео

С основами процесса мы немного разобрались. Теперь постараемся научиться тому, как сделать gif анимацию из видео.

Суть данной процедуры заключается в том, что для начала нужно «вытащить » из видео отдельные картинки. То есть разложить его на кадры. Конечно, можно делать это вручную с помощью сохранения нужного кадра в медиа плеере (благо, многие из них это умеют ).

Но лучше воспользоваться специальной программой для извлечения видеокадров Free Video to JPG Converter . Как можно судить из ее названия, она сохраняет кадры видео в изображения в формате JPG .

Интерфейс приложения прост для понимания. Поэтому мы не будем останавливаться на его подробном описании:

После обработки видео утилита сохранит кадры в указанном вами месте. Подгонку всех изображений для будущей анимации нужно будет осуществить вручную с помощью любого графического редактора. Лучше всего, если это будет Photoshop .

На следующем этапе мы снова переходим в Easy GIF Animator . С помощью инструмента «Вставить изображение » добавляем в качестве кадра снимок из видео. После этого нужно настроить задержку для каждого анимированного кадра. А затем сохранить полученную GIF анимацию в виде файла.

Возможности

• создание разных типов GIF-анимации из фото и видеоматериалов;
• редактирование готовых GIF-изображений;
• добавление визуальных и текстовых эффектов;
• создание анимированного движущегося текста;
• оптимизация изображений;
• функция предпросмотра в браузере;
• установка счетчиков циклов, продолжительности анимации, позиций для изображений;
• извлечение кадров;
• корректировка цветовой палитры;
• экспорт файлов в формат AVI.

Плюсы и минусы

• возможность сохранения анимации в нескольких форматах;
• множество инструментов для работы с анимацией;
• применение интересных эффектов перехода между кадрами;
• редактирование каждого кадра инструментами Paint.

• условная бесплатность (демо-версией программы можно пользоваться только в течение 20 дней);
• некачественная русификация.

Альтернативные программы

UnFREEz . Бесплатная программа для создания анимированных изображений из GIF-файлов. Позволяет склеивать несколько файлов, устанавливать цикличность воспроизведения картинки, интервал показа фреймов.

Pivot Stickfigure Animator . Бесплатное приложение, в котором можно создавать простые анимации из палочных человечков. Проекты создаются и редактируются посредством покадрового перемещения разных частей фигур. Есть возможность применять готовые или создавать собственные объекты.

Принципы работы

После установки и запуска программы отобразится ее главное окно:

Главное окно

Оно состоит из трех основных областей:

1. Строка меню для доступа к командам.
2. Панель инструментов в виде иконок часто применяемых команд.
3. Кнопки для открытия Мастера создания анимации, недавних файлов, справки.

Для начала работы нажмите кнопку «Создать новую анимацию». После этого откроется Мастер, в который нужно добавить необходимые изображения:

Продолжительность кадров

Затем определите позиционирование меньших картинок относительно наибольших:

Позиционирование

Созданную анимацию можно редактировать в специальном окне:

Редактирование анимации

С помощью инструментов в левой вертикальной панели вы сможете удалять, дублировать, добавлять новую картинку, вставлять пустой кадр, создавать анимированный текст.

Чуть правее находится панель для просмотра, удаления, вставки кадров.

Основная область окна предусмотрена для редактирования графических файлов: добавления текста, заливки, замены цвета и т. д. Показ анимации запускается во вкладке «Просмотр».

Ниже основной области расположена панель для управления свойствами анимации: установки цвета фона, повтора, задержки, прозрачности кадров и др.

Easy GIF Animator – мощная программа, позволяющая создавать анимированные GIF-файлы высокого уровня даже тем пользователям, которые не сильны в работе с графикой.

Создание анимации – легкая и интересная задача.
Большинство пользователей социальных сетей используют в своих аккаунтах не сложную анимацию. Одной движущейся картинкой можно заменить несколько слов, донести до гостей свои мысли и настроение. Часто, gif-анимация используется в аватарах – смысловое изображение хозяина страницы.

Попытка скопировать анимированное изображение не всегда заканчивается успешно, чаще всего анимация пропадает и картинка становится обыкновенным статичным фото. При сохранении таких картинок формат должен быть.gif.
Для создания такой анимации требуется знание графических программ. Освоить работу в них при большом желании не составит труда. Несколько часов у монитора, и вы будете горды своими работами.
Простейшую анимацию можно создавать в он-лайн сервисах. Более качественную, в серьезных программах с установкой на компьютер.

Рассмотрим небольшой обзор программ, которые сможет освоить начинающий gif-аниматор.

Создание gif анимации из видео

Программа преображает видео файлы в анимационные. Обладает большими возможностями. Работать не сложно, программа русскоязычная, а это на много уменьшает время изучения всех возможностей. Загружайте любое видео и начинайте творить анимацию.

Заходим на сайт и скачиваем . Устанавливаем программу на ПК. Открываем.

Программа будет на английском языке. Для смены языка нажмите «Вид» и далее как на картинке.

Загружаем видео. Нажимаем Ctrl+Shift+V -открывается проводник Windows выбираем видео.

Внизу ползунком отмечаем начало гиф -анимации. И вверху делаем отметку начала нажимая на кнопку начала (стрелочка смотрит влево).

Внизу отмечаем ползунком конец анимации. И нажимаем кнопку конца (стрелочка смотрит вправо).

Затем нажимаем вверху на кнопку извлечения gif (на кнопке синяя стрелка вниз).

Производится обработка.

Нажимаем на кнопку сохранения файла и сохраняем файл себе на компьютер. Вот что у нас получилось.

Естественно, здесь рассказано как сделать простейшую гиф анимацию. Программа позволяет встраивать различные эффекты.

Easy GIF Animator

Обладает обширным функционалом. Есть платная и бесплатная версии. Отличная техническая поддержка всегда ответит на все возникшие вопросы, а так же на сайте есть форум. Можно прочитать советы гуру по анимации и узнать ответы на свои вопросы от модераторов.

GIF Movie Gear

Программа позволит создавать маленькие картинки и баннеры разных параметров. Для владельцев блогов и сайтов: в программе можно создать фавиконку и мелкие стрелки анимации.

Создание gif анимации из фотографий

Создание анимации дело увлекательное. Обязательно используйте несколько программ, и вы найдете ту, в которой будут получаться самые привлекательные живые картинки. Практически все со временем приходят к редактору Adobe Photoshop. В последних версиях программы можно делать практически мультфильмы. В сети множество уроков, изначально программа разрабатывалась для обработки фотографий, со временем стала довольно шикарной рабочей программой дизайнеров и архитекторов.

Но мы только учимся и начнём не с монстра фотошопа, а с редактора попроще, например, бесплатного t. Совершенно не важно в каком редакторе делать кадры (картинки)

Начинаем создавать. Сначала подготовим картинки.
1. Все картинки должны иметь одинаковые параметры, размер, разрешение.
2.Все сохраняется в формате файлов gif. Именно это и обозначает анимацию.
3.Все картинки желательно пронумеровать. Можно дать название каждому слою, но с нумерацией, путаницы будет меньше. Т.е. самое простое — это дать цифровые названия файлов и в такой последовательности они и будут прокручиваться, например, 1.gif 2.gif 3/gif и т.д.

Например, так:

Все готово. Отправляем все картинки в редактор UnFREEz, он достаточно простой и новичок с легкостью справится.

Вам нравятся «гифки» и вы были бы не против их самостоятельно создавать? Можно скачать Easy Gif Animator, который поможет вам в этом, и даже если вы далеки от компьютерной графики, легко сможете сконструировать анимированное изображение и отредактировать его. Навигация по программе довольно проста - создаём новый файл («скелет» анимации), добавляем картинки, пробуем применять разные эффекты. К тому же, каждый кадр «гифки» настраивается и корректируется отдельно. Если нужно создать GIF из видео, добавляем файл видеозаписи, обрезаем и редактируем.

Основные возможности Easy Gif Animator для создания анимации

Позволяет создавать с нуля анимированные картинки, баннеры и кнопки, но и редактировать их: подгонять кадры по размеру, добавлять визуальные эффекты, движущиеся тексты, менять продолжительность «гифки», управлять фреймами, изменять прозрачность, преобразовывать анимацию в видео формата AVI и добавлять звук и т.д. Интуитивно понятный, простой интерфейс программы Easy Gif Animator поможет без проблем ею пользоваться. А раздумывать, как применить не пользованный пока инструмент, не придётся.

Как пользоваться Easy Gif Animator’ом и с чего начать работу?

Если нужно создать GIF из видео, добавляем файл видеозаписи, обрезаем и редактируем. Это - самое основное, но программа даёт ещё множество разнообразных возможностей для создания других анимаций. В конце работы можно оптимизировать размер выходного файла, увидеть, как он будет выглядеть в браузере, выбрать нужный формат сохранения (кстати, можно сохранить в GIF или флеш-формате SWF) и получить HTML-код для публикации «гифки» в интернете. Скачать Easy Gif Animator и работать в нём - одно удовольствие. Создавайте свои «гифки» и радуйтесь результатам.

Версия:	7.2
Лицензия:	условно-бесплатная
Обновление:	21-06-2018
Разработчик:	easygifanimator.net
Язык:	Мультиязычный
ОС:	Windows: All
Размер файла:	23 МБ

Я пообещала вам, что расскажу, как этот процесс можно осуществить в программе Easy Gif Animator. Выполняю обещание.

Сегодня мы рассмотрим основные принципы работы в ней, поняв которые, сможем создавать потом все что угодно под свои запросы.

На вопросе установки я не останавливаюсь. Она стандартная.
Скачать пробную или приобрести лицензионную версию можно на официальном сайте

Хотя при желании можно найти портативную и русифицированную версию, которая очень облегчит вам жизнь (у меня как раз этот вариант). Или скачать пробную версию и в течение пробного периода по полной ее эксплуатировать!

Easy Gif Animator поможет вам создать:
— анимированые баннеры,
— анимированные кнопки,
— разные виды простых и сложных анимаций.

Для работы можно использовать изображения в форматах gif, jpg, jpeg, png, iso, bmp, а на выходе получать изображения в форматах gif,avi, flash.

Программа дает возможность:
создавать «анимацию с нуля» или при помощи Мастера;
редактировать кадры в процессе работы;
редактировать созданные ранее или готовые гифки;
применять разнообразные эффекты для текста и изображений;
предварительно просматривать результат работы в вашем браузере;
изменять размер анимации, экспортировать из нее все или только отдельные кадры, а также делать прозрачными необходимые ее части;
добавлять музыку при сохранении в формате flash;
генерировать HTML код для публикации в Сети.

2- Интерфейс Easy Gif Animator.

Откройте программу. Перед вами появится окно запуска (картинка 1).

Рассмотрите внимательно, какие возможности для творчества у вас есть.

Внимательно пройдитесь по верхнему контекстному меню и просмотрите боковую панель инструментов, находящуюся слева, чтобы понимать, какими функциями вы можете воспользоваться в том или ином случае.

Я не буду подробно останавливаться на этом вопросе, потому что:
— во-первых, там все предельно ясно,
— во-вторых, для успешного творческого процесса эта самостоятельная «экскурсия» по меню просто необходима.

Если у вас английская версия, то вот небольшие пояснения (перевод) основных терминов:

пояснения

File – файл, Edit- правка, Frame – кадр, Select – выделение, Animation – анимация, Tools – инструменты, Help – помощь.
Easy Wizards – простые волшебники (если дословно), а в нашем случае так назван Мастер программы, который помогает вам как настоящий волшебник создавать легко и просто анимации!
Соответственно: New Banner Wizard – Мастер создания нового баннера, New Button Wizard – мастер создания новой кнопки.
Create New Animation – создать новую анимацию, Create Animated Banner- создать анимированый баннер, Create Animated Button — создать анимированую кнопку.

В окне редактирования и просмотра (картинки 2 и 3) слева располагается окно кадров, где вы сможете видеть все созданные кадры. По центру – окно редактирования, где вы увидите все изменения, (вы сможете при помощи кнопок 3 просмотреть уже созданную или ранее готовую работу.

Благодаря вкладке «Свойства анимации» (Animation properties) (картинка 2 (2)) вы можете:
— устанавливать ее тип: постоянный или же с определенным количеством повторов (2).
— выбирать цвет фона,
— изменять размер работы и добавлять комментарий к ней.

Поставив галочку возле функции «Не объединять палитру» (do not merge palette), вы улучшите цвета анимации, в которой каждый фрейм содержит разные изображения.

На вкладке «Свойства кадра» (Properties of the frame) (картинка 3(4)) выбирается время каждого кадра, и добавляется при необходимости комментарий к изображению. Здесь же предусмотрена возможность устанавливать прозрачность (5) выбранных участков изображения.

При нажатии на кнопку «Установить прозрачность» (To set the transparency) при помощи инструмента пипетка выделяем цвет, который мы хотим заменить прозрачным. Таким образом можно убрать, например, однотонный фон вокруг изображения.

3- Основные алгоритмы работы Easy Gif Animator.

Для того, чтобы начать процесс создания анимации, необходимо знать простейшие алгоритмы, изучив которые вы будете в дальнейшем изготовлять легко и просто анимированные картинки, баннеры или кнопки любого вида.

Я расскажу вам и покажу на примерах, как работать с фреймами: создавать их, редактировать, добавлять на них эффекты анимации, как делать анимированный текст, а также как сохранять сделанную вами анимацию в разных форматах.

3.1 Первоначальная настройка программы

Выбираем в верхнем меню закладку Инструменты (Tools) и из выпадающего меню выбираем вкладку Настройки (Opsions). И в открывшемся окне «Параметры» (картинка 4) в каждой вкладке выбираем нужные нам настройки.

Во вкладке Вид (View) я бы советовала убрать обе галочки, чтобы каждый раз не показывалось окно приветствия (Show Welcome Screen) и чтобы была возможность создавать анимацию с нуля, потому что по умолчанию установлена функция создания при помощи Мастера (Use(Anination Wizard when Czreating New Animation)). Сняв галочки, не забудьте нажать на ОК, чтобы сохранить эту настройку.

Во вкладке Анимация (Animation) вы сможете выбрать основной тип анимации: постоянный (Повтор всегда- repead forever) либо периодический. Выбираем – повтор всегда.

Вкладку Экспорт (Export) я оставила без изменений, потому что если честно, не поняла, для чего режимы полутонов и как между ними выбирать. Если вы знаете, поделитесь со всеми в комментариях, пожалуйста!

Во вкладке Инструменты (Tools) надо указать путь к запуску программы, которую вы хотите использовать по умолчанию для редактирования кадров вашей анимации.
Я не указывала путь, и в результате при редактировании фрейма у меня открывается стандартная программа для рисования Paint.

Первоначальные настройки всегда можно изменить в процессе работы в поле «Свойства анимации» и «Свойства кадра» (см картинки 2(2) и 3(4)).

3.2 Работа с кадрами в программе

А) Создание фрейма (кадра) .
Для того чтобы создать новый кадр, надо нажать на кнопку 6 или кнопку 7 (картинка 5).

В первом случае вы сможете создать фрейм из изображения, которое выберете на своем компьютере.Можно одновременно загрузить несколько изображений, удерживая клавишу Shift. При этом каждое из них создастся в виде отдельного фрейма.

Во втором случае – отроется пустой кадр, в котором вы сможете потом нарисовать все что угодно, используя функцию редактирования и установленную по умолчанию программу редактирования или рисования! Этот вариант подходит как для создания простейших кнопок и баннеров с нуля, так и для создания индивидуальных авторских работ.
И хотя я лично не пользуюсь этой функцией, потому что создавать картинки и коллажи привыкла в фотошопе, но вам она, возможно, может и пригодиться!

Изначально вам будет предложено выбрать размер изображения и цвет фона.Выбираете эти параметры и нажимает кнопку ОК.
Можно таким образом создавать любое количество разных кадров.

Все кадры, которые вы создадите, будут показаны слева в поле окна кадров. Их можно потом при помощи инструментов 8 (стрелочек) перемещать вверх и вниз, менять местами.

Б) Редактирование и просмотр.
Вначале выделяем нужный кадр в поле окна кадров анимации. Затем для редактирования можно воспользоваться Панелью Инструментов 9 или нажав на кнопку 10 (изменить кадр — change frame), перейти в редактирование в выбранной вами программе.

Любой фрейм можно удалить, выделив его и нажав на кнопку 11 (картинка 5).

Кроме того в процессе редактирования вы можете во вкладке «Свойства кадра» выставить длительность кадра, дописать комментарий к нему, а также воспользоваться кнопкой «Установить прозрачность» (картинка 5).

Для изменения размера кадра воспользуйтесь вкладкой «Свойства анимации» , выбрав кнопку «Изменить размер» .

Для редактирования загруженных изображений и текста в программе предусмотрен Инструмент «Выделение» (основное верхнее меню).
С его помощью можно:
Сделать любое цветное изображение черно-белым (пункт «Оттенки серого»);
Инвертировать изображение (пункт «Инвертировать»);
Отразить по горизонтали и вертикали.
Добавить тень.

Кроме того, как и в любом ином редакторе, кадры можно копировать, вырезать, вставлять, пользуясь вкладкой верхнего меню «Правка» .

В поле окна «Просмотр» вы сможете увидеть отредактированный фрейм.

В) Добавляем текст.
Для того чтобы добавить текст на кадр, необходимо нажать на кнопочку 12 (картинка 5) и в появившемся окне, напечатать нужный текст, предварительно выбрав его параметры (шрифт, размер, цвет, оформление).

Г) Экспорт кадров
В любой момент создания анимации вы можете любой ее кадр или группу кадров сохранить к себе на компьютер в виде отдельных изображения в формате gif.

Для этого надо выбрать нужные файлы, щелкнув по ним левой кнопкой мыши (если кадров много, то при выделении удерживайте клавишу Shift на клавиатуре) и далее выбрать в меню «Кадр» / «Экспорт выделенных кадров» .

3.3 Сохранение анимации.

И сохраняйте вашу работу в avi или flash.

Вот, пожалуй, обо всех главных алгоритмах. Как отправить картинку по почте, как просмотреть ее в браузере, как получить html- код и т.д., уверена, вы разберетесь сами!

3.4 Создание эффектов анимации

А) Для изображений.

Чтобы создать эффект анимации для любого загруженного вами изображения необходимо:
1. Выделить нужный кадр, щелкнув по нему левой кнопкой мышки(картинка 8).
2. Нажать кнопочку 13 (создать эффект для изображения — create the effect to the image).
3. Откроется окно «Создать эффект перехода» (картинка 9), в котором мы выбираем необходимый нам эффект.
Для каждого эффекта Программа предлагает установить свои параметры.
Чтобы сразу же увидеть, что у нас получается при выборе того иного эффекта и его параметров, поставим галочку в левом нижнем углу возле «Показать» (картинка 9).
4. Когда вас в созданном эффекте все устраивает, нажимаем ОК и переходим в окно просмотра (картинка 10).
5. Сохраняем анимацию.

Вот посмотрите, что получилось у меня. В первом случае я использовала эффект «Увеличение», а во втором – к нему добавлен еще эффект «Вращение».

Б) Создание текстовых эффектов анимации.

Для создания текстовых эффектов действуем следующим образом:
1. Создается новый кадр (пустой или изображение). Для примера возьму в качестве кадра изображение. См картинку 11.
2. Нажимаем на кнопочку 14 «Создать анимированный текст» — «Create animated text».
3. В открывшемся окне «Создать текстовой эффект» / «Create text effect» вводим текст и выставляем нужные вам параметры для анимации (картинка 12). Экспериментируйте, установив галочку возле надписи «Показать» , и вы будете видеть, что у вас получается в каждом конкретном случае.
4. Если текст нужно передвинуть, нажмите на кнопочку «Изменить позицию текста» / «To change position text» и в открывшемся диалоговом окне с помощью стрелок передвиньте его в нужное вам место. Я передвинула, как видите, «Привет» из центра вниз (картинка 13)
5. Если вас все устраивает, смело нажимайте ОК, и сохраняйте свой шедевр!

Вот что у меня получилось.

Поэкспериментируйте, создавая простейшие анимации, постепенно переходя к более сложным!

А я с вами на сегодня прощаюсь.

Все, о чем я рассказала вам в этом уроке, в основном касается создания анимации «с нуля», хотя эти знания, уверена, пригодятся вам и при работе с Мастером программы, если вы захотите усовершенствовать или изменить то, что этот самый Мастер поможет вам создать!

В следующий раз мы продолжим разговор о Easy Gif Animator и на конкретных примерах рассмотрим непосредственно сам процесс создания анимированных изображений, баннеров и кнопок с помощью Мастера, в которых применим и все знания, приобретенные в этом уроке.