Анімація форми. Практична робота «Створення анімації форми у програмі Flash» Методичний посібник «Вчимося створювати анімацію під час уроків інформатики. Створення простого шейпового відео

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

Це всі графічні елементи, не думаю, що хтось це робитиме, цікавіше дивитися на картинку в png, як вона змінює форму, перетворюючись на іншу png, але морфінг з растром не працює. Слід виконати певний алгоритм дій.
Розповім на своєму прикладі.
Відразу роблю акцент - картинка повинна бути без градієнтів, без тіней і бажано не сильно строката (програма не зможе її прорахувати), хто знає, що таке вектор ,тот уявляє,скільки плашечок відтінків кольору у якомусь малюнку,тому погодьтеся,що програма Flash призначена задля основний роботи з вектором.
Отже, все завантажили в бібл. вставка - створити символ - у самому символі з бібл. вставляємо картинку, виділяємо, потім -модифікація-растрове зображення-векторизація.

Відкриється віконце,якщо у вас стоїть граничне значення 100,виправте на 10,а ось значення найменша область,можна поекспериментувати,за умовчанням коштує 1,але це занадто довго прога буде прораховувати(кожну точку кольору),тому залежно,яка у вас картинка , Наскільки складна за кольором, змінюєте це значення і дивіться, натиснувши попередній перегляд, головне, щоб не сильно спотворилася якість, ось на моєму прикладі, як би 25 забагато, але якість сильно не постраждала, якщо влаштовує результат, натискаємо бл.

Не знімаючи виділення, натискаємо - копіювати-

і йдемо на монтажну сцену, виділяємо 1 кадр і на сцені - вставити.

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

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

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

Практична робота №1

Практична робота №2:

Створіть анімацію форми для цифри "1", що плавно трансформується у цифру "2". Для цього створіть анімацію форми для об'єкта на першому та останньому кадрах. Як об'єкти використовуйте цифри, налаштуйте їх зовнішній вигляд(Розмір, колір, положення, скориставшись набором властивостей на відповідній панелі).

Для створення анімації форми текстового об'єкта на першому та останньому ключових кадрах цифри необхідно "розбити" - перетворити з тексту на графіку. Це робиться таким чином – до виділеного об'єкта застосовується команда поділу (режим меню "Модифікація" - "Розділити").

Практична робота №3:

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

Для цього виконаємо такі дії (використовуючи анімацію попередньої роботи):

Приклади створення анімації форми наведено в папці "Анімація" - "Анімація форми".

Короткі підсумки лекції:

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

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

Для покращення реалістичності перетворення одного об'єкта на інший необхідно вказати – в яку точку об'єкта на останньому кадрі "перетіче" обрана точка об'єкта на першому кадрі. Для цього використовують точки прив'язки (хінти кривої).

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

Ключові терміни

Анімація форми
Розбиття тексту
Хінт кривий

Набір для практики:

Для яких об'єктів можливе створення класичної форми анімації?
Чи можна змінювати колір анімованого об'єкта під час створення анімації форми?
Призначення точок прив'язки (хінтів кривої) під час створення анімації форми?
Що розуміється під графічним поданням текстового об'єкта?
Чи застосовується анімація форми до текстового об'єкта? Які перетворення для цього потрібно провести з текстовим блоком?

Вправи

Створіть анімацію диму.
Створити анімацію руху та зміни форми хмари в небі.
Створіть анімацію зміни форми полум'я.
Створіть анімацію полотна прапора, що розвівається на вітрі.

Опис:

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

Обладнання та дидактичний матеріал:ПЕОМ, програма Flash, мультимедійний проектор, демонстраційний матеріал, електронна презентація, завдання.

Структура та хід уроку:

