Курс Моушн-дизайн в After Effects: Від новачка до першого відеоролика

Що ви зможете робити в After Effects

• Анімувати об’єкти за ключовими кадрами й налаштовувати рух графіками швидкості
• Розбивати макети з Illustrator і Photoshop на окремі шари та шейпи для анімації
• Пришвидшувати рутинні операції скриптами (Duik, Motion 2, Stagger Selected Layers, Paste Keyframes) і виразами на JavaScript
• Будувати переходи між сценами — через ефекти, маски, масштаб і позицію шарів
• Анімувати текст по буквах, через маски і за заданим шляхом
• Збирати об’ємні об’єкти з плоских фігур і анімувати рух камери навколо них

Кому підійде курс

Курс не вчить малюванню та створенню ілюстрацій — готові макети і векторні сцени потрібно взяти готовими або знайти художника.

Як проходить навчання

• Майже кожна тема закривається власним практичним завданням — Прийоми закріплюються одразу, а не залишаються в теорії
• Робота ведеться в англомовному інтерфейсі After Effects — Менше збоїв і зниклих ефектів, на які страждає російська локалізація
• Фінальний проєкт курсу — ролик з кількох сюжетних сцен із переходами між ними — Готова робота для портфоліо, а не навчальний приклад
• Рутинні операції показані через скрипти та вирази на JavaScript — Робота пришвидшується без порядкового програмування
• У курс вбудована бібліотека готових футажів і звукових ефектів — Не доводиться шукати вихідники для власних проєктів окремо

Що знадобиться

• Adobe After Effects — основна програма курсу
• Adobe Photoshop і Adobe Media Encoder — підготовка макетів і фінальний рендер
• Скрипти та плагіни для After Effects: Duik, Motion 2, PtShiftLayers, Stagger Selected Layers, Paste Keyframes

Чому самостійно зазвичай не виходить

Самостійне освоєння After Effects зазвичай впирається в рутину: одне й те саме розставляння ключових кадрів, вирівнювання якорних точок і налаштування швидкості руху забирають години там, де готовий прийом закриває завдання за пару кліків.

Без розбору скриптів і виразів анімація кожного нового об’єкта — тремтливе листя, літери тексту чи кнопки інтерфейсу — робиться заново вручну, хоча той самий рух можна один раз описати виразом і застосувати одразу до всіх елементів.

Ще одна часта причина застрягти — російська локалізація After Effects, у якій зникає частина ефектів і частіше трапляються збої, через що повторити навчальні приклади вдається не завжди.

Що зміниться

Як влаштований шлях

1. Основи After Effects Інтерфейс програми, робота з шейпами, ключові кадри, графіки швидкості, маски та прекомпозиції — на прикладах простих сцен.
2. Морфінг, скрипти та вирази Ефектори і перетворення однієї форми на іншу, підготовка файлів з Illustrator, пришвидшення роботи скриптами та виразами на JavaScript.
3. Переходи, текст, інтерфейси і 3D Збирання переходів між сценами, анімація тексту по буквах, робота з макетами застосунків у PSD, видавлювання об’єктів у 3D і рух камери.
4. Фінальний проєкт Продавальний ролик із кількох сюжетних сцен з переходами — курс завершується його збиранням від підготовки файлів до експорту готового відео.

Програма курсу

207 уроків · 9 модулів · плюс бібліотека готових футажів і звукових ефектів для практики

