Относно цветовата концепция се замислихме да направим всичко много прости със син фон и жълт текст. Синьо и жълто са комлементарни цветове, които се четат страхотно и се открояват красиво един от друг.

Теоретически можем да създадем нов цветов фон, да му дадем син цвят и да направим текста жълт. Това може да направим, но ще имаме проблем как точно по средата на анимацията да сложим четка, която обръща цветовете.

Можем да опитаме чрез Layer>New>Adjustment Layer или Ctrl+Alt+Y да създадем настройващ слой и след това да приложим ефекта Invert Channels. Но ще забележим, че цветовете ни все пак не са напълно комлементарни. За синьото комлементарно е оранжево и това не става тук, не се съвпадат цветовете.

Анимацията става лесно: Цветовете.


Искам обаче определено да го направя и има начин.


Стъпка 1

Ние създаваме това по следния начин: Вземаме кралско син цветов фон и натискаме Ctrl+Shift+Y или отиваме на Layer>Solid Settings и задаваме цвета на черно.

Анимацията лесно направена: Цветовете

Това ще бъде красиво променено и After Effects ще преименува дори цветовия фон.

Написваме текста "Animation leicht gemacht" просто на бяло.

Анимацията е лесна: Цветовете

Имаме черно и бяло без прозрачност и можем лесно да ги обърнем.

Анимацията лесно направена: Цветовете



Но сега имаме само черно и бяло, но аз искам синьо и жълто.

Стъпка 2

Затова създаваме още един настройващ слой („Adjustment Layer 2“) с Ctrl+Alt+Y и прилагаме Effects>Color Correction>Tint върху него.

Ефектът е много прост и просто променя предварително зададените цветове. Той взема черното и бялото и присвоява различен цветов стойност.

Анимацията лесно се прави: Цветовете.

След това вземаме черното тук и настройваме нашето синьо. Вече съм написал код за цвета "008FFF", което е това красиво синьо.

И белият цвят го настройваме с жълто, стойността на цвета е "FFF000", наистина наситено жълто.

Анимацията лесно се прави: Цветовете

Стъпка 3

Сега приложихме това пред Eбейте за обръщане. Ще преименувам всичко в „Change Colors“ и „Colorize“.

Заключете и горния слой, защото никога повече няма да се докосвате до него.

Анимацията лесно стана: Цветовете

Когато включа и изключа "Change Colors", ние имаме чудесно обръщане на цветовете, без да преминаваме в оранжево или лилаво.

Анимацията лесно се прави: Цветовете.



Но как да направим прехода? Можем да движим "Change Colors" слоя отляво надясно или отгоре надолу през картината и да направим преход. Но това не е толкова интересно.

Бих искал да направя нещо повече именно да разделим това на ивици и тези ивици да преминат през картината, за да разбием малко повече ръбовете. Как можем да постигнем най-доброто?

Стъпка 4

Има ефекти за това, като например при Effects>Transition Effects; имаме Line Sweep, който върви в една посока, но първо се завършва едната линия преди да започне следващата.

За мен това не е достатъчно неравномерно.

Анимация лесно направена: Цветовете

Стъпка 5

Затова най-добре да направим това с маски. Щракнем двукратно върху иконата на маската и създаваме маска, която точно съответства на моите мерки. Това е много удобна функция, която по-късно ще използваме отново.

Анимацията е лесна: Цветовете

Стъпка 6

Искам да разделя тази маска на 20 части, така че да имаме 20 отделни колони. Това не може да се направи по стандартни средства на After Effects.

Но в такива случаи просто си пишем скрипт за това. За нещата, които използваме тук, съм прикачил скриптовете на съответното урок.

Там намерихме Layer Chainer, Mask Slicer и Sequence Strokes. Mask Slicer е това, което ни трябва тук, както си мислите.

Този символ пред името на файла е от Extendscript Toolkit, мога да го стартирам тук. Когато го стартирам, стартира се и този Extendscript Toolkit.

Този Toolkit трябва да се инсталира отделно, тъй като по подразбиране не е инсталиран. Трябва да се справите с това, което е много лесно чрез CreativeCloud.

В този скрипт горе имаме няколко Settings. Няма изграден потребителски интерфейс за всички скриптове, защото те са за лична употреба. Това означава, че трябва директно да промените всички настройки в текстовия файл.

В този случай можем да променим две стойности: "noOfSplices", т.е. колко отделни ивици искаме на края.

И "separateLayers", може да бъде true или false. При true за всяко ивица се добавя нов слой.

Нека опитаме с 4 ивици, ...

Анимацията е лесна: Цветовете

... отидете в After Effects и изберете маската, която искаме да нарежем. Това е много важно.

След това изберете After Effects CC от горното меню на приложението. Виждате, че има и други програми, този набор от инструменти е предназначен за писане и тестване на скриптове.

В този случай избираме After Effects, след което натискам бутона Play ...

Анимацията лесно стана: Цветовете

