Как сделать легкую анимацию в фотошопе

Обновлено: 21.11.2024

Я начал с размера холста 800 × 600 пикселей исключительно в этом уроке, например, если вы используете этот эффект для веб-сайта, вы можете использовать что-то немного меньшее из-за размера файла. Я смоделировал простой фон, который дополняет кнопку.

Создание кнопки

Выберите инструмент «Эллипс» (U), затем перетащите эллипс на холст.

Добавьте следующие стили слоя к эллипсу.

У вас должно получиться что-то вроде этого.

Продублируйте только что созданный эллипс, затем нажмите (Ctrl + T) для «Инструмента свободной трансформации», выберите одну из угловых опорных точек и удерживайте нажатой (Shift + Alt). Перетащите вниз, чтобы изменить размер эллипса. После изменения размера эллипса щелкните слой правой кнопкой мыши и выберите «Очистить стили слоя».

Теперь добавьте следующие стили слоя к дублированному слою.

У вас должно получиться что-то вроде этого.

Создание эффекта алюминия

Добавьте фильтр шума к черному прямоугольнику, выбрав «Фильтр > Шум > Добавить шум».

Теперь перейдите в «Фильтр > Размытие > Радиальное размытие» и используйте указанные ниже настройки.

Отмените выбор (Ctrl + D), затем установите режим наложения слоя на «Экран». Теперь нам нужно удалить часть прямоугольника, поместив слой алюминия так, чтобы он был центром эллипса кнопки.

Выберите слой с эллипсом, удерживая нажатой клавишу «Ctrl» на клавиатуре, чтобы загрузить выделение вокруг слоя с эллипсом кнопки. В качестве альтернативы выберите «Слой > Загрузить выделение». После загрузки выделения перейдите в «Выделение > Инверсия» и нажмите клавишу удаления на клавиатуре.

Добавление символа силы

Загрузить символ силы из списка ресурсов.

После загрузки символа питания добавьте его к кнопке в центре.

Добавьте следующие стили слоя к символу силы.

У вас должно получиться что-то вроде этого.

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

У вас должно получиться что-то вроде этого.

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

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

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

Если вы выберете первый кадр, свечение не будет видно, если вы выберете второй кадр, светящийся слой должен быть виден, если это так, то вы все сделали правильно. Теперь выберите оба кадра, щелкнув, удерживая нажатой клавишу «Ctrl» на клавиатуре, как только оба кадра будут выбраны, снова нажмите маленькую серую стрелку и выберите «Tween».

Когда появится окно анимации, введите следующие настройки.

Когда вы нажмете OK, у вас будет 5 новых слоев, содержащих анимацию. Если вы нажмете кнопку воспроизведения, вы увидите анимацию в действии. В конце анимации вы заметите, как она возвращается к началу. Чтобы сделать анимацию бесшовной, выберите все 7 слоев.

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

Прежде чем мы проверим анимацию, выберите все 14 кадров, затем нажмите маленькую черную стрелку на одном из слоев и установите время «Без задержки».

Протестируйте и сохраните свою анимацию и все готово.

Заключение

Спасибо за участие в этом руководстве. Если вам удалось закончить это руководство, мне бы хотелось увидеть некоторые из ваших результатов. Не стесняйтесь публиковать их на нашей фан-странице в Facebook.

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

GIF, или «формат обмена графикой», представляет собой сжатый формат файла изображения, который позволяет использовать анимацию. Есть много способов создать GIF, но Photoshop — это быстро и просто, со встроенными инструментами для обработки изображений и анимации.

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

Узнайте, как я создал этот GIF! Фото через Грэма Уизардо.

Без лишних слов, вот как создать анимированный GIF в Photoshop.

Шаг 1. Настройте размеры и разрешение документа Photoshop

Подготовьте документ заранее. Даже если ваша единственная цель — создать GIF-файл, которым можно поделиться с друзьями в социальных сетях, если размер ваших фотографий или видео диктует размер вашего документа, это может привести к тому, что файл будет больше, чем вам нужно, что приведет к плохому качеству. GIF. В целом, где-то в районе 600–800 пикселей нормально для квадратного изображения.

Настройте размеры, разрешение и цветовой режим документа Photoshop

Размеры

Для этого проекта мы работаем с рекламным баннером в формате GIF, который имеет стандартные рекомендации по размеру. Я выбрал макет 720×300. Убедитесь, что ваши единицы измерения указаны в пикселях.

Разрешение