• Бібліотека футажів і звуку для готових проєктів 136 уроків

  Розділ збирає матеріали Daruma Audio (ліцензія CC BY) — кліки, свисти, монети, годинник, папір, іконки, дані та музику — для використання у власних анімаціях, окремо від покрокових уроків.

  • Звуки будильника 2 уроки

    Готові звукові ефекти будильника для сцен із сигналом чи тривогою.

    • alarm_1

      Урок присвячений звуковому ефекту «alarm_1» — сигналу тривоги з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • alarm_2

      Урок присвячений звуковому ефекту «alarm_2» — ще одному варіанту сигналу тривоги з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

  • Звуки дзвіночків 2 уроки

    Звукові ефекти дзвіночків для сповіщень і переходів.

    • bells_01

      Урок присвячений звуковому ефекту «bells_01» — звуку дзвіночків з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • bells_02

      Урок присвячений звуковому ефекту «bells_02» — ще одному варіанту звуку дзвіночків з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

  • Звук падіння книги 2 уроки

    Звукові ефекти падіння та удару книги для сцен із предметами.

    • book_drop_01

      Урок присвячений звуковому ефекту «book_drop_01» — звуку падіння книги з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • book_drop_02

      Урок присвячений звуковому ефекту «book_drop_02» — ще одному варіанту звуку падіння книги з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

  • Звуки курантів 2 уроки

    Звукові ефекти курантів і передзвону для сцен із годинником і сповіщеннями.

    • chimes_01

      Урок присвячений звуковому ефекту «chimes_01» — звуку передзвону з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • chimes_02

      Урок присвячений звуковому ефекту «chimes_02» — ще одному варіанту звуку передзвону з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

  • Барабанні кліки 8 уроків

    Звукові ефекти кліків у стилі біт-боксу для ритмічних переходів і появ елементів.

    • bb_click_01

      Урок присвячений звуковому ефекту «bb_click_01» — барабанному кліку з групи BeatBox бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • bb_click_02

      Урок присвячений звуковому ефекту «bb_click_02» — ще одному варіанту барабанного кліку з тієї самої групи BeatBox, який застосовується для озвучення анімації в After Effects.

    • bb_click_03

      Урок присвячений звуковому ефекту «bb_click_03» — ще одному варіанту барабанного кліку з тієї самої групи BeatBox, який застосовується для озвучення анімації в After Effects.

    • bb_click_04

      Урок присвячений звуковому ефекту «bb_click_04» — ще одному варіанту барабанного кліку з тієї самої групи BeatBox, який застосовується для озвучення анімації в After Effects.

    • bb_click_05

      Урок присвячений звуковому ефекту «bb_click_05» — ще одному варіанту барабанного кліку з тієї самої групи BeatBox, який застосовується для озвучення анімації в After Effects.

    • bb_click_06

      Урок присвячений звуковому ефекту «bb_click_06» — ще одному варіанту барабанного кліку з тієї самої групи BeatBox, який застосовується для озвучення анімації в After Effects.

    • bb_click_07

      Урок присвячений звуковому ефекту «bb_click_07» — ще одному варіанту барабанного кліку з тієї самої групи BeatBox, який застосовується для озвучення анімації в After Effects.

    • bb_click_08

      Урок присвячений звуковому ефекту «bb_click_08» — ще одному варіанту барабанного кліку з тієї самої групи BeatBox, який застосовується для озвучення анімації в After Effects.

  • Цифрові кліки 17 уроків

    Набір звуків натискання для анімації інтерфейсів, кнопок і цифрових екранів.

    • dig_click_01

      Урок присвячений звуковому ефекту «dig_click_01» — цифровому кліку з групи Digital бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • dig_click_02

      Урок присвячений звуковому ефекту «dig_click_02» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_03

      Урок присвячений звуковому ефекту «dig_click_03» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_04

      Урок присвячений звуковому ефекту «dig_click_04» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_05

      Урок присвячений звуковому ефекту «dig_click_05» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_06

      Урок присвячений звуковому ефекту «dig_click_06» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_07

      Урок присвячений звуковому ефекту «dig_click_07» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_08

      Урок присвячений звуковому ефекту «dig_click_08» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_09

      Урок присвячений звуковому ефекту «dig_click_09» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_10

      Урок присвячений звуковому ефекту «dig_click_10» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_11

      Урок присвячений звуковому ефекту «dig_click_11» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_12

      Урок присвячений звуковому ефекту «dig_click_12» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_13

      Урок присвячений звуковому ефекту «dig_click_13» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_14

      Урок присвячений звуковому ефекту «dig_click_14» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_15

      Урок присвячений звуковому ефекту «dig_click_15» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_16

      Урок присвячений звуковому ефекту «dig_click_16» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_click_17

      Урок присвячений звуковому ефекту «dig_click_17» — ще одному варіанту цифрового кліку з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

  • Кліки мишею 8 уроків

    Звукові ефекти клацання миші для сцен із курсором та інтерфейсами.

    • mouse_click_01

      Урок присвячений звуковому ефекту «mouse_click_01» — кліку комп’ютерної миші з групи Mouse бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • mouse_click_02

      Урок присвячений звуковому ефекту «mouse_click_02» — ще одному варіанту кліку комп’ютерної миші з тієї самої групи Mouse, який застосовується для озвучення анімації в After Effects.

    • mouse_click_03

      Урок присвячений звуковому ефекту «mouse_click_03» — ще одному варіанту кліку комп’ютерної миші з тієї самої групи Mouse, який застосовується для озвучення анімації в After Effects.

    • mouse_click_04

      Урок присвячений звуковому ефекту «mouse_click_04» — ще одному варіанту кліку комп’ютерної миші з тієї самої групи Mouse, який застосовується для озвучення анімації в After Effects.

    • mouse_click_05

      Урок присвячений звуковому ефекту «mouse_click_05» — ще одному варіанту кліку комп’ютерної миші з тієї самої групи Mouse, який застосовується для озвучення анімації в After Effects.

    • mouse_click_06

      Урок присвячений звуковому ефекту «mouse_click_06» — ще одному варіанту кліку комп’ютерної миші з тієї самої групи Mouse, який застосовується для озвучення анімації в After Effects.

    • mouse_click_07

      Урок присвячений звуковому ефекту «mouse_click_07» — ще одному варіанту кліку комп’ютерної миші з тієї самої групи Mouse, який застосовується для озвучення анімації в After Effects.

    • mouse_click_08

      Урок присвячений звуковому ефекту «mouse_click_08» — ще одному варіанту кліку комп’ютерної миші з тієї самої групи Mouse, який застосовується для озвучення анімації в After Effects.

  • Хлопки і клацання 2 уроки

    Звукові ефекти хлопка й клацання для акцентів в анімації.

    • clop

      Урок присвячений звуковому ефекту «clop» — ляскоту з групи Pop бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • pop

      Урок присвячений звуковому ефекту «pop» — ще одному ляскоту з тієї самої групи Pop, який застосовується для озвучення анімації в After Effects.

  • Звук цокання годинника 1 урок

    Звуковий ефект цокання годинника для сцен з очікуванням або відліком часу.

    • clock_01

      Урок присвячений звуковому ефекту «clock_01» — цоканню годинника з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

  • Звуки монет 6 уроків

    Звукові ефекти падіння і дзвону монет для сцен з оплатою чи нагородою.

    • coin_01

      Урок присвячений звуковому ефекту «coin_01» — звуку монети з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • coin_02

      Урок присвячений звуковому ефекту «coin_02» — ще одному варіанту звуку монети з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • coin_03

      Урок присвячений звуковому ефекту «coin_03» — ще одному варіанту звуку монети з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • coin_04

      Урок присвячений звуковому ефекту «coin_04» — ще одному варіанту звуку монети з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • coins_drops_01

      Урок присвячений звуковому ефекту «coins_drops_01» — звуку падіння монет з тієї самої бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • coins_drops_02

      Урок присвячений звуковому ефекту «coins_drops_02» — ще одному варіанту звуку падіння монет з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

  • Звуки передавання даних 8 уроків

    Звукові ефекти для сцен із завантаженням, обробкою і передаванням даних.

    • data_01

      Урок присвячений звуковому ефекту «data_01» — звуку передавання даних з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • data_02

      Урок присвячений звуковому ефекту «data_02» — ще одному варіанту звуку передавання даних з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • data_03

      Урок присвячений звуковому ефекту «data_03» — ще одному варіанту звуку передавання даних з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • data_04

      Урок присвячений звуковому ефекту «data_04» — ще одному варіанту звуку передавання даних з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • data_05

      Урок присвячений звуковому ефекту «data_05» — ще одному варіанту звуку передавання даних з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • data_06

      Урок присвячений звуковому ефекту «data_06» — ще одному варіанту звуку передавання даних з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • data_07

      Урок присвячений звуковому ефекту «data_07» — ще одному варіанту звуку передавання даних з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • data_08

      Урок присвячений звуковому ефекту «data_08» — ще одному варіанту звуку передавання даних з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

  • Звуки для іконок, частина 1 7 уроків

    Звукові ефекти появи та натискання іконок інтерфейсу.

    • icon_01

      Урок присвячений звуковому ефекту «icon_01» — звуку появи іконки з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • icon_02

      Урок присвячений звуковому ефекту «icon_02» — ще одному варіанту звуку появи іконки з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • icon_03

      Урок присвячений звуковому ефекту «icon_03» — ще одному варіанту звуку появи іконки з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • icon_04

      Урок присвячений звуковому ефекту «icon_04» — ще одному варіанту звуку появи іконки з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • icon_05

      Урок присвячений звуковому ефекту «icon_05» — ще одному варіанту звуку появи іконки з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • icon_06

      Урок присвячений звуковому ефекту «icon_06» — ще одному варіанту звуку появи іконки з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • icon_07

      Урок присвячений звуковому ефекту «icon_07» — ще одному варіанту звуку появи іконки з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

  • Звуки для іконок, частина 2 7 уроків

    Продовження набору звукових ефектів для іконок інтерфейсу.

    • icon_08

      Урок присвячений звуковому ефекту «icon_08» — ще одному варіанту звуку появи іконки з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • icon_09

      Урок присвячений звуковому ефекту «icon_09» — ще одному варіанту звуку появи іконки з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • icon_10

      Урок присвячений звуковому ефекту «icon_10» — ще одному варіанту звуку появи іконки з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • icon_11

      Урок присвячений звуковому ефекту «icon_11» — ще одному варіанту звуку появи іконки з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • icon_13

      Урок присвячений звуковому ефекту «icon_13» — ще одному варіанту звуку появи іконки з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • icon_14

      Урок присвячений звуковому ефекту «icon_14» — ще одному варіанту звуку появи іконки з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • icon_15

      Урок присвячений звуковому ефекту «icon_15» — ще одному варіанту звуку появи іконки з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

  • Звуки клавіатури 2 уроки

    Звукові ефекти натискання клавіш для сцен з набором тексту.

    • keyboard_01

      Урок присвячений звуковому ефекту «keyboard_01» — звуку натискання клавіші з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • keyboard_02

      Урок присвячений звуковому ефекту «keyboard_02» — ще одному варіанту звуку натискання клавіші з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

  • Фонова музика 6 уроків

    Готові музичні треки різного настрою — від корпоративного до грайливого — для фонової доріжки ролика.

    • Daruma Audio – Corporate Motivation

      Урок присвячений аудіотреку «Daruma Audio – Corporate Motivation» з бібліотеки Daruma Audio (CC BY), який використовується як музичний супровід анімаційного проєкту в After Effects.

    • Daruma Audio – Corporate Rock

      Урок присвячений аудіотреку «Daruma Audio – Corporate Rock» з тієї самої бібліотеки Daruma Audio (CC BY), який використовується як музичний супровід анімаційного проєкту в After Effects.

    • Daruma Audio – Fun Story

      Урок присвячений аудіотреку «Daruma Audio – Fun Story» з тієї самої бібліотеки Daruma Audio (CC BY), який використовується як музичний супровід анімаційного проєкту в After Effects.

    • Daruma Audio – Fun

      Урок присвячений аудіотреку «Daruma Audio – Fun» з тієї самої бібліотеки Daruma Audio (CC BY), який використовується як музичний супровід анімаційного проєкту в After Effects.

    • Daruma Audio – Inspiration

      Урок присвячений аудіотреку «Daruma Audio – Inspiration» з тієї самої бібліотеки Daruma Audio (CC BY), який використовується як музичний супровід анімаційного проєкту в After Effects.

    • Daruma Audio – Upbeat

      Урок присвячений аудіотреку «Daruma Audio – Upbeat» з тієї самої бібліотеки Daruma Audio (CC BY), який використовується як музичний супровід анімаційного проєкту в After Effects.

  • Звуки зминання і розривання паперу 4 уроки

    Звукові ефекти зминання і розривання паперу для сцен з документами та пакуванням.

    • crumple_paper_01

      Урок присвячений звуковому ефекту «crumple_paper_01» — зминанню паперу з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • crumple_paper_02

      Урок присвячений звуковому ефекту «crumple_paper_02» — ще одному варіанту зминання паперу з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • crumple_paper_03

      Урок присвячений звуковому ефекту «crumple_paper_03» — ще одному варіанту зминання паперу з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • tear_paper_01

      Урок присвячений звуковому ефекту «tear_paper_01» — розриву паперу з тієї самої бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

  • Звук перегортання листа 2 уроки

    Звуковий ефект перегортання окремого аркуша паперу.

    • flip_paper_01

      Урок присвячений звуковому ефекту «flip_paper_01» — перевертанню аркуша паперу з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • flip_paper_02

      Урок присвячений звуковому ефекту «flip_paper_02» — ще одному варіанту перевертання аркуша паперу з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

  • Звуки гортання книг і журналів 16 уроків

    Набір звукових ефектів гортання сторінок книг і журналів різного темпу.

    • turn.paper.album.01

      Урок присвячений звуковому ефекту «turn.paper.album.01» — перегортанню сторінок альбому з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • turn.paper.album.02

      Урок присвячений звуковому ефекту «turn.paper.album.02» — ще одному варіанту перегортання сторінок альбому з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • turn.paper.album.fast.03

      Урок присвячений звуковому ефекту «turn.paper.album.fast.03» — швидкому перегортанню сторінок альбому з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • turn.paper.album.fast.04

      Урок присвячений звуковому ефекту «turn.paper.album.fast.04» — ще одному варіанту швидкого перегортання сторінок альбому з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • turn.paper.album.fast.05

      Урок присвячений звуковому ефекту «turn.paper.album.fast.05» — ще одному варіанту швидкого перегортання сторінок альбому з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • turn.paper.big.01

      Урок присвячений звуковому ефекту «turn.paper.big.01» — перегортанню великого аркуша паперу з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • turn.paper.big.02

      Урок присвячений звуковому ефекту «turn.paper.big.02» — ще одному варіанту перегортання великого аркуша паперу з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • turn.paper.big.book.01

      Урок присвячений звуковому ефекту «turn.paper.big.book.01» — перегортанню великої книги з тієї самої бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • turn.paper.journal.creak.01

      Урок присвячений звуковому ефекту «turn.paper.journal.creak.01» — перегортанню журналу зі скрипом з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • turn.paper.journal.creak.02

      Урок присвячений звуковому ефекту «turn.paper.journal.creak.02» — ще одному варіанту перегортання журналу зі скрипом з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • turn.paper.journal.creak.03

      Урок присвячений звуковому ефекту «turn.paper.journal.creak.03» — ще одному варіанту перегортання журналу зі скрипом з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • turn.paper.journal.fast.01

      Урок присвячений звуковому ефекту «turn.paper.journal.fast.01» — швидкому перегортанню журналу з тієї самої бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • turn.paper.medium.book.02

      Урок присвячений звуковому ефекту «turn.paper.medium.book.02» — перегортанню книги середнього формату з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • turn.paper.small.01

      Урок присвячений звуковому ефекту «turn.paper.small.01» — перегортанню невеликого аркуша паперу з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • turn.paper.small.02

      Урок присвячений звуковому ефекту «turn.paper.small.02» — ще одному варіанту перегортання невеликого аркуша паперу з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • turn.paper.small.03

      Урок присвячений звуковому ефекту «turn.paper.small.03» — ще одному варіанту перегортання невеликого аркуша паперу з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

  • Звуки розгортання паперу великим планом 7 уроків

    Звукові ефекти розгортання аркуша паперу для сцен великим планом.

    • turn_big_paper_01

      Урок присвячений звуковому ефекту «turn_big_paper_01» — розгортанню великого аркуша паперу великим планом з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • turn_big_paper_02

      Урок присвячений звуковому ефекту «turn_big_paper_02» — ще одному варіанту розгортання великого аркуша паперу великим планом з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • turn_big_paper_03

      Урок присвячений звуковому ефекту «turn_big_paper_03» — ще одному варіанту розгортання великого аркуша паперу великим планом з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • turn_fast_paper_01

      Урок присвячений звуковому ефекту «turn_fast_paper_01» — швидкому розгортанню аркуша паперу великим планом з тієї самої бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • turn_fast_paper_02

      Урок присвячений звуковому ефекту «turn_fast_paper_02» — ще одному варіанту швидкого розгортання аркуша паперу великим планом з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • turn_fast_paper_03

      Урок присвячений звуковому ефекту «turn_fast_paper_03» — ще одному варіанту швидкого розгортання аркуша паперу великим планом з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

    • turn_small_paper_01

      Урок присвячений звуковому ефекту «turn_small_paper_01» — розгортанню невеликого аркуша паперу великим планом з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

  • Свист паперу 1 урок

    Звуковий ефект свисту від швидкого руху аркуша паперу.

    • whoosh_paper_01

      Урок присвячений звуковому ефекту «whoosh_paper_01» — свисту паперу з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

  • Свист великим планом 7 уроків

    Звукові ефекти свисту для великих і різких рухів у кадрі.

    • big_whoosh_01

      Урок присвячений звуковому ефекту «big_whoosh_01» — потужному свисту з групи Big бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • big_whoosh_02

      Урок присвячений звуковому ефекту «big_whoosh_02» — ще одному варіанту потужного свисту з тієї самої групи Big, який застосовується для озвучення анімації в After Effects.

    • big_whoosh_03

      Урок присвячений звуковому ефекту «big_whoosh_03» — ще одному варіанту потужного свисту з тієї самої групи Big, який застосовується для озвучення анімації в After Effects.

    • big_whoosh_04

      Урок присвячений звуковому ефекту «big_whoosh_04» — ще одному варіанту потужного свисту з тієї самої групи Big, який застосовується для озвучення анімації в After Effects.

    • big_whoosh_05

      Урок присвячений звуковому ефекту «big_whoosh_05» — ще одному варіанту потужного свисту з тієї самої групи Big, який застосовується для озвучення анімації в After Effects.

    • big_whoosh_06

      Урок присвячений звуковому ефекту «big_whoosh_06» — ще одному варіанту потужного свисту з тієї самої групи Big, який застосовується для озвучення анімації в After Effects.

    • big_whoosh_07

      Урок присвячений звуковому ефекту «big_whoosh_07» — ще одному варіанту потужного свисту з тієї самої групи Big, який застосовується для озвучення анімації в After Effects.

  • Цифровий свист 11 уроків

    Звукові ефекти свисту для сцен з інтерфейсами та цифровими переходами.

    • dig_whoosh_01

      Урок присвячений звуковому ефекту «dig_whoosh_01» — цифровому свисту з групи Digital бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • dig_whoosh_02

      Урок присвячений звуковому ефекту «dig_whoosh_02» — ще одному варіанту цифрового свисту з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_whoosh_03

      Урок присвячений звуковому ефекту «dig_whoosh_03» — ще одному варіанту цифрового свисту з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_whoosh_04

      Урок присвячений звуковому ефекту «dig_whoosh_04» — ще одному варіанту цифрового свисту з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_whoosh_05

      Урок присвячений звуковому ефекту «dig_whoosh_05» — ще одному варіанту цифрового свисту з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_whoosh_06

      Урок присвячений звуковому ефекту «dig_whoosh_06» — ще одному варіанту цифрового свисту з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_whoosh_07

      Урок присвячений звуковому ефекту «dig_whoosh_07» — ще одному варіанту цифрового свисту з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_whoosh_08

      Урок присвячений звуковому ефекту «dig_whoosh_08» — ще одному варіанту цифрового свисту з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_whoosh_09

      Урок присвячений звуковому ефекту «dig_whoosh_09» — ще одному варіанту цифрового свисту з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_whoosh_10

      Урок присвячений звуковому ефекту «dig_whoosh_10» — ще одному варіанту цифрового свисту з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

    • dig_whoosh_11

      Урок присвячений звуковому ефекту «dig_whoosh_11» — ще одному варіанту цифрового свисту з тієї самої групи Digital, який застосовується для озвучення анімації в After Effects.

  • Швидкий свист 5 уроків

    Звукові ефекти короткого різкого свисту для швидких рухів.

    • fast_whoosh_01

      Урок присвячений звуковому ефекту «fast_whoosh_01» — швидкому свисту з групи Fast бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • fast_whoosh_02

      Урок присвячений звуковому ефекту «fast_whoosh_02» — ще одному варіанту швидкого свисту з тієї самої групи Fast, який застосовується для озвучення анімації в After Effects.

    • fast_whoosh_03

      Урок присвячений звуковому ефекту «fast_whoosh_03» — ще одному варіанту швидкого свисту з тієї самої групи Fast, який застосовується для озвучення анімації в After Effects.

    • fast_whoosh_04

      Урок присвячений звуковому ефекту «fast_whoosh_04» — ще одному варіанту швидкого свисту з тієї самої групи Fast, який застосовується для озвучення анімації в After Effects.

    • fast_whoosh_05

      Урок присвячений звуковому ефекту «fast_whoosh_05» — ще одному варіанту швидкого свисту з тієї самої групи Fast, який застосовується для озвучення анімації в After Effects.

  • Звуки письма 3 уроки

    Звукові ефекти письма маркером і олівцем для сцен з текстом і малюванням.

    • marker_write_01

      Урок присвячений звуковому ефекту «marker_write_01» — написанню маркером з бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • pencil_write_01

      Урок присвячений звуковому ефекту «pencil_write_01» — написанню олівцем з тієї самої бібліотеки Daruma Audio SFX Library (CC BY), який застосовується для озвучення анімації в After Effects.

    • pencil_write_02

      Урок присвячений звуковому ефекту «pencil_write_02» — ще одному варіанту написання олівцем з тієї самої бібліотеки, який застосовується для озвучення анімації в After Effects.