Організаційний момент.Перевірка учнів та його готовності до уроку.
Перевірка домашнього завдання
Що таке анімація? Які види анімації ви знаєте, їх переваги та недоліки? Як виконується анімація руху?
Минулого уроку ми познайомилися з анімацією руху. Сьогодні продовжимо вивчення анімації. Запишіть тему уроку: Створення анімації форми у Flash.
Цілепокладання.Формулюються цілі уроку
(Демонструється файл – Створення анімації форми у програмі Flash.ppt –слайд 1).
Пояснення нового матеріалу, його конспектування, показ виконання основних операцій
Анімація форми із заповненням першого та останнього ключового кадру Shape tweening.
Заповнення кадрів із зміною форми використовується для трансформації мальованих фігур між початковими та кінцевими точками. Flash може виконати операцію заповнення кадрів зі зміною форми лише фігур. На одному шарі можна виконати заповнення кадрів для кількох фігур. Але для чіткої організації потрібно, щоб кожна фігура знаходилася на окремому шарі, якщо ви згодом повернетеся до цього анімаційного фрагменту, щоб внести певні зміни, то робота спроститься. (Демонструється файл слайд 2). Учні ведуть короткий конспект. ( Далі всі операції відображаються на екрані за допомогою мультимедійного проектора.)
Для створення розрахункової анімації форми необхідно виконати такі действия:
1. Намалювати об'єкт у ключовому кадрі.
2. Перебуваючи у першому кадрі, використовувати панель « Кадр», вибрати пункт Shapeзмінити ослаблення.
3. Вказати кінцевий кадр та включити команду чистий ключовий кадрЦе можна зробити, клацнувши правою клавішею миші на кадрі, який і буде ключовим, з'явиться список, в якому і вибрати чистий ключовий кадр. У ньому розташувати зображення, потім програти анімацію. Для цього вибрати пункт меню Управління команда « Відтворення» або натиснути клавішу Enterна клавіатурі. Після цього анімація буде відтворюватися.
Після того як у вас є два ключові кадри, ви робите активним перший з них (просто переходите на нього) і вибираєте на панелі « Кадр" в списку Tweeningрядок Shape:
Кадри на тимчасовій шкалі повинні забарвитися в зелений колір і від першого кадру до другого повинна простягтися стрілочка.
В результаті ви отримаєте ряд проміжних кадрів, які відображатимуть перехід від першої фігури до другої. (Демонструється файл – Створення анімації руху у програмі Flash.ppt –слайд 3):
У цій анімації коло переходить у якусь подобу півмісяця. На першому ключовому кадрі намальовано коло, а на іншому ключовому кадрі (це 10 кадр сцени) півмісяць. У панелі « Кадр» є два параметри Easing(Прискорення) та Blend(Перехід)
Easing(Прискорення) задає зворотне експонентне прискорення. Розмір цього параметра може змінюватися від - 100 до + 100. Це означає, що якщо ви поставите негативний easing(прискорення), швидкість збільшуватиметься (Див. рис. 4). І навпаки, якщо easing(прискорення) буде позитивним, анімація сповільнюватиметься (див. рис. 5).

Параметр Blend(Перехід) , визначає алгоритм переходу: Distributive(розподільний, загальний) та Angular(незграбний). Перший намагається максимально пом'якшити, згладити перехід від однієї фігури до іншої. Другий намагається зберегти пропорції кутів. Якщо перехід вас не задовольняє, можна експериментувати з цим параметром.
Закріплення пройденого матеріалу.
(Демонструється файл – Створення анімації руху у програмі Flash.ppt –слайд 4).
Створення анімації форми: "Нічна квітка"
Підбиття підсумків уроку.
Діти, пропоную вам переглянути роботи один одного. Зверніть увагу на переваги та недоліки різних анімацій. Окремі анімації демонструються всім за допомогою проектора. Обговорюються позитивні моменти, помилки, недоліки, якщо є.
Повторимо основні моменти уроку.
З якою програмою ми сьогодні продовжили знайомство? Як створити анімацію форми? Яке розширення файлу анімації? Чи вам сподобалися можливості програми і де ви могли б їх використовувати?
Аналіз відповідей учнів; аргументація та виставлення оцінок.
Домашнє завдання:конспект; продумати та підготувати матеріал для власної анімації