Чтобы размер файла был как можно меньше, подойдет разрешение 150 пикселей. Я выбрал 300, так как знаю, что мой GIF не будет таким большим. Убедитесь, что ваши единицы измерения указаны в пикселях на дюйм.

Цветовой режим

Наконец, анимированные GIF-файлы создаются для экрана, поэтому установите цветовой режим на цвет RGB. Нажмите «Создать», чтобы открыть новый документ.

Шаг 2. Импортируйте файлы изображений в Photoshop

Файл > Скрипты > Загрузить файлы в стек…

Нажмите "Обзор", найдите изображения, при необходимости выровняйте их и нажмите "ОК".

Создание GIF из неподвижных изображений

Выберите «Файл» > «Сценарии» > «Загрузить файлы в стек» и нажмите кнопку «Обзор» в появившемся окне «Загрузить слои». Откроется окно Finder/Explorer, в котором вы можете просмотреть свои файлы и выбрать все, что вам нужно. Когда вы закончите, нажмите «Открыть», а затем «ОК» в следующем окне. Файлы будут импортированы в отдельный документ, из которого вы сможете выбрать все слои и перетащить их в свой рабочий документ.

Создание GIF из видео

Если вы конвертируете видео в GIF, выберите «Файл» > «Импорт» > «Видеокадр в слои».

Шаг 3. Откройте окно временной шкалы

Окно > Временная шкала

Настроить окно временной шкалы для покадровой анимации

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

Шаг 4. Преобразуйте слои в кадры

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

Ваш первый кадр уже будет настроен и состоит из всех видимых слоев (это означает, что видимость слоя или значок глаза включена) в вашем документе. Теперь все, что вам нужно сделать, это заполнить временную шкалу несколькими кадрами, чтобы имитировать движение. Есть два способа сделать это: импортировать уже подготовленные кадры или создать свою анимацию с нуля в Photoshop. В этом разделе рассматривается первый сценарий.

Если вы уже заранее настроили неподвижные последовательные изображения (или работаете с импортированными видеокадрами, см. шаг 2), щелкните значок меню-гамбургера в правом верхнем углу панели временной шкалы. Выберите «Создать кадры из слоев». Вы увидите, как временная шкала заполняется кадрами из ваших слоев.

Шаг 5. Дублируйте кадры для создания анимации

Под временной шкалой находится панель инструментов, которая содержит (среди прочего) настройку цикла, кнопку предварительного просмотра и кнопку дублирования кадра

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

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

Шаг 6. Установите время задержки каждого кадра

Настройка длительности находится внизу каждого кадра

Вы можете найти таймер задержки в нижней части каждого кадра (время в секундах со стрелкой раскрывающегося списка рядом с ним).

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

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

Совет. Большое количество кадров с короткими задержками – ключ к плавной анимации, тогда как небольшое количество кадров с длинными задержками создает прерывистый эффект покадровой анимации.

Шаг 7. Установите, сколько раз анимация будет повторяться

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

Шаг 8. Предварительный просмотр и повторение анимации

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

Шаг 9. Экспортируйте документ Photoshop в формате GIF

Файл > Экспорт > Сохранить для Интернета (предыдущая версия)…

Прежде всего, не забудьте сохранить рабочий PSD!

Когда вы будете готовы экспортировать окончательный вариант GIF, выберите «Файл» > «Экспорт» > «Сохранить для Интернета (предыдущая версия)». (Примечание: если вы работаете с более старой версией Photoshop, скорее всего, это будет «Файл» > «Сохранить для Интернета и устройств»). Откроется окно экспорта.

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

Уменьшить размер файла

Ваша основная цель с оставшимися параметрами – сохранить небольшой размер файла за счет уменьшения количества деталей в GIF без ущерба для качества изображения. Помните, что большой размер файла означает медленную загрузку, что может быть особенно неприятным для маркетинговых целей, таких как рекламные баннеры, когда зритель не искал ваш контент и не будет ждать его загрузки. Стремитесь оставаться ниже 1 МБ. До 5 МБ выполнимо на большинстве веб-сайтов, но это необходимо. Вы можете увидеть размер файла GIF в левом нижнем углу панели, содержащей изображение для предварительного просмотра.

Это параметры, на которые следует обратить внимание в окне "Сохранить для Интернета"

Уменьшить информацию о цвете

Ненужная информация о цвете является главной причиной большого размера файла. Чтобы сократить его, отрегулируйте общее количество цветов в раскрывающемся списке «Цвета:» и уменьшите настройку дизеринга (смешивания пикселей для создания плавного затенения) под ним. Внося изменения, следите за изображением предварительного просмотра GIF слева, чтобы увидеть, как изменяется разрешение.