• Перша анімація в After Effects 11 уроків

  Інтерфейс програми, робота з шейпами, ключові кадри й графіки швидкості, маски та прекомпозиції — на практиці збираються анімація квадрата і міської сцени, а готова робота експортується у відео та GIF.

  • Інтерфейс програми

    Огляд інтерфейсу After Effects: створення композиції та її налаштування (ім’я, пресет, роздільна здатність, частота кадрів, якість, тривалість), вікно проєкту та імпорт файлів, інструменти Selection, Hand, Zoom, фігури (Rectangle, Ellipse, Polygon, Star), Pen Tool і Horizontal Type Tool з їхніми поєднаннями клавіш. Окремо пояснюється, чому для роботи радять англомовну версію програми.

  • Базова анімація

    Робота з базовими параметрами Transform: Position, Scale, Rotation, Opacity та Anchor Point, включно з різницею між якірною точкою і рештою параметрів та способами її швидкого центрування. Показано створення першої анімації через ключові кадри і виклик параметрів гарячими клавішами P, R, S, A, T.

  • Графіки швидкості

    Налаштування плавності руху через Easy Ease (F9) і графік швидкості (Speed Graph): зміна форми графіка, робота з вусиками ключів, діалог Keyframe Velocity. Також показано прийоми Time Reverse Keyframes для розвороту анімації та Toggle Hold Keyframe для ступінчастого руху, і обрізання робочої області таймлайна.

  • Створення шейпів

    Створення фігур з нуля через панель Add у Shape Layer: форми (Rectangle, Ellipse, Polystar, Path), заливка й обводка, різниця між параметрами Size і Scale. Розібрано, як порядок елементів усередині контуру впливає на те, до яких фігур застосовуються заливка й обводка, а також налаштування закінчень ліній і штрихового візерунка Dashes.

  • Маски

    Побудова масок тим самим інструментом, що й для малювання фігур: параметри Mask Path, Mask Feather, непрозорість і розтягнення маски, режим Invert. Показано використання кількох масок на одному шарі та режими їхнього поєднання (None, Add та інші).

  • Прекомпозиції

    Об’єднання шарів у окремі вкладені композиції через Precompose (Ctrl+Shift+C) для спрощення таймлайна при великій кількості об’єктів. Показано, як анімувати вміст прекомпозиції як єдине ціле і працювати з її елементами всередині окремо.

  • Анімація квадрата

    Перша практична робота: анімація квадрата, який котиться намальованою лінією і падає, з перенесенням якірної точки на кут фігури для правильного обертання. Розібрано розрізання шару (Ctrl+Shift+D) без втрати вже зробленої анімації, дублювання шару (Ctrl+D), обрізання довжини шару клавішами квадратних дужок і налаштування швидкості руху через ключі.

  • Анімація міської сцени

    Імпорт підготовленого в Illustrator файлу зі сценою (дорога, будинки, дерева, хмари, машина) і різниця в якості при масштабуванні векторних і растрових об’єктів. Кожна група об’єктів винесена в окрему прекомпозицію з масками, анімації появи зроблені зі зміщенням у часі, додано погойдування дерев, рух машини з димом і наїзд камери наприкінці сцени.

  • Експорт відео та GIF

    Експорт готової анімації: рендер через Ctrl+M і Render Queue, формати QuickTime (зокрема з альфа-каналом) і вивід у MP4/H.264 через Adobe Media Encoder, включно з пакетним рендером кількох ділянок. Показано збереження GIF через Photoshop або сторонній скрипт, збереження окремого кадру як картинки та налаштування автозбереження проєкту.

  • Вихідники до першої анімації 2 уроки

    Файли для практичних завдань першого уроку — міська сцена і квадрат.

    • 01 місто

      Файл-заготовка з малюнком міста, що використовується як вихідний матеріал для практичної анімації міської сцени на цьому уроці.

    • 01 квадрат

      Файл-заготовка з малюнком квадрата, що використовується як вихідний матеріал для практичної анімації квадрата, що котиться і падає, на цьому уроці.