Список використаної літератури

Macromedia Flash 5/ Книга + Відеокурс: Навчальний посібник- М.: Кращі книги. За редакцією В.Б. Ком'ягіна.
Flash 8. Просто як 2х2. А.А. Борисенко
ІНТЕРНЕТ: www.flashblog.ru; www.adobe.com

Минулого уроку ми ознайомили вас з автоматичною анімацією руху (Motion Tween), а тепер продовжимо розмову про автоматичну анімацію та розглянемо автоматичну анімацію формозміни (Shape Tween). Слід зазначити, що термін Shape Tween у різних виданнях перекладають по-різному, зокрема, зустрічається назва «анімація заповнення кадрів зі зміною форми». Втім, точно перевести це поєднання дуже складно, оскільки tween – це скорочення від між (між). Таким чином, мається на увазі, що даний виданімації будується з урахуванням початкового і кінцевого кадру, проте, що перебуває між цими кадрами, интерполируется за тими чи іншим алгоритмам. Анімація формозміни дозволяє створити ефект перетікання однієї фігури в іншу з одночасною зміною розташування, розміру та кольору фігур.

Слід зазначити, що анімацію формозміни можна застосувати лише до фігур, але не можна застосовувати ні до груп, ні до екземплярів, ні до растрових зображень. Щоб застосувати до цих об'єктів анімацію формозміни, їх необхідно спочатку розбити (break apart) на складові. Щоб розібратися в принципах створення автоматичної анімації формозміни, розглянемо простий приклад, у якому яблуко перетворюватиметься на грушу. Намалюйте замкнутий контур із заливкою у формі яблука, як показано на рис. 1.

Мал. 1. Контур із радіальною заливкою

