Речі, які потрібно знати, щоб створити щось подібне в After Effects:
Як скласти проект та композиції
Коли ви запускаєте AE, ви можете натиснути, Cmd+Nщоб створити новий Проект з однією композицією всередині нього.
Якщо у вас вже відкритий проект, натискання Cmd+Nстворює лише новий склад.
У цьому проекті я використав 2 композиції. GUIcomp для влаштування графічного інтерфейсу та його анімації. iphonecomp, щоб утримувати обидва, фон і GUIкомп.
Друга композиція з анімацією GUI повинна бути того ж розміру, що і екран, або принаймні мати однакове співвідношення сторін. Пізніше, коли ви збираєтесь розмістити його на екрані, воно може розтягнутися і виглядати дивно, якщо співвідношення сторін вимкнено.
Імпорт зображень до AE
After Effects має досить гарну систему для імпорту файлів .psd, але я не люблю її використовувати, тому що якщо ви неправильно перенесите, перемістіть або перейменуєте файл .psd, після ефектів його неможливо знайти, і вам доведеться замінювати кадри для кожного шар окремо.
Якщо ви імпортуєте папку зображень у проекти, а ви, наприклад. перейменуйте папку зображень, вам потрібно буде замінити лише один кадр із зображеннями, і всі відсутні зображення відновлюються (Поки всі пропущені зображення існують в одній папці). Крім того, таким чином виникає менше безладу.
Як імпортувати зображення в проект
Клацніть правою кнопкою миші всередині панелі проекту ліворуч виберіть: Import > Multiple files
... або ви можете просто перетягнути файли на цю панель
Я використовував скибочку, щоб експортувати свої зображення з фотошопу.
Які об’єкти слід зберегти як окремі файли зображень
По суті, ви хочете зберегти всі рухомі об'єкти окремо. Також вам може знадобитися зберегти кілька статичних об'єктів окремо.
У цьому проекті я потенційно міг би зберегти заголовок і нижній колонтитул як одне ціле, але заголовок мав тінь, що переходить на першу кнопку, тому мені довелося зберігати їх окремо.
Ось розбивка того, як я зберігав свої файли зображень у фотошопі перед тим, як імпортувати їх в AE.
Анімація 101
Анімація позиції:
- Анімація позиції:
- Виберіть об'єкт у списку зліва від часової шкали.
- Натисніть P
- Клацніть піктограму секундоміра, яка зараз знаходиться нижче вибраного шару. Це автоматично додає перший ключовий кадр, де коли-небудь ваш показник часу (це червона лінія на часовій шкалі).
- перемістити індикатор часу вперед на часовій шкалі. Перетягніть або Cmd+{Arrow left or right}абоCmd+Shift+{Arrow left or right}
- у переглядачі композиції перетягніть об’єкт у положення, де ви хочете, щоб він перемістився (Ви також можете використовувати Shift+arrow keys, як у Photoshop Або, перетягуючи числові значення.).
- Ще один ключовий кадр з’являється на часовій шкалі, і тепер у вас є анімація.
- Ви можете відтворити анімацію, натиснувши space
Наведіть ключові кадри ближче до інших, щоб пришвидшити анімацію або далі один від одного, щоб уповільнити її.
Продовження анімації після паузи.
сценарій: Ви анімували щось від A до B і хочете зробити паузу на X кількість мілісекунд, а потім перейти з B до C.
Коли ви анімували B, перейдіть вперед на часовій шкалі і натисніть значок ключового кадру зліва, тут: 
Це повинно виглядати сірим, тому не хвилюйтеся. Це просто означає, що в цій позиції немає ключових кадрів
Оскільки ключовий кадр №2 та новостворений ключовий кадр №3 перетворення мають однакові значення, тепер між цими двома ключовими кадрами є пауза. Потім ви можете продовжувати нормальну анімацію, рухаючись вперед за часовою шкалою і знову змінюючи значення.
Анімація інших речей, наприклад обертання чи непрозорість
Я просто хотів використати цей час, щоб сказати вам, що всі вони працюють так само, як анімаційні позиції (... мінус перетягування).
Просто використовуйте повзунки з цифрами, які відображаються, коли ви натискаєте гарячі клавіші нижче.
Клавіші швидкого доступу для різних методів перетворення:
- P - Позиція
- T - Непрозорість
- R - Обертання
- S - Шкала
- A - Точка прив’язки
Просто виберіть об'єкти та натисніть один із цих гарячих клавіш і почніть анімацію. Якщо ви нічого не вибрали, він виявить методи перетворення для кожного об'єкта в комп.
Як підпорядкувати об'єкти іншим об'єктам
На панелі Comp ви помітите батьківський випадаючий список на кожному об'єкті.
Ви можете використовувати його для визначення батьківського об'єкта.
Якщо потім перемістити Батько, ви помітите, що елемент "Дочір" зараз переміщується з ним. Те саме стосується анімації, яку ви додаєте до елемента "Батьків".
Якщо ви оживляєте батьківський об'єкт, який обертається, дитина піде за ...
Додавання еластичності анімації
Тож, можливо, ви помітили, що анімаційна кнопка не зупиняється на стіні, натомість вона зупиняється дуже еластично.
Після цього Ефекти Експреси можуть бути використані для досягнення цього (Це також може зробити набагато більше).
Щоб застосувати сценарій Expression до анімації, Alt+{mouse click}секундомір та вставити в сценарій.
Вираз, який я використовував у своїй анімаційній кнопці
Перші 3 змінних amp, freq, decayможна редагувати, щоб отримати різні результати з неї.
Ви можете застосувати цей самий сценарій до анімації на основі руху. Наприклад, анімація непрозорості не впливає.
Також їх можна знайти тут.
amp = .1;
freq = 1.0;
decay = 9.0;
n = 0;
if (numKeys > 0){
n = nearestKey(time).index;
if (key(n).time > time){
n--;
}}
if (n == 0){ t = 0;
}else{
t = time - key(n).time;
}
if (n > 0){
v = velocityAtTime(key(n).time - thisComp.frameDuration/10);
value + v*amp*Math.sin(freq*t*2*Math.PI)/Math.exp(decay*t);
}else{value}
Полегшення ....
Отже, це ще одна річ, яка може зробити анімацію набагато менш лінійною, як і сценарій Expression вище.
Я використовував Ease Ease у тому "колі дотику дотику", щоб він виглядав трохи більш людським, як рух.
Ви можете вибрати одну або кілька кадрів ключових слів і клацнути правою кнопкою миші одну з них.
Потім зі списку: Keyframe assistant > Easy Ease
Я часто використовую Easy easy, бо я лінивий ...
Фото чи не сталося ...
Ось проста анімація позицій, що демонструє, як ослаблення та цей конкретний сценарій вираження можуть мати величезний вплив на анімацію.
Розміщення анімаційних компа / кадри на екран
Тож після того, як графічний інтерфейс буде анімований, прийшов час розмістити його на екрані пристрою.
- Розмістіть комп’ютер із графічним інтерфейсом всередині iPhone comp, як і ви розміщуєте зображення всередині композиції.
- Двічі клацніть на комп’ютері iPhone на панелі Проект
- Виберіть GUI comp
- З верхнього меню
Effects > Distort > Corner pin
- Потім просто перетягніть кожен кут відповідно до кутів екрану пристрою.
Експорт до .gif
AE не має рідного методу для цього, але не хвилюйтеся, є способи.
Я вважаю за краще це робити:
- Клацніть композицію в
Projects panel
Composition > Add to render queue Cmd+Ctrl+M- Тоді внизу, де зазвичай сидить часова шкала, ви вибираєте, що експортувати і де.
- Я зазвичай експортую .mov без втрат
- Якщо натиснути "Налаштування візуалізації", ви можете обрати кадр, інакше він використовуватиме Comp framerate
- Потім просто натисніть візуалізацію у верхньому правому куті або на цій панелі.
- Знайдіть експортований файл і відкрийте його у фотошопі.
- Зберегти для Інтернету Cmd+Shift+Alt+S
Чесно кажучи, не так вже й погано ...
Експорт у відеофайл
Тож навіть якщо вищевказаний метод показує, як експортувати файл без втрат, це не спосіб експортувати відеофайли.
Ви робите це так:
- Збережіть файл свого проекту.
- Клацніть на композицію
Projects panel(якщо у вас є більше)
Composition > Add to adobe media encoder queue Cmd+Alt+M- Перетягніть попереднє налаштування з правого стовпця в лівий
- Натисніть відтворити.
- Якщо ви не вибрали папку експорту, за замовчуванням вона знаходиться прямо поруч із файлом проекту.
Як замінити кадри
Так AE не може знайти ваші файли? Зробити це:
- Клацніть правою кнопкою миші один із відсутніх кадрів на панелі "Проект"
- Із списку
Replace footage > File...
- Знайдіть свої кадри та речі
Інші корисні гарячі клавіші
- U- Виявляє всі використані ключові кадри у комп (якщо у вас нічого не вибрано). Дійсно корисно, наприклад, якщо вам потрібно перемістити відразу кілька ключових кадрів, наприклад.
- U( Двічі торкніться ) - виявляє все, що було змінено.
- E( Двічі торкніться ) - виявляє всі використані вирази.
- J - Переходить до попереднього ключового кадру.
- K - Переходить до наступного ключового кадру.
- space - Відтворює комп
- Iабо homeклавіша - переміщує індикатор поточного часу на початок на шкалі часу.
- Cmd+K - Поточні настройки композиції.
- Cmd+I - Імпорт файлів.
- Alt+{Arrow keys left and right} - Виберіть ключові кадри та натисніть гарячі клавіші, щоб перемістити їх.
- Alt+Shift+{Arrow keys left and right} - Виберіть ключові кадри та натисніть гарячі клавіші, щоб перемістити їх.
Файли проекту можна знайти here.