• Морфінг і перетворення форм 9 уроків

  Ефектори шейпів, параметри шарів і часто використовувані ефекти, а також перетворення однієї форми на іншу через шлях і trim path — на двох практичних сценах: механічній і медичній.

  • Ефектори

    Урок розбирає ефектори шейп-шарів у After Effects: Offset Path, Pucker & Bloat, Repeater, Round Corners, Trim Paths, Wiggle Paths і Zigzag, їхні параметри та застосування на прикладі фігури-зірки. На прикладах показано, як за допомогою Trim Paths будується кругова діаграма та анімація ліній, що розходяться навколо кола.

  • Параметри шарів

    Урок описує панель параметрів шару на таймлайні After Effects: видимість, блокування, соло-режим, Continuously Rasterize, перемикання ефектів, motion blur, 3D-шар і прив’язку шарів до іншого шару через інструмент Lasso. Також розглядаються соліди, нульові об’єкти, Adjustment Layer, матові режими Alpha Matte й Alpha Inverted Matte, режими накладання та налаштування вигляду композиції — сітка, напрямні, роздільна здатність.

  • Ефекти

    Урок показує застосування ефектів на Adjustment Layer і на окремих об’єктах: Curves для кольорокорекції, Snowfall і Rainfall для імітації снігу та дощу, Pixel Polly для розльоту об’єкта на фрагменти, Fill для перефарбування, Gradient Ramp для лінійного й радіального градієнта, Fast Blur, Drop Shadow і Glow, а також Bend для згину форми.

  • Завдання1.окремі елементи

    Практичний урок повторює анімацію появи окремих елементів сцени — лампочки, олівця, ноутбука та шестірні — за допомогою ефектора Trim Path і його параметрів Start та End. Для шестірні, намальованої заливкою без обводки, замість прямого застосування Trim Path використано маску та режим Alpha Matte.

  • Завдання1.збираємо сцену

    Урок продовжує практичне завдання: анімуються поява й рух лампочки, малювання лінії олівцем через Trim Path, виїзд і обертання шестірні, прив’язка об’єктів до нульового об’єкта та зменшення сцени під час переходу всередину комп’ютера через прекомпозицію.

  • Завдання2.частина1

    Урок пояснює морфінг як перетворення одного об’єкта на інший через параметр Path — зокрема на прикладі квадрата, перетвореного на коло після конвертації форми в Bezier Path, — і починає практичну сцену «пульс → шприц → серце», де перетворення будується через ефектор Trim Path, а не через параметр Path.

  • Завдання2.частина2

    Урок завершує сцену морфінгу: домальовується перехід шприца в серце, анімуються впорскування мікстури через Trim Path і Opacity, заповнення серця, додаються лінії, що розходяться навколо серця, і легке погойдування сцени через параметр Scale.

  • Вихідники до морфінгу 2 уроки

    Файли для практичних завдань з trim path і морфінгу.

    • trim path

      Матеріал розділу «Завдання 1» — додаткові матеріали з ефектора Trim Path, застосованого в практичному завданні уроку.

    • морфінг

      Матеріал розділу «Завдання 2» — додаткові матеріали з морфінгу, прийому, що відпрацьовується в другому практичному завданні уроку.