Потім натисніть на ім'я шару намальованого об'єкта (в даному випадку ім'я шару за замовчуванням прийнято Layer 1) - шар стане виділеним (мал. 2), а внизу в панелі Properties з'явиться віконце Tween, в якому потрібно вибрати пункт Shape.

Мал. 2. У меню Tween слід вибрати пункт Shape

Тепер додамо кінцевий кадр – нехай формозміна відбуватиметься за 30 кадрів. Вставте ключовий кадр у 30-й кадр і помістіть замкнутий контур у формі груші (рис. 3). Зверніть увагу, що в нашому прикладі початковий та останній кадр відрізняються не лише формою контуру, а й кольором заливки.

Мал. 3. Помістимо результуючу форму у 30-й кадр

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

Мал. 4. У вікні Ease задається режим прискорення/сповільнення анімації

Аналогічно тому, як це реалізовано в автоматичній анімації руху, автоматичної анімації формозміни можливе завдання анімації з уповільненням або прискоренням. Продемонструємо цю можливість на прикладі. Виділіть шар і натисніть на трикутник поруч із віконцем Ease (мал. 4), внаслідок чого з'явиться повзунок, який дозволяє встановити режим прискорення/уповільнення. Щоб рух прискорився, необхідно ввести від'ємне число від –1 до –100, а для уповільнення процесу перетворення введіть позитивне число від 1 до 100. Задамо параметр Easing, наприклад, рівний +100, і отримаємо наступний фільм .

Мал. 5. Меню Blend, що випадає

Зверніть увагу на можливість вибору характеру анімації, що задається у меню Blend (мал. 5). У цьому меню можна вибрати два варіанти - Distributive, при якому проміжні фігури будуть гладкішими, і Angular, при якому фігури будуть незграбними.

Використання хінтів в анімації форми

У попередньому параграфі ми вивчали процес анімації формозміни, коли яблуко перетворюється на грушу. Логічним був би процес морфінгу, при якому гілочка переходить у гілочку, а плід у плід, а програма генерує проміжні кадри перетворення, «нічого не знаючи» про будову яблук і груш. Тому, якщо ми хочемо зберегти деяку логіку морфінгу, необхідно вказати програмі, які області мають наслідувати. З цією метою у програмі Flash використовуються так звані хінти (shape hints) контрольні маркери, за допомогою яких можна керувати процесом формозміни. Хінтами відзначаються точки, які повинні переходити самі в себе в початковій та кінцевій фігурах. Хінти позначаються буквами (від «a» до «z»).

Розглянемо як можна вдосконалити нашу анімацію за допомогою хінтів.

Виділимо перший ключовий кадр і виконаємо команду Modify => Shape => Add Shape Hint, в результаті виконання якої на фігурі з'явиться початковий хінт у вигляді червоного кружка з літерою "а". Пересунемо хінт у верхню точку гілочки (рис. 6).

Мал. 6. Процес установки хінту

Мал. 7. В останньому кадрі встановіть точку, в яку повинен переходити хінт

Перейдіть на останній ключовий кадр і виявите, що всередині контуру результуючої фігури з'явиться кінцевий хінт у вигляді зеленого кружка з літерою «a». Пересуньте хінт у точку, яка має відповідати першій зазначеній точці (рис. 7). Після того, як ви виставите на криву хінт в останньому кадрі, у першому кадрі хінт поміняє свій колір (з червоного на жовтий) - це означає, що встановлено відповідність між хінтами. Повторіть процес, додаючи нові хінти (рис. 8). Для отримання найкращих результатів слід розміщувати хінти проти годинникової стрілки, починаючи з верхнього лівого кута фігури.

Мал. 8. Положення хінтів у результуючій фігурі

Мал. 29. Створення мувікліпу «гілка»

Оскільки нашим завданням є побудова анімованого дерева, яке, у свою чергу, складається з гілок, перетворимо створену нами гілку на мувікліп, виконавши команду Modify => Convert to symbol (рис. 29). Тепер із сукупності кліпів «гілка» побудувати дерево (рис. 30). Як видно із рис. 30, кліп «гілка» багаторазово застосовується з різними трансформаціями (поворот, дзеркальне відображення та масштабування).

Мал. 30. На основі мувікліпів «гілка» будується дерево

Мал. 41. Додавання на сцену екземплярів символу Symbol 1 copy

Дублювати символ можна і за допомогою його екземпляра. Продемонструємо це на тому ж прикладі. Виділимо екземпляр символу Symbol 1 на сцені та виконаємо команду Modify => Symbol => Duplicate Symbol (рис. 42).

Мал. 42. Дублювання символу на основі екземпляра

Мал. 43. Панель Duplicate Symbol

Після цього з'явиться ще один символ – Symbol1 copy 2 (рис. 43). Двічі клацніть на ім'я нового символу у вікні бібліотеки, що викличе вікно редагування нового символу. Поміняємо положення аркуша в останньому кадрі, перейдемо до основної сцени та додамо кілька екземплярів нового символу. В результаті ми отримаємо остаточну версію

Експрес-план модуля:

Розрахункова анімація типу Shape
Звукові формати
Озвучування анімації

Розрахункова анімація типу Shape

Анімація типу Shape(Форма) дозволяє створювати ефекти - метаморфози, змушуючи одну форму «перетікати» в іншу. При цьому Flash дозволяє змінювати координати об'єкта, його розмір та колір.

Використовуючи цей тип анімації, ви повинні пам'ятати, що Flash працюватиме лише з графічними примітивами (лініями та заливками) і не зможе анімувати групи, символи, блоки тексту або растрові зображення. Для того, щоб таки використовувати ці елементи у своїй роботі, вам необхідно буде розбити їх на частини (примітиви), використовуючи команду Modify > Break Apart.

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

У першому кадрі за допомогою інструмента Oval у верхній частині сцени намалюйте коло. Потім перейдіть на 20 кадр і зробіть його ключовим. У нижній частині сцени на 20 кадрі намалюйте квадрат за допомогою інструмента Rectangle, а коло, попередньо виділивши інструментом Arrow, видаліть. Розмір намальованого квадрата повинен перевищувати розмір кола. Кольори кола та квадрата підберіть самостійно, встановити фігури на одній вертикалі ви зможете, використовуючи палітру Info.

Після того, як ви обіграєте всі ці моменти, поверніться до 1 кадру і, звернувшись до панелі Properties, в розділі Tween встановіть Shape. Зверніть увагу, що простір шару на палітрі Timeline між 1 і 20 кадром залилося світло-салатною фарбою і від 1 до 20 кадру простяглася стрілочка. Якщо замість стрілочки на палітрі простяглася пунктирна лінія, це означає, що ви щось зробили неправильно, наприклад, використовували у своїй роботі не графічні примітиви, а групу чи символи.

Протестуйте свій ролик, використовуючи команду Control > Test Movie.

Поекспериментуйте з палітрою Timeline. Ви можете керувати характером руху, використовуючи вже знайомий вам із матеріалу попередньої лекції розділ Ease, а також визначати характер способу трансформації форми у процесі її метаморфози. Для цього вам необхідно буде звернутися до розділу Blend(перехід), тут до вашої уваги будуть запропоновані два варіанти:

Distributive(розмазаний) – контури ліній та заливок у проміжних кадрах будуть згладжені.

Angular (незграбний)— контури ліній та заливок у проміжних кадрах зберігатимуть очевидні кути та прямі лінії.

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

Примітки:
У цій роботі частота кадрів складає 24 fps!

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

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

У цьому ролику є ще один шар background (нижній шар), на цьому шарі розташовані статичні елементи декорації.

Управління змінами форми за допомогою Shape Hint (вузлових точок форми)

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

Вузлові точки позначаються на зображенні невеликими кружальцями з літерами. Літери (від адо z) використовуються як імена (ідентифікатори) вузлових точок. Кожній вузловій точці на вихідному зображенні повинна відповідати точка з тим самим ім'ям на результуючому зображенні. Усього однієї фігури може бути використано трохи більше 26 вузлових точок (за кількістю літер алфавіту). Вузлові точки на вихідному зображенні пофарбовані в жовтий колір, що результує в зелений.

Для розміщення вузлових точок потрібно виконати такі дії:

Клацніть лівою кнопкою миші у кадрі, що відповідає вихідному зображенню.
Зверніться до меню Modify > Shape > Add Shape Hint(модифікувати > форма > додати вузлову точку) в результаті на сцені у вашому кадрі з'явиться «заготівля» першої вузлової точки — кружечко червоного кольору з літерою а.
Перемістіть його за допомогою інструмента Arrow при включеному модифікаторі Snap to Objects на ту точку зображення, яку ви хочете позначити як вузлову.
Клацніть лівою кнопкою миші на кадрі, який відповідає результуючому зображенню, на сцені також буде присутній червоний кружечок з тією ж літерою, що й у вихідному кадрі.
Перемістіть кружечок у точку зображення, яка повинна відповідати зазначеній у вихідному кадрі, після переміщення кружечок змінить колір на зелений.
Поверніться до першого кадру та переконайтеся, що колір вузлової точки змінився на жовтий.

Якщо потрібно продовжити розміщення вузлових точок, повторіть наведені вище дії.

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

У процесі розміщення вузлових точок доцільно періодично тестувати свій ролик. Щоб змінити положення вузлової точки, досить просто перетягнути її на нове місце (це можна зробити як на першому, так і на останньому кадрі послідовності). Крім того, можна видалити зайві точки або додати нові. Якщо результати вас цілком влаштовують, можете сховати вузлові точки. Всі перелічені операції найзручніше виконувати за допомогою контекстного меню. Щоб відкрити його, клацніть правою кнопкою миші на одній із вузлових точок. Меню містить чотири команди, з яких перші три доступні лише для вузлових точок вихідного зображення:

Add Hint(Додати вузлову точку) — під час виконання команди на сцені з'являється заготівля нової вузлової точки. Remove Hint(Видалити вузлову точку) — вузлова точка, на якій ви клацнули правою кнопкою миші, відкриваючи меню, буде видалено.
Remove All Hints(Видалити всі вузлові точки) – видалення всіх вузлових точок.
Show Hints(показати вузлові точки) — цей режим використовується за замовчуванням (поряд із ім'ям команди стоїть галочка). Повторний її вибір призведе до того, що вузлові точки стануть невидимими. Цей варіант слід використовувати лише після досягнення необхідного результату, оскільки для повернення в режим показу вузлових точок вам доведеться знову звернутися до меню Modify > Shape > Add Shape Hint.

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

Звукові формати

Звук є пружними хвилями, що поширюються в газах, рідинах і твердих тілах і сприймаються вухом людини і тварин. Людина чує звук із частотами від 16 Гц до 20 кГц. Звук із частотами до 16 Гц називають інфразвуком, 2·10 4 -10 9 Гц - ультразвуком, а 10 9 -10 13 Гц - гіперзвуком. У процесі оцифрування звуку виконується запис всіх його хвильових параметрів. Така запис називається імпульсно-кодової модуляцією і є послідовною запис дискретних значень. Розрядність пристрою, що обчислюється в бітах, говорить про те, скільки значеннями одночасно в одному записаному дискретному фрагменті, береться звук. Чим більша розрядність, тим більше звук відповідає оригіналу. Будь-який звуковий файл можна подати як базу даних. Вона має власну структуру, про параметри якої вказується зазвичай на початку файла. Потім йде структурований перелік значень щодо певних полів. Іноді замість значень стоять формули, що дозволяють зменшувати розмір файлу.

Познайомимося ближче з тими форматами звукових даних, які ми найчастіше використовуватимемо для озвучування роликів у Macromedia Flash.

WAV (waveform)— дискретний формат, призначений для зберігання та передачі аудіосигналу у цифровій формі, відрізняється високим ступенем якості та, на жаль, неймовірним розміром. У форматі wav можуть зберігатися стерео або монофонічні файли з розрядністю вибірки 8 або 16 біт. Крім звичайних дискретних значень, бітності, кількості каналів і рівнів гучності в wav може бути вказано ще безліч параметрів: мітки позицій для синхронізації, загальна кількість дискретних значень, порядок відтворення різних частин звукового файлу, а також є місце для того, щоб ви змогли розмістити там текстову інформацію.

MP3 (MPEG Layer3)— потоковий формат, призначений для зберігання та передачі аудіосигналу у цифровій формі, відрізняється високим ступенем компактності. Використовується головним чином для передачі аудіо в реальному часі мережевими каналами і для кодування CD Audio. Термін «струмовий» означає, що передача даних відбувається потоком незалежних окремих блоків даних — кадрів. Для цього вихідний сигнал при кодуванні розбивається на рівні за тривалістю ділянки, які називаються кадрами і кодуються окремо. При декодуванні сигнал формується із послідовності декодованих кадрів. Ширина потоку (bitrate) при кодуванні сигналу, аналогічного CD Audio (44.1kHz 16Bit Stereo) позначає загальну величину потоку - кількість інформації, що передається за одиницю часу. Ця величина варіюється від 320kbs (320 кілобіт на секунду, також пишуть kbs, kbps або kb/s), до 96kbs і нижче.

Озвучування анімації

Щоб додати звук до фільму, необхідно виконати такі дії:

Імпортуйте у фільм один або кілька звукових файлів у форматі wav або mp3. Для цього зверніться до меню File > Import (файл > імпорт). Файли будуть автоматично розміщені у бібліотеці вашого ролика у вигляді символів. Відкрийте бібліотеку ролика, використовуючи меню Window > Library, та перевірте це.

Створіть новий шар на панелі Timeline і розмістіть на ньому звуковий фрагмент, використовуючи символи у вашій бібліотеці — перетягніть його з бібліотеки на сцену. "Розгорніть" звук - додайте кадри (не ключові), використовуючи команду Insert Frame, таким чином, щоб на палітрі в цьому шарі хвильова форма звуку була повністю розгорнута. Flash дозволяє створювати кілька звукових шарів, і кожен з них буде працювати подібно до окремого звукового каналу. Це означає, що під час відтворення фільму звуки на різних шарах, що збігаються в часі, відтворюються одночасно.

Перейдіть на перший кадр шару зі звуком і зверніться до панелі Properties розділу Sound(Звук). Якщо у вашій бібліотеці розміщено декілька звукових фрагментів, то, використовуючи спадний список цього розділу, ви зможете в будь-який момент замінити вибраний вами звук на який-небудь інший. У нижній частині панелі ви бачите вихідні параметри звукового фрагмента: ширина смуги частот, моно/стерео, розрядність, тривалість, об'єм пам'яті.

У списку, що розкривається Sync(synchronize – синхронізувати) виберіть спосіб синхронізації звуку:

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

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

Stop(стоп) – відтворення вказаного звуку припиняється.

Stream(Потік) - потоковий звук. Flash забезпечує «насильницьку» синхронізацію анімації та потокового звуку (наприклад, якщо кадри анімації не встигають відтворюватися на Web-сторінці з такою самою швидкістю, як і потоковий звук, Flash-плеєр пропускає деякі кадри). Відтворення потокового звуку завжди припиняється після завершення анімації. Крім того, потоковий звук ніколи не продовжується довше, ніж відтворюються пов'язані з ним кадри анімації.

Число повторень звуку можна задати у розділі Loop(Цикл). Режим "нескінченного" відтворення не реалізований, але його можна змоделювати, ввівши в цьому розділі досить велику кількість.

Можна встановити звукові ефекти, що впливають на гучність звуку. Заздалегідь підготовлені налаштування вибирають у списку, що розкривається Effect(ефект):

None— немає жодних ефектів, цей пункт слід вибрати у тому випадку, якщо вибрані вами ефекти вам не сподобалися.

Left Channel- Запускає звук тільки в лівому каналі.
Right Channel- Запускає звук тільки в правому каналі.
Fade Left to Right- Плавний перехід звуку між каналами зліва направо.
Fade Right to Left- Плавний перехід звуку між каналами справа наліво.
Fade In- Поступове збільшення амплітуди звуку.
Fade Out- Поступове зменшення амплітуди звуку.

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

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

Інші елементи управління служать лише зручності роботи. Так, змінити масштаб тимчасової осі можна за допомогою кнопок Zoom In та Zoom Out. Змінити спосіб представлення шкали часу можна за допомогою кнопок Seconds(секунди) та Frames(Кадри).

Якщо ви не маєте власної бібліотеки звукових фрагментів, ви можете скористатися бібліотекою Macromedia Flash, для цього зверніться до меню Window > Common Libraries > Sounds.

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

У процесі роботи над мультиплікаційним чи інтерактивним роликом у вас, безумовно, виникне бажання записати свій власний музичний чи мовний фрагмент. Отже, ви записали якийсь звук за допомогою мікрофона і зберегли його як якийсь sound.wav.

Будь-який wav-файл має досить великий розмір, але це легко усувний недолік, адже ми можемо конвертувати його в mp3-файл за допомогою PlayCentre, а також відкоригувати цей фрагмент за допомогою спеціальних програм, наприклад, Sound Forgeабо Steinberg Wave Lab.

Під час запису з мікрофона з'являються паузи до і після звукового фрагмента (наприклад, слова). З'являється шум. Спотворюється голос. Всі ці недоліки, використовуючи вищезазначені програми, зможе легко усунути навіть новачок.

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

Домашнє завдання: Основи створення анімації в Macromedia Flash MX

По-перше, вам необхідно продублювати анімаційні flash-ролики, представлені у матеріалі цієї лекції.

По-друге, створити ролик, що дозволяє проілюструвати чудові рядки з вірша Сергія Олександровича Єсеніна:

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

Разом: з вас чотири файли у форматі fla (якщо сумарний розмір файлів перевищить 150 Кб, будь ласка, запакуйте файли в архів) і надішліть вчителю.

Бажаю Вам успіхів у самостійному вивченні Macromedia Flash MX!