Протягом попередніх уроків я вже кілька разів згадував, що кожен з анімаційних прийомів Flash найкраще працює у зв’язці з іншими функціями. Прийшов час втілити ці слова на практиці. У сьогоднішньому уроці ми повернемося до покадрової анімації крокуючого чоловічка, яку навчилися здійснювати у першому уроці. Але цього разу ми підсилимо ефект руху додаванням елементів motion tween. Чи, попросту кажучи – будемо рухати нашого чоловічка по сцені з допомогою автоматичної анімації.
Перш, ніж братися до цього уроку, переконайтеся, що ви засвоїли матеріал про покадрову анімацію крокуючого чоловічка, а також знаєте, яким чином створюється автоматична анімація руху (motion tween).
- Перш за все створіть новий проект Flash (версія Action Script, як завжди, значення не має) і імпортуйте в бібліотеку чотири зображення «крокуючого чоловічка». Для того, щоб полегшити вам життя, я знову викладаю всі чотири зображення, які ви можете легко завантажити.
- Виберіть опції сцени 300х102 (ширина довільна, висота відповідає висоті зображення), а кількість кадрів встановіть, приміром, у положення 12 кадрів на секунду.
- Створіть новий символ (виберіть в меню Insert -> New Symbol, або скористайтесь комбінацією клавіш Ctrl+F8). Назвіть символ, скажімо, “Walking man”, а тип поведінки виберіть Movie Clip.
- Виконайте кроки з 5 по 8 з уроку про покадрову анімацію кліпу крокуючого чоловічка. Таким чином всередині вашого символа буде знаходитися повноцінний кліп із чоловічком, який рухає ногами (крокує).
- Закінчіть редагування символа, перейшовши за посиланням Scene 1 у лівому верхньому кутку вашої сцени. Якщо ви все зробили правильно – то тепер у вашій бібліотеці окрім чотирьох імпортованих туди зображень, відображається ще й символ (Movie Clip) Walking Man.
- Перетягніть символ Walking Man на сцену таким чином, щоб він знаходився трішки лівіше від видимої території. Коли цей символ почне рух, складатиметься враження, що він «заходить» на сцену.
- Виділіть на шкалі часу (timeline) будь-який «віддалений кадр» (в моєму випадку – 50) і натисніть F6, таким чином створивши в ньому ще один ключовий кадр.
- В цьому кадрі перемістіть символ Walking Man, за межі видимого поля. Але цього разу – праворуч від сцени. При такому русі буде складатися враження, що коли чоловічок доходить до кінця сцени – він неначебто «виходить» з неї.
- Клікніть правою клавішею на будь-якому кадрі між двома ключовими і виберіть у випадаючому меню функцію Create Classic Tween. Якщо ви все зробите правильно – між першим та останнім ключовими кадрами з’явиться стрілка, а самі кадри стануть фіолетовими.
- Використайте пункт меню Control -> Test Movie (або комбінацію клавіш Ctrl+Enter) для попереднього перегляду фільму. Після цього можете зберегти файл або навіть опублікувати його для розміщення у вебі.
Після того, як натиснете «ОК», ви потрапите в режим редагування символу.
Результат вийшов таким:
Тепер ви знаєте, як поєднувати кілька різновидів анімації в межах одного кліпу. Але повірте – це тільки початок. Сподіваюся, урок вам сподобався.
Залишайтеся на зв’язку, щоб не пропустити нічого насправді цікавого. А найлегше це зробити – підписавшись на RSS цього блога.
Березень 6, 2009 о 11:48
Відеоуроки…
І часу менше будеш тратити і наглядніше…
Покрокові речі – досить складнооформляти і важко сприймати без великої кількості скріншотів…
Знаю то по своїх уроках.. Поки не вставиш в статтю 10-20 скріншотів вікон повністю з розмальованими кроками по кожній з галочок – доти читач не буде задоволений.