• Скрипти та вирази для пришвидшення роботи 7 уроків

  Підготовка файлів з Illustrator до анімації, корисні скрипти (Duik, Motion 2, Stagger Selected Layers, Paste Keyframes, розбивка тексту на літери) і вирази на JavaScript — на практиці анімується сцена миття автомобіля з діагностичним приладом і лічильником.

  • Підготовка ілюстрацій до анімації

    Розбираємо правильну збірку файлів в Illustrator для перенесення в After Effects: групування шарів, відмінності між чорною та білою стрілкою виділення та розбивку ілюстрацій на окремі шейпи за допомогою скрипту. Окремо дивимось, як при такій розбивці поводяться градієнти та напівпрозорі елементи.

  • Корисні скрипти

    Продовжуємо знайомство зі скриптами: Duik для налаштування швидкості руху через Keyframe Velocity, Motion2 для швидкого розставлення якірних точок, а також PtShiftLayers і Stagger Selected Layers для зсуву та розподілу ключів по шарах. Також показано скрипт Past Keyframes для вставки ключів замість шарів і Decompose Text для розбивки тексту на букви.

  • Вирази

    Розбираємо вирази (expressions) на JavaScript в After Effects: активацію виразу через Alt і клік по годинничку параметра, вирази continue та pingpong для продовження й зациклення руху між ключами. Окремо показано вирівнювання кривої руху через Keyframe Interpolation в режим linear.

  • Практика.машина.частина1

    Практичне заняття: збірка сцени мийки машини — прекомпозиції, розбивка елементів на шейпи, анімація під’їзду машини за позицією і скейлом з виразом bounce. Також анімуються щітки з ефектом Bend і виразом loopOut pingpong та бульбашки піни з виразом wiggle і зсувом за часом через Stagger Selected Layers.

  • Практика.машина.частина2

    Продовження практики: анімація струменя води через Trim Paths і параметр offset у Dashes, поява та зникнення бризок і бульбашок через Reverse Keyframes. Далі збирається прилад діагностики — провід за Trim Paths, екран і кнопки з появою за скейлом і виразом bounce, зі зсувом за часом між елементами.

  • Практика.машина.частина3

    Завершення практики: збірка відсоткового лічильника діагностики з текстових шарів і слайдер-контролу, синхронізація його руху з рештою елементів сцени. Далі анімується запуск машини — зміна кольору фар, вібрація корпусу за скейлом і поява відблисків за прозорістю з обрізанням кількості повторів.

  • Вихідники до сцени миття 1 урок

    Файли для практичного завдання з автомобілем.

    • moyka

      Додатковий матеріал до уроку, що стосується сцени мийки машини, яка розбирається в практичних заняттях розділу.