Преобразовать в sRGB

sRGB или «Стандартный RGB» имеет более узкий диапазон цветов, чем Adobe RGB по умолчанию, поэтому обязательно установите этот флажок.

Когда вас устраивают разрешение и размер файла, нажмите кнопку "Сохранить" в нижней части окна. Чтобы убедиться, что все в порядке, вы можете предварительно просмотреть готовый GIF-файл, перетащив его в поле URL-адреса браузера.

Мой готовый рекламный баннер GIF. Фото через Грэма Уизардо.

Шаг 10. Поделитесь готовым GIF-файлом Photoshop!

Вот и готово ваше GIF-изображение, готовое к публикации во всемирной паутине. Теперь, когда у вас есть навыки создания базовых анимаций в Photoshop из видео и неподвижных изображений, вы можете оживить практически все!

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

Ищете профессиональную помощь в создании анимации?
Поработайте с одним из наших талантливых дизайнеров!

Эта статья изначально была написана Ребеккой Крегер и опубликована в 2013 году. В нее добавлена ​​новая информация и примеры.

Анимация — отличный способ оживить ваши видео или веб-сайты. Но создать их не так уж и сложно! Следуйте инструкциям и убедитесь, как легко использовать простые изображения и значки для создания собственных очаровательных кадровых анимаций в Photoshop.

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

Кредит исполнителя

Поделиться

Анимация стала проще!

Инструменты анимации в Photoshop

Когда большинство людей думают о создании анимации, Photoshop — не первая программа, которая приходит на ум. В то время как Adobe Premiere и Adobe After Effects могут быть более мощными инструментами в целом, Photoshop по-прежнему является очень удобным вариантом для добавления основного движения к изображению. Так что, если вам удобнее всего пользоваться Photoshop и вам нужны простые анимации, то это руководство для вас!

Если вы хотите немного изучить After Effects, у нас есть учебник из двух частей, в котором мы создаем текст и градиент в Photoshop, а затем используем After Effects, чтобы добавить красивую анимацию!

Вся магия анимации в Photoshop стала возможной благодаря временной шкале. Если вы знакомы с основами видео и анимации, вы знаете, что временная шкала — это просто отображение того, как различные визуальные элементы появляются и меняются в сцене в течение заданного промежутка времени. Вы можете найти временную шкалу, щелкнув меню «Окно», а затем параметр «Временная шкала».

В Photoshop есть несколько различных параметров временной шкалы.

Есть временная шкала видео, которая отлично подходит для более плавного и динамичного движения и более сложных сцен. Кроме того, есть временная шкала анимации кадров, которая работает как слайд-шоу, позволяя создавать несколько кадров и соединять их вместе. Временная шкала покадровой анимации немного проще в использовании, поэтому сегодня мы рассмотрим именно ее.

Как создать анимацию кадра

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

Если вы создадите второй кадр, он также будет содержать все видимое в проекте. Но затем каждый кадр можно изменить и отредактировать независимо.

Предположим, например, что у вас есть строка текста с надписью «Я ЛЮБЛЮ PHLEARN» в качестве первого кадра на временной шкале. Затем вы создаете второй кадр, а затем переворачиваете этот текст вверх ногами. При воспроизведении анимации сначала отображается текст, затем он переворачивается вверх ногами, а затем снова обратно.

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

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

Перемещение и преобразование для простой анимации

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

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

В нашем примере у нас было изображение плиток с буквами. Поэтому нам пришлось вырезать плитки из их фона.

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

Для этого может потребоваться вырезать некоторые элементы фона или несколько раз дублировать слой, но это относительно легко сделать, и итоговая анимация будет намного более динамичной. Если вам нужно научиться вырезать объекты и удалять фон в Photoshop, ознакомьтесь с нашим PRO-курсом «Как изменить и удалить фон в Photoshop»

Как экспортировать анимацию в Photoshop

После того, как все кадры установлены, пришло время экспортировать анимацию. Есть несколько способов сделать это в зависимости от того, какой тип файла вы хотите и где вы хотите его отобразить. Если это происходит на веб-сайте, GIF, вероятно, лучший способ. Перейдите в меню «Файл», «Экспорт», «Сохранить для Интернета (старые версии)» и выберите «GIF» в раскрывающемся списке в правом верхнем углу диалогового окна.