... и се връщаме към After Effects. Там имаме новите слоеве, всеки от които се състои от един слой.

И ако сега създадем 4-цветен градиент, ...

Анимацията лесно се прави: Цветовете

... виждате, че целият процес дава ново изображение. Всъщност това е слой с една координата, само маските са изрязани. Това означава, че имаме отделни парчета от този слой, което може да бъде много удобно, защото можем да ги движим и въртим отделно.

Анимацията е лесна: Цветовете.



Но не се нуждаем от това тук. Искам нещо друго.

Стъпка 7

Искам да имам всички маски на един слой, и то не 4, а 20.

И separateLayers го задаваме на false. Запазвам, отивам отново на Play, ...

Анимацията лесно направена: Цветовете

... и сега имаме всички 20 маски на един слой.

Разграфявам ги от 1 до 20 и натискам Ctrl+C или cmd+C. След това изтривам оригиналната маска и поставям всички тези на тяхно място тук.

Сега всички са там и бих искал да ги анимирам в следващата стъпка.

Анимацията лесно направо: Цветовете

Стъпка 8

За съжаление, маските нямат трансформационни свойства като въртене и мащабиране, а само масков път. Но това също не е проблем.

Маркираме всички маски и ги разгъваме. След това натискаме върху масков път, поставяме ключов кадър и след това отиваме малко по-напред в композицията, където вързваме всички маски директно надолу извън изображението.

Анимацията лесно се прави: Цветовете.

Стъпка 9

Нека видим. Музиката звучи в дъното, става. И вече имаме двойни ключови кадрове, което не е особено интересно.

Бих искал да бъде малко по-забавно и да не работим с линейни ключови кадрове, защото вече чухме за правилата на Дисни: константната скорост не се случва в реалния живот, следователно нямаме нужда от нея в анимацията.

Анимация лесно направена: Цветовете

Стъпка 10

За целта кликваме върху Editor на диаграми. Тук ще видите кривите, които точно ще се научим при bouncing ball.

За да ограничим това до масковите пътища, маркираме всички маски и натискаме U, защото по този начин получавам всички анимирани свойства.

Анимацията става лесно: Цветовете

Тук вече виждаме кривата на скоростта, скоростният график. Не можем да работим толкова удобно с него, както с кривата на стойността, това ще видим после. Но можем да работим добре с него, ако искаме да анимираме много свойства едновременно.

За сега бих искал да добавя едно Easy Ease, или с F9 или с този бутон.

С това графикът се екстремно промени. Тази лява част би била константна скорост, стартираме с определена скорост и внезапно спираме.

С Easy Ease скоростта ни се покачва от нула бавно и след това пак намаля. Това е подобно на параболична форма.

Анимацията е лесна: цветовете

Бих искал да направя това още по-екстремно. За целта взимам тангентата и я издърпвам малко, така че истински да има върху средата.

Такова нещо, ще видим как изглежда ...

Анимация на лека ръка: Цветовете



Ще го пусна и ще видя: То отива веднага нагоре. В средата имаме много по-бързо движение, отколкото в началото и в края. Това ми харесва.

Стъпка 11

Това можехме да го направим и с позицията - защо обаче направихме слисовете?

Сега го придвижете красиво неравномерно във времето и подредете ключовите кадрове тук по случаен начин, така че да получим и малко разнообразие във формата на разкриване. Линиите не трябва всички да бъдат изпращани едновременно.

Това изглежда като силует на град. Тази една линия, която обикновено би разделила нашето изображение, искаме да я разцепим. Понякога това трябва да се направи само от едната страна или само отпред или само отзад. Опитвам се да избегна, че те завършват на една и съща височина.

Изглежда добре.

Анимацията лесна за направа: Цветовете

И виждате, когато активирате прегледа - изглежда страхотно. Фантастично.

Анимацията е лесна: Цветовете

Стъпка 12

И сега можем да вземем този слой, да го завъртим, да го скалираме, да го преместим и разбира се да го използваме повече, защото това е просто ефектът на объркване.

Дублираме го, преместваме го във времето и превключваме от жълто на синьо и от синьо на жълто.

Анимацията лесно направена: Цветовете.



В този случай това вече е показано преди и после не е. Трябва да обърнем това, защото искам да нямаме слой в началото и слоя да се измести натам.

Така че пак изтривам дублирания слой и активирам слоя "Промяна на цветовете". След това маркираме всички ключови рамки, като поставим правоъгълник над тях.

С щракване с десния бутон на мишката преминавам през помощника за ключови рамки и накрая отдолу намирам обърнете реда на ключовите рамки.

Анимацията е лесна: Цветовете

Току-що натиснах това и сега жълтото се движи отдолу към синьото.

И сега вече трябва да работи, ако отново дублирам слоя и го преместя малко по-назад.

Сега преминаваме от един цвят към друг и отново назад. Перфектно.

Анимацията лесно направена: Цветовете



Това вече работи. Нашето следващо предизвикателство в следващата част от този сериал с уроци ще бъде текстът.