• Переходи між сценами 6 уроків

  Переходи за допомогою вбудованих ефектів і власні варіанти — за масштабом і позицією, по стовпцях і радіально, зі зміною кількості та кольору шарів.

  • Переходи за допомогою ефектів

    Урок присвячений створенню переходів між сценами за допомогою вбудованих ефектів After Effects із папки Transitions: Dissolve, Grid Wipe, Radial Scale Wipe, Jaws і Rectangular. Показано, як налаштовувати параметри Transition Completion, Block Width/Height, Border, Rotation і Feather для отримання різних варіантів переходу на прикладі шарів-солідів із градієнтами й текстом.

  • Переходи за масштабом і позицією

    Урок присвячений створенню власних переходів через шари-соліди й Alpha Matte без готових ефектів. Показано, як анімувати параметри Scale і Position, змінювати якірну точку для зміни напрямку переходу, а також дублювати й фарбувати шар для отримання кольорової смуги або кола під переходом.

  • Переходи по стовпцях

    Урок присвячений створенню переходу по стовпцях за допомогою інструмента Proportional Grid і панелі Align для вирівнювання плашок. Показано, як анімувати параметр Scale за ключовими кадрами, змінювати якірні точки, швидкість і порядок зміщення стовпців, а також додавати кольоровий фоновий шар під перехід.

  • Радіальні переходи

    Урок присвячений створенню радіальних переходів за допомогою Ellipse Tool, обводки (Stroke) і ефекту Trim Paths. Показано, як налаштовувати товщину й розмір обводки, додавати кілька концентричних кіл і кольоровий фон, а також змінювати напрямок переходу через параметри Start/End і Time Reverse Keyframes.

  • Переходи по Path

    Урок повторює прийом створення переходів між сценами через шари-соліди з градієнтами й вбудовані ефекти After Effects із папки Transitions — Dissolve, Grid Wipe, Jaws та інші. Розбираються параметри Transition Completion, Block Width/Height, Border і Rotation, що показують різні варіанти переходу.

  • Вихідники до переходів 1 урок

    Файли для практичних завдань з переходів.

    • 04 переходи

      Матеріал стосується теми переходів і супроводжує відповідний урок додатковими файлами.

• Анімація тексту 5 уроків

  Налаштування тексту і готові пресети, поява тексту через маски та за допомогою виразів, а також повністю ручна анімація кожної літери окремо.

  • Робота з текстом

    Налаштування текстового шару в After Effects: шрифт, накреслення, колір і обведення, розмір, міжлітерний та міжрядковий інтервал, а також розміщення тексту вздовж маски-траєкторії. Розбір параметрів вкладки Animate (range selector, advanced) для покадрової анімації окремих літер та робота з готовими пресетами з Animation Presets.

  • Анімація масками

    Анімація появи тексту за допомогою масок: через прекомпозицію з обрізною маскою або через adjustment layer з альфа-мат, зокрема для кількох слів і появи по окремих літерах. Окремо розібрано появу тексту з-за плашки з використанням alpha inverted і рухомої лінії.

  • Bounce-анімація

    Побудова переходу з набору прямокутних плашок: розстановка і вирівнювання елементів інструментом Align, анімація за scale і offset з різними якірними точками для різних варіантів появи. Показано, як змінювати колір і напрямок плашок, отримуючи різні варіанти переходу з однієї заготовки.

  • Анімація окремих літер

    Покадрова анімація тексту по окремих літерах: розбиття слова на фігури (shapes from text) та індивідуальна анімація кожної літери — обведення за trim paths, обертання і зміщення за позицією, вирази для синхронних частин літери. Появи літер зсунуті в часі одна відносно одної для послідовної появи слова.

  • Вихідники до анімації тексту 1 урок

    Файли для практичних завдань з анімації тексту.

    • текст

      Матеріали до розділу «Урок 5. Анімація тексту», що доповнюють практичні уроки з роботи з текстом в After Effects.

• Анімація інтерфейсу застосунку 8 уроків

  Імпорт макетів з PSD і розбір великого практичного проєкту: екран входу з набором пароля по літерах, лічильник на другому екрані, висувне меню, стрічка новин, листування і вказівник натискань, що імітує палець на екрані.

  • Робота з PSD-файлами

    Імпорт PSD-файлу в After Effects зі збереженням папок, шарів і режимів накладання; зміни у Photoshop підхоплюються в реальному часі. Текстові шари перетворюються на редагований текст через Create Editable Text із переустановленням якірної точки в центр. Важкі PSD-файли для практики замінені розбитими на частини PNG-картинками.

  • Анімація початкового екрана

    Імпорт PNG-зображень інтерфейсу застосунку частинами та збирання композиції екрана з фону, логотипа, значків і текстових полів. Поява елементів вибудувана масками та ключами за позицією, масштабом і прозорістю, текст пароля анімований по буквах скриптом Decompose Text. Готова сцена вміщена на екран телефона через маску та alpha-mate.

  • Анімація другого екрана

    Імпорт зображень другого екрана та збирання композиції з фону, значка й текстових блоків. Текст анімований виїздом знизу по масках, а цифри — біжучим лічильником через Slider Control і вираз, прив’язаний до текстових шарів. Сцена з’єднана зі зміною попереднього екрана переходом тексту та пароля.

  • Анімація меню

    Збирання композиції меню з окремих зображень із поділом масками на профіль, стрілку розгортання, пункти меню та підкладки. Анімовані поворот стрілки, поява й розкриття випадних пунктів меню, а також зсув фонових плашок за позицією і прозорістю.

  • Анімація стрічки новин

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

  • Анімація повідомлень

    Перехід від меню до екрана повідомлень: зміна кольору значка месенджера, згортання меню та поява списку діалогів із текстом і фоном, зібраними масками. Діалог із повідомленням зібраний з окремих елементів — заголовка, фотографії, імені та тексту, — які замінюють вихідні дані прикладу на відповідні поточному діалогу.

  • Анімація маркера

    Додавання червоного маркера-курсора інструментом Ellipse Tool, що позначає натискання на екрані протягом усього ролика. Маркер анімований за позицією і масштабом — переміщення між пунктами меню, зменшення при натисканні та повернення до звичайного розміру. Домашнє завдання — повторити сцену за надісланими зображеннями та PSD-файлами або на власному макеті екрана.

  • Вихідники до анімації застосунку 1 урок

    PSD-макети і файли для практичного проєкту з інтерфейсом застосунку.

    • Додаток

      Додатковий файл до розділу «Урок 6. Анімація інтерфейсів» — матеріали, долучені до уроку.

• 3D всередині After Effects 6 уроків

  3D-шари, камера, глибина різкості та видавлювання плоских фігур в об’ємні об’єкти — на практиці збираються 3D-телевізор і пульт, а рух камери з’єднує сцену з роликом із попереднього практичного завдання.

  • Робота з 3D

    Увімкнення 3D на шарах, робота з параметрами Position, Rotation та Orientation, налаштування Active Camera і типів камери (One Node, Two Node), а також Camera Option — Zoom, Depth of Field, Aperture. Показано видавлювання об’єктів через рендер Cinema 4D (Geometry Option, Extrude Depth), додавання обводки Stroke та джерела світла.

  • Практика 3D. Створення 3D із шейпів

    Практична робота з перетворення пласких шарів пульта та телевізора на об’ємні моделі через рендер Cinema 4D: увімкнення 3D, дзеркальне відображення зображення, налаштування Extrude Depth і додавання обводок Stroke кнопкам та рамці.

  • Практика 3D. Анімація появи

    Анімація появи телевізора та пульта в окремій композиції: збільшення рамки й екрана за параметром Scale, зміщення за Position, налаштування ключових кадрів і порядку появи кнопок із використанням F9 для згладжування.

  • Практика 3D. Анімація камери

    Анімація руху та обертання камери в кількох композиціях, збирання фінальної композиції з проміжних шарів, обрізання зайвої області та виправлення бага інтерполяції ключових кадрів через Linear.

  • Вихідники до 3D-сцени 2 уроки

    Файли для практичних завдань з 3D.

    • moyka

      Допоміжний файл «moyka» з блоку «Матеріали сьомого уроку» до практики з 3D-анімації.

    • 3d

      Допоміжний файл «3d» з блоку «Матеріали сьомого уроку» до практики з 3D-анімації.

