Перш ніж ми розглянемо нашу першу анімацію, Bouncing Ball, я хочу спробувати технічний виклик: текст має ретельно накреслити себе, ніби текст було написано вручну. Fig Leaf Rag має прекрасне введення з акцентом в кінці, де ми розмістимо крапку з оклику.
Існує кілька методів, які можуть бути більш-менш добрими, в залежності від ситуації. Оскільки я працюю з графічним планшетом, я нарисую текст і покажу вам, як анімувати. Проте перед цим я хочу показати вам, як це можна зробити інакше, але це не мій фаворит:
Кроки 1–10
Крок 1
Я хочу зняти текстовий шар і вмістити замість нього складовий шар, звичайний піксельний шар, на якому я можу малювати. Текст повинен бути всередині шару. Тож я створюю підсумісну композицію за допомогою Strg+Shift+C або через Шар>Створити підсумісну композицію. Я називаю це "Typo_Intro".
Крок 2
Всі атрибути були взяті, включаючи Turbulentes Versetzen.
Оскільки я цього не хочу, я клікаю на Turbulentes Versetzen, натискаю Strg+X і вставляю це в композицію вище ("Fig Leaf Rag").
Крок 3
Повертаємось до композиції "Typo_Intro". Тут ми відкрили текст і можемо анімувати все це.
Перша опція - через Лінії. Я використовую Інструмент "Олівець" і проводжу першу лінію літери A по тексту. Потім відводжу і клікаю з натиснутою Strg- клавішею десь на чорному тлі, щоб завершити поточний шлях, перед тим як нарисувати другу лінію літери A.
Я знову відводжу, клікаю з натиснутою Strg- клавішею на чорному тлі, і тоді рисую наступну лінію і так далі, поки весь текст не буде накреслений.
Крок 4
Тепер я застосовую на ньому ефект. Ми знаходимо його як Контур у версії CC в Створення. До CS6 він називався Ефект контура.
Тут ми вибираємо маску або ставимо позначку Усі маски та можемо робити ці маски робити.
Крок 5
Я приховую маски за допомогою цього маленького символу і фарбую Шлях червоним. Я також можу змінити Розмір, але це можливо тільки глобально для всіх масок.
І, якщо я знову виведу маски, я можу ще змінювати і адаптувати окремі точки, щоб вони прикривали весь білий текст під ним.
Крок 6
Зручність полягає в наявності слайдерів Початок- та Кінець-: Я тягну слайдер від початку до кінця і можу таким чином накреслити весь текст.
Це працює дуже добре, але у вас немає повного контролю. Наприклад, ви повинні завжди використовувати ту саму товщину лінії, тобто ви не можете намалювати тонше або товще.
Тому я хотів би вам ще показати інший метод, який, на мою думку, трохи швидше, ніж все малювати окремо ...
Крок 7
У цьому випадку я віддаю перевагу трохи швидшому методу з допомогою Пензель.
Застосовувати цей Пензель можна на текстових шарах. Тому ми знову повинні створити Підкомпозицію і назвемо її "Typo_Statisch". У цій Підкомпозиції ми можемо працювати відразу.
Крок 8
Як тільки ми хочемо працювати з Пензлем і двічі клацаємо в режимі Пензель, відкривається вкладка Шари, де ми й можемо малювати з Пензлем.
Тут також з'явилося дві нові панелі: Пензель і Малювання. У полі управління Пензлем ми можемо налаштувати розмір, жорсткість тощо.
А в полі управління Малювання можемо вибрати спосіб малювання. Почніть зі значення Константа, але я змінюю його на Анімувати малювання.
Я проводжу лінію і ще одну, і ще одну - але як тільки я завершую лінію, вона дивно зникає.
Крок 9
Коли я повертаюся на інший вікно та прокручую по тимелайну, я бачу, що всі лінії там є і всі автоматично малюються.
Крок 10
Якщо натиснути UU для всіх змінених властивостей, то ми отримаємо тут багато підвластивостей.
Для кожної окремо також показуються початок і кінець.
Крім того, ми можемо змінити окремо відстань, жорсткість та навіть позицію кожної лінії - навіть після її намалювання.
Продовжуйте рухатися далі: Кроки 11–20
Крок 11
Я ще раз видаляю все, щоб мати кращий огляд.
Я знову малюю нову лінію, і коли ви в режимі шарів, ви бачите шлях. Це те, що зберігається.
Якщо скажімо, малюнок лінії мені не подобається, я можу його промалювати ще раз, вибравши його, а потім просто заново намалювати. Він оновлюється і просто перезаписується.
Крок 12
Точно також я хочу створити малюнок тексту, бо це найшвидший спосіб анімувати таке.
Тому я зменшую свій діаметр і, використовуючи графічний планшет, просто малюю текст тут.
Крок 13
Я намалював всі лінії, і коли ми відтворюємо все це по тимелайну, ми бачимо, що все є на місці.
Якщо я натискаю U, у нас є всі ключові кадри знову.
Крок 14
Якщо я натискаю клавішу Ü, вікно, над яким зараз веде миша, максимізується. У цьому випадку це тимелайн. Так я маю більше місця й краще бачу виділяючіся елементи. Я трохи віддалив їх, щоб всі мали приблизно однакову тривалість.
Крок 15
Давайте це відтворимо.
До речі: Якщо ви помилилися й натиснули клавішу Caps Lock, тоді After Effects не оновлюється. Ви отримаєте підказку «Вимкніть Caps Lock, щоб оновити вигляд».
Якщо ми зараз запустимо це, After Effects оновить усі літери одночасно. Але має розпочати з переднього кінця і проходити далі. І саме в цьому суть. Щоб це врегулювати так, як я хочу, мені доведеться синхронізувати все вручну - одна лінія за іншою. Це величезна праця. Я хочу це зробити швидше.
У наступному кроці я поясню, як саме - але перед цим ми виділимо всі лінії.
Крок 16
Тому я використовую скрипт для послідовного встановлення цих ключових кадрів.
Цей скрипт я написав сам і, звісно, дав його вам. Ви знайдете його в папці скрипти під назвою Sequence strokes. Ті, хто знає фільм "Послідовне робота з шарами в After Effects", можуть приблизно уявити, що робить цей скрипт.
Я відкриваю цей скрипт в Extend Script і запускаю його.
Крок 17
Тепер у нас, фактично, є сходинки з ключових кадрів, і текст крок за кроком малюється. Проте все ще надто повільно.
На це потрібно покращення. Для цього ми вибираємо все, беремо останній ключовий кадр, який ми знаходимо, натискаємо клавішу Alt- та притягуємо його на 5 секунд.
Після цього відтворення відбувається набагато швидше.
Останню точку треба трохи затримати, але про це ми піклуємося одразу.
Крок 18
Я хотів би також поговорити про значення зсуву offset-. Він впливає на переходи ключових кадрів:
Якщо ми зараз дивимося на переходи ключових кадрів, то наступний завжди починається точно там, де закінчується попередній (a).
Якщо я цього не хочу, і наприклад хочу мати два кадри паузи між двома лініями, тоді я вводжу 2 в offset.
Звичайно, мені потрібно знову вибрати всі щітки, перш ніж активувати цей скрипт. За допомогою Ctrl+A я можу вибрати всі одразу.
Або я хочу, щоб кадри перекривалися, то я встановлюю значення -2 в offset. Тоді він завжди буде відстаючим на два кадри назад від фактичного. Однак якщо ми так швидко скоротили час, як у цьому випадку, то це не має сенсу. Я задоволений тим, як це зараз працює, і залишаю це на значенні 2.
Крок 19
Одне з того, що я хочу змінити, це момент виразного знака. Я хочу краще вписати його під музику.
Саме тому мені потрібна музика у композиції. Тож я переходжу до вкладки "Fig Leaf Rag" і копіюю файл.
Потім, можливо, використовую Alt- клік, щоб повернутися до композиції та вставити її сюди.
Крок 20
Тепер ми дивимося, де знаходяться ті дві позиції, які нам потрібні. Для цього я використовую Num-Pad і натискаю клавішу Кома-, щоб створити попередній перегляд. Знак зірочки * на Num-Pad натискаю, щоб встановити маркер. На пристроях без Num-Pad, передусім на Mac, це буде cmd+Кома для попереднього перегляду і cmd+8 для маркера.
Тепер я відтворюю музику і встановлюю маркери точно на тих місцях, де мають бути прочерк і крапка виразного знака (1). А саме, точно на двох акцентах мелодії.
Отже, я встановив два маркери: перший - для завершення прочерку виразного знака, а другий - для встановлення крапки.
Я встановлюю допоміжну лінію на перший маркер і переходжу до композиції "Typo_Statisch". Там я переміщаю той кадр на допоміжну лінію, який позначає лінію виразного знака (2).
Те саме я роблю з другим маркером, який вказує позицію для крапки: я встановлюю допоміжну лінію на маркер і перемикаюся до композиції, переміщуючи кадр відповідно.
