Создание анимированного GIF с помощью GIMP

GIMP — чрезвычайно мощное программное обеспечение, учитывая, что оно бесплатное. Веб-дизайнеры, в частности, могут быть благодарны за его способность создавать простые анимированные GIF-файлы.
Анимированные GIF-файлы — это простые анимации, которые вы увидите на многих веб-страницах, и, хотя они намного менее сложны, чем Flash-анимации, их очень просто создать любой, кто имеет базовое представление о GIMP.
Следующие шаги показывают простую анимацию размером с веб-баннер с использованием пары базовой графики, текста и логотипа.

Инструкции в этой статье относятся к GIMP версии 2.10.12.

Откройте новый документ. В этом примере мы выбрали предустановленный шаблон Большой мобильный веб-баннер 320×100.

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

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

Однако изменение имени слоя в Слои палитра нужна. Щелкните правой кнопкой мыши проверка данных
слой в палитре и выберите Изменить атрибуты слоя.
в Изменить атрибуты слоя в открывшемся диалоговом окне добавьте (250ms) до конца имени слоя. Устанавливает время, в течение которого этот кадр будет отображаться в анимации. Мс означает миллисекунды, а каждая миллисекунда составляет тысячную долю секунды. Этот первый кадр будет отображаться четверть секунды.
Установите второй кадр. В учебном пособии для этого кадра используется изображение посадочного места. Идти к Отправьте > Открыть как слои и выберите графический файл. Это помещает посадочное место на новый слой, который можно расположить по мере необходимости с помощью Переместить инструмент.
Как и фоновый слой, этот новый слой необходимо переименовать, чтобы задать время отображения кадра. В данном случае 750 мс.

в Слои палитре, в окне предварительного просмотра нового слоя вокруг изображения отображается черный фон, но на самом деле эта область прозрачна.
Установите кадры три, четыре и пять. Следующие три кадра — это еще следы, которые будут проходить по баннеру. Они вставляются так же, как и второй кадр, используя ту же графику и другую графику для другой ноги. Как и раньше, время установлено как 750 мс для каждого кадра.

Каждому слою посадочного места нужен белый фон, чтобы всегда был виден только один кадр — в настоящее время каждый имеет прозрачный фон. Мы можем сделать это, создав новый слой непосредственно под слоем посадочного места, заполнив новый слой белым цветом, а затем щелкнув правой кнопкой мыши слой посадочного места и нажав Слить.
Установить шестой кадр. Этот кадр представляет собой просто пустой кадр, залитый белым, что создаст впечатление исчезновения последнего посадочного места перед появлением последнего кадра. Мы назвали этот слой Interval и выбрали отображение всего 250 мсек.

Называть слои необязательно, но это может упростить работу с многослойными файлами.
Установить седьмой кадр. Это последний кадр, на котором отображается текст вместе с логотипом Lifewire.com. Первый шаг здесь — добавить еще один слой с белым фоном.
Затем используйте Текстовый инструмент добавить текст. Это применяется к новому слою, но мы разберемся с этим, как только вы добавите логотип или новое изображение, что можно сделать так же, как графика посадочного места была добавлена ранее.
Когда мы разместим их по желанию, мы можем использовать Слить чтобы объединить слои с логотипом и текстом, а затем объединить этот комбинированный слой с белым слоем, который был добавлен ранее. Это создает один слой, который сформирует окончательный кадр, и мы решили отображать его в течение 4000 мс.
Предварительный просмотр анимации. Перед сохранением анимированного GIF-изображения GIMP имеет возможность предварительно просмотреть его в действии, перейдя в Фильтры > Анимация > Воспроизведение. Откроется диалоговое окно предварительного просмотра с понятными кнопками для воспроизведения анимации. Если что-то не так, здесь можно исправить. В противном случае его можно сохранить как анимированный GIF.

Последовательность анимации устанавливается в том порядке, в котором слои уложены в Слои палитру, начиная с фона или нижнего слоя и двигаясь вверх. Если ваша анимация воспроизводится не по порядку, вам нужно будет настроить порядок слоев, щелкнув слой для выбора и используя стрелки вверх и вниз на нижней панели палитры слоев, чтобы изменить его положение.
Сохранить анимированный GIF. Сохранение анимированного GIF-изображения — довольно простое упражнение. Сначала перейдите к Отправьте > Сохрани копию дайте файлу соответствующее имя и выберите, где вы хотите сохранить файл.
Затем перейдите к Отправьте > Экспортировать как чтобы сохранить его как анимированный GIF.
в Экспорт изображения в открывшемся диалоговом окне выберите Выберите тип файла и выделите изображение GIF и выберите его, затем выберите экспорт. Если вы получаете предупреждение о том, что слои выходят за фактические границы изображения, выберите урожай Кнопка.
Теперь это приведет к Сохранить как GIF диалог с разделом Параметры анимированного GIF. Вы можете оставить их по умолчанию, хотя, если вы хотите, чтобы анимация воспроизводилась только один раз, вы должны снять флажок Цикл навсегда.
Теперь вы можете поделиться своим анимированным GIF-файлом.

Заключение

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