• Фінальний проєкт: продавальний ролик 19 уроків

  Як шукати замовників, оформлювати бриф, сценарій, розкадровку та оцінювати роботу — і великий фінальний проєкт: анімаційний ролик із кількох сюжетних сцен з переходами між ними, від підготовки файлів до експорту готового відео.

  • Алгоритм роботи

    Урок присвячений роботі з клієнтами: збір технічного завдання через бриф, написання сценарію, узгодження розкадровки й кольорів, отримання передоплати. Показано, як захищати чорновий ролик водяним знаком до остаточної оплати і передавати файл проєкту клієнту. Надано рекомендації щодо формування портфоліо та пошуку перших замовлень на фрілансі, в студії та на Behance.

  • Підготовка файлів і анімація 1 сцени

    У цьому уроці файли Illustrator імпортуються в After Effects і розбиваються на шари для створення прекомпозицій кожного об’єкта першої сцени — вазонів з листям, лампи, столу та кота, що спить. Для об’єктів розставляються якорні точки, копіюється анімація масштабування, додається offset для послідовної появи частин. Кіт анімується через погойдування тіла, обертання голови і хвоста за допомогою виразів Wiggle і Ping-Pong.

  • Сцена1.частина2

    Продовжується анімація об’єктів першої сцени: годинника зі стрілками, лампи, столу з тумбами і штор, а також вікна, чашки з пакетиком чаю і бульбашок у склянці. Для годинника використовується вираз loopOut Continue для безперервного ходу стрілок, для решти об’єктів — анімація за масштабом з offset між елементами.

  • Завершуємо 1 сцену

    Завершується анімація першої сцени: книги на полиці з’являються по черзі через offset і зв’язку якорних точок, додаються решта вазонів і тумба з книгами. Усі раніше заанімовані об’єкти сцени синхронізуються за часом появи в головній композиції, включно зі столом, котом, картинами і персонажем за комп’ютером.

  • Сцена1.частина1

    Для сцени з монітором створюється нуль-об’єкт, до якого прив’язується наближення камери до екрана, де показується сторінка пошуковика та інтернет-магазину. Через велику кількість об’єктів на сторінках ці сцени не розбиваються на шари, а обробляються масками — окремо виділяються текстові блоки, зірочки рейтингу та елементи, які мають з’являтися послідовно.

  • Сцена2.частина2

    Анімується поява карток товару і прокручування сторінки інтернет-магазину, збільшення обраного товару і перехід до вибору кольору кросівок. Далі показано додавання товару в кошик, оформлення замовлення та розміщення кросівок спершу в сумку, а потім у подарункову коробку.

  • Сцена2.частина3

    Анімується рух курсора миші між елементами інтерфейсу сайту з переходами через маски одного шару. Додатково створюється нуль-об’єкт для наближення камери до годинника, а частина вже опрацьованих елементів сцени переноситься вище по шарах, щоб приховати технічну заміну під час монтажного розрізу камери.

  • Сцена2.перехід на сцену3

    Показано трансформацію циферблата годинника в інший варіант: змінюється колір корпусу і стрілок, товщина обводки, форма поділок і обертання крапок через дублювання ключів повороту. Анімація слугує переходом між сценами ролика.

  • Завершуємо сцену2

    Додаються штрихи-розчерки біля курсора в місцях натискань, а також анімація руки персонажа, яка рухає мишу і натискає на елементи інтерфейсу, і легкі нахили його голови. Урок завершує анімацію першої сцени ролика повністю.

  • Сцена3.частина1

    Анімується робота заводського конвеєра: обертання шестерень, рух стрічки через offset обводки, циклічне переміщення коробок. Окремо покадрово анімується закриття картонної коробки, намальованої в перспективі, — кришки згинаються і випрямляються через параметр Path і поворот.

  • Сцена3.частина2

    На закриту коробку додається наклейка, а перехід від попередньої сцени з годинником до сцени заводу робиться через поєднання кольору фону і колон будівлі. Далі анімується встановлення коробки на конвеєр і її рух з подальшим падінням на стрічку.

  • Завершуємо сцену 3

    Анімуються механічні захвати, які опускають кросівки в коробку, а також цикл конвеєра з кількома послідовно рухомими коробками і блимання індикатора на пристрої. Наприкінці сцени камера знову наближається до годинника для переходу до наступної сцени.

  • Сцена4.частина1

    Колесо машини анімується один раз через нуль-об’єкт з обертанням і погойдуванням за масштабом, а потім копіюється на решту автомобілів і автобус на задньому плані. Додатково анімуються вихлопний дим, рух транспорту в різні боки та легке погойдування неба і дерев через вираз Wiggle.

  • Сцена4.частина2

    Годинник у фінальній сцені перетворюється на новий варіант циферблата: змінюються колір корпусу, форма і товщина стрілок, додаються поділки по колу через дублювання одного відрізка лінії з поворотом. Перехід між сценами оформлюється через альфа-мати і лінію, що закриває кадр.

  • Завершуємо роботу над відео

    У завершальному уроці виправляються недоліки ролика — обрізаний вазон, швидкість руху бульбашок і конвеєра, додаються кульки-наповнювач із коробки. Показано, як через File → Dependencies зібрати всі файли проєкту в одну папку, і як додати музичний супровід до композиції.

  • Музика для фінального ролика 1 урок

    Аудіофайл для озвучення фінального проєкту.

    • Commercial 4

      Матеріал уроку — аудіофайл Commercial 4 з папки Footage з матеріалами до уроку.

  • Приклади готових комерційних роликів 3 уроки

    Референси стилю комерційної анімації для орієнтиру під час роботи над фінальним проєктом.

    • 2D Animation – Marketing 2.0

      Приклад — відеоролик з англомовним закадровим текстом про трансформацію digital-маркетингу: перехід від здогадок до даних, персоналізація повідомлень, крос-функціональні команди та гнучке бюджетування.

    • autoDNA AFILIO – Animation 2D by Fromsquare

      Приклад — анімаційний ролик autoDNA AFILIO студії Fromsquare, доданий до розділу прикладів уроку.

    • Flat 2D Apple Animation

      Приклад — анімаційний ролик у плоскому 2D-стилі на тему Apple, доданий до розділу прикладів уроку.

Часті запитання

Про цей курс

• Якою мовою ведеться робота в After Effects — російською чи англійською?

  Усі уроки записані в англомовному інтерфейсі After Effects: російська локалізація втрачає частину ефектів і працює нестабільно, тому перехід на англійський інтерфейс рекомендований одразу.

• Чи потрібно вміти малювати, щоб пройти курс?

  Ні. Курс вчить анімації, а не малюванню: робота йде з уже готовими макетами і векторними сценами, а малювати для практичних завдань може напарник-художник.