Если вы хотите использовать его в качестве титульного листа в видео или загрузить его на такую ​​платформу, как YouTube, скорее всего, вы захотите сохранить его в формате MP4. Для этого перейдите в меню «Файл», «Экспорт», «Обработка видео» и выберите MP4, настроив параметры по своему усмотрению.

В этом уроке мы создадим 3D-эффект Photoshop в стиле VHS для текстовых слоев, используя интеллектуальные фильтры, градиентные заливки и наложения видео.

Вы можете найти множество текстовых экшенов Photoshop на GraphicRiver, и если вы хотите создать этот 3D-текстовый эффект всего за несколько простых кликов, посмотрите мой анимационный текстовый эффект VHS, созданный таким же образом.

Когда вы закончите с этим руководством, ознакомьтесь с десятью способами оптимизации конечного продукта для использования в Интернете из этого руководства:

Обучающие материалы

  • Шрифт Bebas Neue или любой другой похожий шрифт, который вы хотите использовать для этого эффекта.

1. Как подготовить документ

Шаг 1

Нажмите Control-N, чтобы создать новый документ и использовать следующие настройки:

Шаг 2

Создайте новый слой с помощью Shift-Control-N и назовите его "placeholder".

Шаг 3

Щелкните правой кнопкой мыши слой и выберите Преобразовать в смарт-объект.

Шаг 4

После этого щелкните правой кнопкой мыши > "Редактировать содержимое" слоя "заполнитель".

Шаг 5

Нажмите T, чтобы открыть инструмент Horizontal Type Tool и создать любой текст, используя шрифт Bebas Neue размером 84 pt.После этого закройте и сохраните заполнитель.

Шаг 6

Щелкните правой кнопкой мыши смарт-объект, выберите "Дублировать" и создайте две копии слоя.

Шаг 7

Переименуйте слой в "text" и "glow" и сделайте первый смарт-объект невидимым.

Шаг 8

2. Как создать текстовые эффекты для VHS

Шаг 1

Теперь давайте начнем создавать наши текстовые эффекты. Выберите слой «Текст», затем перейдите в «Фильтр» > «Размытие» > «Размытие по Гауссу» и установите Радиус на 2 пикселя.

Шаг 2

После этого перейдите в меню «Фильтр» > «Размытие» > «Размытие в движении» и используйте следующие настройки:

Шаг 3

Выберите Фильтр > Искажение > Волна и используйте следующие настройки:

Шаг 4

Теперь нам нужно создать эффекты стиля слоя. Дважды щелкните слой и перейдите к наложению градиента.

Шаг 5

Используйте следующие настройки градиента:

Шаг 6

После этого вам нужно добавить Gaussian Blur и Wave Effect с теми же параметрами к слою "glow".

Шаг 7

Дважды щелкните слой и добавьте эффект внешнего свечения с тем же градиентом, который мы использовали ранее, и со следующими настройками:

Шаг 8

Измените настройку заливки слоя на 0%.

Шаг 9

Выберите смарт-объекты, удерживая клавишу Shift, а затем нажмите значок "Создать новую группу" и назовите ее "Основной текст".

Шаг 10

Создайте две копии группы и назовите их "Сдвиг цвета 01" и "Сдвиг цвета 02".

Шаг 11

Дважды щелкните слой "Color Shift 01" и снимите флажки с зеленого и синего цветовых каналов.

Шаг 12

Дважды щелкните слой "Color Shift 02" и снимите флажки с красного и зеленого цветовых каналов.

Шаг 13

Переместите группу слоев "Color Shift 01" на 4 пикселя влево, удерживая нажатой клавишу Shift.

Шаг 14

Переместите группу слоев "Color Shift 02" на 8 пикселей вправо, удерживая нажатой клавишу Shift.

3. Как создать накладывающиеся элементы

Шаг 1

Шаг 2

Выберите «Фильтр» > «Галерея фильтров» > «Эскиз» и выберите «Полутоновый узор». Используйте следующие настройки:

Шаг 3

Создайте дубликат слоя и переместите его на 1080 пикселей вверх, удерживая клавишу Shift.

Шаг 4

После этого вам нужно выбрать оба слоя и снова переместить их на 1080 пикселей вверх.

Шаг 5

Создайте еще один дубликат слоя 1 и переместите его на 1080 пикселей вниз.

Шаг 6

Выберите все три слоя и щелкните правой кнопкой мыши > Объединить слои. Назовите его "Телевизионные линии".

Шаг 7

