Методы производства, которые мы изучили на данный момент, достаточны для удовлетворения большинства потребностей в производстве плоской анимации. В этом уроке мы изучим некоторые методы, которые могут добавить больше эффектов к анимационным работам, в том числе: специальные слои, ускорение и замедление, размытие в движении и деформацию текста . Я также надеюсь, что каждый сможет обобщить свои собственные производственные навыки и поделиться ими с другими.
Эти навыки основаны на предыдущих курсах. Поэтому необходимо досконально освоить все предыдущие курсы.
К элементам, которые можно анимировать в Photoshop, относятся положение слоя, маска слоя, непрозрачность слоя и стиль слоя. На базовом этапе обучения мы узнали о слоях корректировки цвета и слоях заливки. Этот тип слоя является особенным. Первый не создает изображение напрямую, а вносит коррективы в цвет нижележащего слоя. Хотя последний создает изображение, это «виртуальный пиксель», и заполненное содержимое можно изменить позже. Теперь давайте воспользуемся ими для анимации и посмотрим, какой эффект мы сможем получить. Нажмите здесь, чтобы прочитать о слоях корректировки цвета. Нажмите здесь, чтобы прочитать о слоях заливки.
Слой регулировки цвета относительно прост в использовании, и вы можете использовать его для создания эффектов изменения цвета. Эти эффекты могут варьироваться от изменения света и темноты, изменения оттенков серого, инверсии и т. д. Метод реализации также очень прост: сначала создайте корректирующий слой цвета и выполните соответствующие настройки, а затем анимируйте непрозрачность корректирующего слоя. Ниже приведены примеры анимации: затемнение кривой, осветление кривой, наложение градиента и инверсия. Чтобы изменить изображение на оттенки серого, вы можете использовать градиент оттенков серого карты градиента или использовать насыщенность оттенка.
Следует отметить, что такая анимация смены цвета занимает большое количество байт, поскольку пиксели между предыдущим и следующим кадром в основном различаются. Это следует сбалансировать, максимально уменьшив количество кадров, частоту кадров или размер анимации. Кроме того, вы также можете создать маску корректирующего слоя, чтобы добиться эффектов регулировки цвета только для определенной области, которая здесь не будет продемонстрирована.
Иногда может возникнуть необходимость продемонстрировать некоторые кардинальные изменения. Так называемые радикальные изменения — это либо большие перемещения пикселей, либо большие изменения цвета. Для достижения резких изменений цвета можно использовать инверсию. В предыдущем примере мы обнаружили, что эффект использования инверсии в качестве перехода не очень хорош. Отключение эффекта перехода может привести к резким изменениям цвета. Этого можно добиться двумя способами: один — установить кадр с сохранением интерполяции. Второе — не оставлять зазор между двумя ключевыми кадрами, чтобы не имело значения, есть переход или нет.
Следует отметить, что второй метод менее поддается модификации в дальнейшем. Если вы увеличите частоту кадров в настройках документа, новый кадр будет вставлен между двумя исходными близко расположенными ключевыми кадрами, поэтому возникнет эффект перехода. Поэтому этот метод не рекомендуется. Вместо этого выберите первый подход.
Теперь каждый может сделать эту анимацию самостоятельно. В пакете файлов содержатся фотографии материалов и PSD готового изделия. Пожалуйста, пока не открывайте PSD-файл и попробуйте проанализировать и создать его самостоятельно. После завершения обратитесь к образцу PSD-файла.
Этот пример анимации, демонстрирующий технику использования корректирующего слоя «Инвертировать», имеет определенный сюжет. Первый — падающий черный метеор. Метеор представляет собой прямую или вертикальную линию, нарисованную кистью с шагом затухания, затем повернутую на 45 градусов (угол можно настроить), а затем создается часть неба, кроме здания. как Маск. После отсоединения маски метеор можно будет перемещать самостоятельно и создавать эффект окклюзии со зданием. Последующее обратнофазовое чередование не имеет технических сложностей и не будет далее поясняться. Что касается создания масок, обратитесь к соответствующему материалу о масках слоев в базовом руководстве.
Следует отметить, что при окончательном затухании используется корректирующий слой оттенка и насыщенности. Разница в том, что вместо предыдущего затухания до белого используется постепенное затухание до черного. При использовании корректирующих слоев для создания затухания лучше не использовать «Кривые» или «Яркостный контраст», так как эти две команды настройки цвета не превращают изображение в полностью белое или черное, как это делает команда «Насыщенность оттенка».
Помимо использования корректирующих слоев, вы также можете использовать слои заливки или обычные слои заливки для создания затухания. Принцип затухания — это процесс постепенного увеличения непрозрачности слоя от 0% до 100%. Преимущество этого метода в том, что помимо черного и белого он также может плавно переходить в другие цвета, например красный, синий и т. д. Ниже представлена анимация, созданная в 2000 году. Личная фотография того времени была разрезана на две разные области, а затем разделена на три сегмента. Белый слой заливки использовался для создания эффекта имитации перехода экспозиции. Поскольку на классическом форуме он используется в качестве личного аватара, размер и количество байт анимации строго ограничены.
Это непростая задача — сохранить как можно меньшее количество байтов и при этом обеспечить максимально плавность анимации. Для этого может потребоваться пожертвовать некоторыми, даже хорошими идеями. Но если создаваемая анимация не соответствует требованиям или передача происходит медленно, она потеряет свою важнейшую ценность. Вы можете использовать другие материалы для имитации этой анимации, а размер файла ограничен примерно 5 КБ (пример — 3,65 КБ). И попробуйте добавить к этой предпосылке несколько новых собственных идей. Что касается монохромных эффектов и эффектов шелковых нитей.
В слое заливки, помимо обычно используемых сплошных цветных заливок, имеются также узорчатые заливки и градиентные заливки. Никаких дополнительных инструкций по их использованию не будет. Вы можете просто попробовать их сами.
Мы давно научились создавать движущийся объект, но все созданные нами объекты двигались с постоянной скоростью. Теперь мы можем имитировать эффекты ускорения и замедления, изменяя положение ключевых кадров. Этот эффект не ограничивается движением объектов, но также может использоваться в любом переходном эффекте, таком как постепенное появление и исчезновение. Этот метод также применим к другим программам для редактирования видео, а также к эффекту временной шкалы DHTML в программном обеспечении для создания веб-страниц GoLive.
Сначала мы создаем новое белое фоновое изображение размером 150×100 и устанавливаем для документа длительность 1 секунду и 30 кадров в секунду. Создайте новый нормальный слой, нарисуйте прямоугольник и установите анимацию для его перемещения слева направо. Настройка временной шкалы примерно такая, как показано на рисунке ниже. Текущая скорость движения постоянна.
Далее переместите временную отметку на 10f, нажмите ромбик пункта «Позиция» и вручную добавьте ключевой кадр в текущий момент. Этот ключевой кадр в настоящее время является избыточным, поскольку он не меняет процесс анимации. Теперь представим, что если изначально вы планировали приехать к месту за 10 минут, а теперь от вас требуют прибыть за 5 минут, то вам обязательно нужно ускориться. Поняв этот принцип, вы сможете понять и метод создания ускоренной анимации. То есть переместить ключевой кадр с момента 10f на момент 05f. Таким образом, объект будет быстро перемещаться между 0f и 05f и вернется к исходной скорости после 05f.
По аналогии переместите 15f на 10f, 20f на 15f и 25f на 20f. Вы можете создать объект, который замедляется. Мы здесь, чтобы проиллюстрировать эффект, но в реальном производстве на самом деле нет необходимости менять так много ключевых кадров. В зависимости от расстояния, на которое перемещается объект, обычно достаточно изменить 2–3 ключевых кадра. Слишком большие расстояния перемещения не подходят для представления GIF. Кроме того, не устанавливайте частоту кадров выше 30 кадров в секунду.
Размытие в движении на самом деле связано с движением объектов. Иногда, когда необходимо использовать меньше кадров, чтобы передать быстрое движение объектов, использование размытия в движении может уменьшить ощущение прыжков изображения. В следующем примере демонстрации анимации количество кадров, предусмотренных для движения персонажа, составляет 4 кадра. При таком перемещении на большое расстояние (так называемое большое расстояние также необходимо учитывать размер объекта) очень сложно. ограниченное количество кадров. Чтобы восполнить этот недостаток, мы дублируем слой с персонажем и обрабатываем его фильтром размытия в движении, чтобы создать эффект остаточного изображения. Переместите остаточное изображение со слоем персонажа и скройте его в начале и в конце движения. Этот графический персонаж можно найти в библиотеке фигур, входящей в состав Photoshop. Каждый пытается создать эффект размытия изображения самостоятельно. Мы предоставляем исходные файлы PSD для сравнения после завершения.
Следует отметить, что здесь мы по-прежнему сохраняем полное изображение персонажа в кадре с помощью размытия в движении. В реальной работе мы также можем уменьшить непрозрачность персонажа или просто сохранить только остаточное изображение, что приведет к более быстрому ощущению движения. . В режиме сохранения только остаточного изображения длина остаточного изображения должна быть соответствующим образом увеличена и должна быть близка к положению объекта в конце движения. Вы можете внимательно посмотреть пример анимации и обратить внимание на разницу в положении остаточного изображения.
Размытие изображения широко используется в сфере кино- и телепроизводства, и большинство программ для кино- и телепроизводства, таких как After Effects, имеют для этого специальные функции. В некоторых фильмах и телевизионных клипах, если приостановить движение быстродвижущихся объектов, можно увидеть похожие остаточные изображения. Английское название размытия в движении — Motion Blur. При создании GIF-анимации размытие в движении может увеличить количество цветов в анимации, поскольку сам эффект остаточного изображения содержит много переходных цветов. При выводе обратите внимание на баланс между количеством цветов и качеством анимации.
Помимо использования фильтров для создания остаточных изображений, вы также можете скопировать несколько копий слоя и последовательно изменять его цвет или непрозрачность, чтобы сформировать более регулярный эффект остаточного изображения. Как показано на рисунке справа ниже, вы можете скопировать слой персонажа в 3 копии. и залейте их ими. Цвет меняется на разную степень серого. Этот вид остаточного изображения также можно хорошо выразить с помощью меньшего количества цветов. Остаточное изображение, сформированное фильтром, может создавать цветовые пятна с меньшим количеством цветов.
При использовании текстовых слоев некоторые внимательные читатели, возможно, обнаружили анимационный проект « деформация текста ». Как показано на рисунке ниже, вы можете установить стиль деформации «Нет» или другие стили анимации, чтобы создать эффект переходной деформации. Этот анимационный проект на самом деле очень прост в использовании, но, к сожалению, он может ограничиваться только текстом. Было бы лучше, если бы он был эффективен для всей графики. Однако иногда мы можем имитировать некоторые простые формы объектов с помощью знаков препинания или специальных символов в тексте, тем самым получая возможность деформироваться. Например, символ «-» можно развернуть в прямоугольник.