• Яка програма потрібна крім After Effects?

  Photoshop — для підготовки макетів і експорту шарів у PNG, та Adobe Media Encoder — для фінального рендера ролика в MP4.

• Що вийде в кінці курсу?

  Готовий анімаційний ролик тривалістю близько 30 секунд із кількох сюжетних сцен з переходами між ними — завершена робота для портфоліо.

• Чи розбирається робота з 3D-програмами на кшталт Cinema 4D або Blender?

  Ні, 3D у курсі розбирається лише засобами самого After Effects: 3D-шари, вісь Z, одно- і двовузлова камера та видавлювання плоских фігур в об’ємні об’єкти.

• Чи знадобляться матеріали курсу, якщо я вже працюю моушн-дизайнером?

  Так, у курс вбудована бібліотека готових футажів і звукових ефектів Daruma Audio (ліцензія CC BY) — вона може використовуватися окремо від покрокових уроків як набір вихідників під рукою.

Доступ і матеріали

• Коли і як я отримаю доступ до курсу?

  Одразу після оплати, тієї ж секунди й автоматично. Чекати на підтвердження не потрібно. Доступ надходить двома шляхами водночас. Перший: на пошту, вказану при оформленні замовлення, приходить лист із посиланням на матеріали. Другий: те саме посилання з’являється у вашому акаунті на сайті, у розділі «Завантаження», і залишається там назавжди.

• Де зберігаються матеріали курсу?

  Усі відео та додаткові файли лежать у хмарному сховищі. Посилання на нього — у вашому акаунті на сайті, розділ «Завантаження», і в листі, який надійшов після оплати. Акаунт тут не формальність, а спосіб доставки: курс залишається в ньому назавжди. Навіть якщо лист загубився або ви згадали про купівлю через рік, посилання буде на місці.

• Чи можна завантажити матеріали, чи тільки дивитися онлайн?

  Завантажувати можна і варто. Радимо зберегти відео на комп’ютер і дивитися звідти. Причина проста: хмарне сховище не розраховане на перегляд відео. Іноді воно дозволяє увімкнути ролик просто у браузері, але якість при цьому помітно гірша за вихідну. На своєму комп’ютері ви побачите курс таким, яким його записували.

• Як довго діє доступ?

  Безстроково. Курс залишається вашим назавжди, повертатися до нього можна скільки завгодно разів. Якщо через рік чи два посилання раптом перестане відкриватися з технічних причин — напишіть на info@siluette.com.ua, ми його відновимо.

• Лист із доступом не надійшов — що робити?

  Насамперед: доступ у вас є в будь-якому разі. Увійдіть на сайт і відкрийте розділ «Завантаження» — посилання на курс уже там, незалежно від того, дійшов лист чи ні. Найчастіше лист губиться через одруківку в адресі під час оформлення замовлення. Ще варто заглянути до теки «Спам». Не виходить розібратися — не витрачайте час: напишіть на info@siluette.com.ua або в чат у правому нижньому куті сайту, ми допоможемо.

• На яких пристроях дивитися курс?

  Найкраще на комп’ютері або ноутбуці: завантажте відео й відкрийте будь-яким звичним плеєром. Знадобляться встановлені відеокодеки — на більшості комп’ютерів вони вже є. Завантажити курс можна на скільки завгодно пристроїв. А от телефон ми не радимо, і з двох причин. На маленькому екрані погано видно деталі, особливо якщо в уроці показують інтерфейс програми. І на телефонах часто немає кодеків для форматів, у яких записані відео.

Оплата та повернення

• Якими способами можна оплатити?

  Банківською карткою Visa, MasterCard або «Простір», через Google Pay, Apple Pay, Masterpass, Visa Checkout, платіжний QR-код, Botpay у Telegram чи Privat24. Є й оплата частинами: Монобанк (3 або 4 платежі), А-Банк (2, 3 або 4 платежі та розстрочка), Банк Глобус (8 платежів), «Скибочка» від OTP Bank (3 платежі), миттєва розстрочка та оплата частинами від ПриватБанку.

• Чи приймається картка, випущена не в Україні?

  Так. Платіжна система приймає картки з Євросоюзу та будь-яких інших країн. Одна деталь, про яку часто забувають: банк може попросити підтвердити платіж — у мобільному застосунку або кодом із СМС. Якщо оплата не проходить, перевірте застосунок банку та повідомлення.

• Як працює знижка 20% при купівлі кількох курсів?

  Додайте до кошика два курси або більше — знижка застосується автоматично до всіх товарів у кошику. Два курси: мінус 20% на обидва. П’ять курсів: мінус 20% на всі п’ять. Знижка поєднується з будь-якими акційними цінами й діє на весь каталог без винятків.

• Чи можна повернути курс або гроші?

  Цифрові товари поверненню та обміну не підлягають. Це загальне правило для всіх електронних товарів в Україні — постанова Кабінету Міністрів № 172 від 19 березня 1994 року. При цьому ми завжди на зв’язку. Якщо доступ не відкривається, посилання перестало працювати або файли пошкоджені — напишіть на info@siluette.com.ua, вкажіть дату та номер замовлення. Відновимо. Якщо щось незрозуміло в самому курсі, теж пишіть — підкажемо.

• Чи можна оплатити від організації за рахунком?

  Поки що ні. Ми працюємо лише з приватними покупцями — безготівкової оплати за рахунком від юридичних осіб зараз немає.

Як проходить навчання

• Чи є зворотний зв’язок із викладачем і перевірка завдань?

  Ні. Усі курси — це записи уроків для самостійного вивчення: викладач не відповідає на запитання і не перевіряє домашні завдання. Саме тому курси коштують значно дешевше за навчання з куратором. Ви отримуєте той самий матеріал, але займаєтеся самі та у своєму темпі.

• Чи видається сертифікат?

  Так, цифровий сертифікат — на запит і безкоштовно. Напишіть на info@siluette.com.ua, вкажіть ім’я та прізвище саме в тому вигляді, в якому хочете бачити їх у сертифікаті, і ми надішлемо його протягом доби.

• Чи потрібен досвід, щоб почати?

  Для більшості курсів — ні. Вони розраховані на початковий рівень і пояснюють з азів. Якщо курс потребує підготовки, це сказано в його описі.

• Чи є терміни проходження курсу?

  Ні. Ані дедлайнів, ані розкладу, ані доступу, що згорає. Завантажили — дивіться коли зручно, з будь-якими перервами.

• Чи можна поділитися курсом з іншою людиною?

  Курс купується для особистого використання, і ми просимо ставитися до цього по-людськи: за кожним уроком стоїть робота, а ціна й так суттєво знижена.

Підтримка

• Куди писати, якщо щось не працює?

  Найкраще на info@siluette.com.ua. Є й чат у правому нижньому куті сайту, але пошта надійніша: там можна все описати докладно та додати знімки екрана. Прохання: опишіть, що саме ви робили і що пішло не так, та додайте знімок екрана з помилкою. Так ми вирішимо питання одразу, а не з’ясовуватимемо півдня, що сталося.

• Як швидко відповідає підтримка?

  У робочий час, з 9:00 до 19:00, на пошту зазвичай відповідаємо протягом години, у чаті — за кілька хвилин. Після 19:00 теж буває, але час відповіді не обіцяємо.