Измените режим наложения слоя на «Перекрытие» и уменьшите непрозрачность до 25%.

Шаг 8

Выберите «Файл» > «Поместить», а затем выберите файл MP4 из вложения к этому руководству. Измените размер и поверните его к границам документа.

Шаг 9

Измените режим наложения слоя на Экран.

Шаг 10

Выберите слои наложения, удерживая нажатой клавишу Shift, а затем нажмите значок "Создать новую группу" и назовите ее "Наложения видео".

Шаг 11

Теперь нам нужно создать градиентные наложения для нашего видео. Перейдите в Layer > New Fill Layer > Gradient и создайте два градиента. Назовите их "Light Leaks 01" и "Light Leaks 02".

Шаг 12

Дважды щелкните первую градиентную заливку на панели «Слои» и используйте следующие настройки:

Шаг 13

После этого щелкните левой кнопкой мыши на градиенте на той же панели и создайте новый градиент со следующими настройками:

Шаг 14

Дважды щелкните вторую градиентную заливку на панели слоев и используйте следующие настройки:

Шаг 15

После этого щелкните левой кнопкой мыши на градиенте на той же панели и создайте новый градиент со следующими настройками:

Шаг 16

Измените режимы наложения обоих градиентов на Color Dodge.

Шаг 17

Выберите слои наложения, удерживая нажатой клавишу Shift, а затем нажмите значок "Создать новую группу" и назовите ее "Light Leaks".

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

Шаг 1

Теперь мы готовы приступить к созданию анимации. Выберите «Окно» > «Временная шкала» и щелкните значок «Создать временную шкалу видео».

Шаг 2

Уменьшите продолжительность временной шкалы до 05:00, переместив значок, показанный ниже.

Шаг 3

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

Шаг 4

Переместите индикатор времени на 0:00:00:10, а затем переместите слой на 15 пикселей вверх, удерживая клавишу Shift.

Шаг 5

Переместите индикатор времени на 0:00:00:20, а затем переместите слой на 15 пикселей вниз, удерживая клавишу Shift.

Шаг 6

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

Шаг 7

Переместите индикатор времени на 0:00:01:00, а затем нажмите значок ключевого кадра.

Шаг 8

После этого щелкните правой кнопкой мыши > Вставить на последнем ключевом кадре, чтобы дублировать ранее созданные ключевые кадры.

Шаг 9

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

Шаг 10

Выделите все ключевые кадры слоя "текст" и вставьте их в слой "свечение".

Шаг 11

Выберите слой "TV Lines" и щелкните значок таймера рядом с положением, чтобы создать первый ключевой кадр.

Шаг 12

Переместите индикатор времени на 0:00:05:00 и переместите слой на 2160 пикселей вниз, удерживая клавишу Shift.

Шаг 13

Выберите слой «Light Leaks 01» на панели временной шкалы и уменьшите размер клипа до «Начало: 02:00» и «Продолжительность»: 02:00.

Шаг 14

Выберите слой «Light Leaks 02» на панели временной шкалы и уменьшите размер клипа до «Начало: 03:00» и «Длительность»: 02:00.

Шаг 15

Нажмите значок "Переходы" и выберите "Затухание".

Шаг 16

Перетащите переход Fade в начало и конец "утечки света 01".

Шаг 17

Нажмите правой кнопкой мыши и измените продолжительность обоих переходов Fade на 0,97 с.

Шаг 18

После этого вам нужно применить тот же переход с такой же продолжительностью ко второму слою "световые блики".

Шаг 19

Создайте новый слой, используя Shift-Control-N, затем залейте его черным цветом и назовите "Появление/исчезновение".

Шаг 20

Измените Заливку слоя на 0%.

Шаг 21

И, наконец, перетащите переход Fade With Black в начало и конец слоя Fade In/Out.

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

Шаг 1

Наша анимация готова к рендерингу. Нажмите на значок в правом верхнем углу и выберите Рендеринг видео.

Шаг 2

Установите следующие параметры на панели «Визуализация видео»:

Отличная работа! Готово!

Ваше видео готово! Таким образом, мы можем создать анимированный текстовый эффект VHS в Adobe Photoshop, используя смарт-объекты, градиентные заливки, фильтры и наложения видео.

Надеюсь, вам понравился этот урок, и если вы хотите создать этот эффект с помощью экшенов Photoshop, вы можете проверить мой анимационный экшен VHS Text Effect на GraphicRiver, который поможет вам создать этот текстовый эффект за несколько простых кликов.< /p>

Читайте также: