Создание ролика в macromedia

Обновлено: 07.07.2024

Мультипликационное кино (анимационное кино) это вид киноискусства, произведения которого создаются путём съемки последовательных фаз движения рисованных (графическая мультипликация) или объёмных (объёмная мультипликация) объектов.

Мультипликация (анимация) основана на свойстве человеческого зрения «помнить» изображение в течение некоторого времени, после того как наблюдение прекращается. Анимация представляет собой последовательную демонстрацию серии кадров. Каждый кадр изображается некоторое время, после чего он удаляется, и на его месте появляется новый.

Зачинателем графической мультипликации является французский художник-карикатурист Э. Коль. В 1908 году во Франции был выпущен первый рисованный мультфильм. Первые объёмные мультфильмы были поставлены в России в 1911—1913 году режиссёром Старевичем Владиславом Александровичем.

Большое влияние на развитие мультипликационного кино оказало творчество американского режиссёра Уолта Диснея. В 1928 году в серии мультфильмов «Пароходик Вилли» Дисней впервые использует звук и включает в игру просто потрясающий персонаж — забавного мышонка с большими ушами и нахальной мордашкой. Успех оказался ошеломляющим — этот мультфильм создал имя режиссёру и положил начало триумфальному шествию Микки-Мауса (так сократили имя главного персонажа) по экранам всего мира. В 1932 году за создание этого персонажа Дисней удостоился «Оскара». Во второй половине 1930-х годов на смену Микки-Маусу приходит новый персонаж — утёнок Дональд. А в 1937 году выходит первый полнометражный фильм студии Уолта Диснея «Белоснежка и семь гномов», ставший вершиной её коммерческого успеха — премия «Оскар», премия Венецианского кинофестиваля. Окрыленный успехом, Дисней финансирует выпуск таких полнометражных лент, как «Пиноккио» (1940), «Дамбо» (1941), «Бэмби» (1942). И по сей день, мультфильмы студии Уолта Диснея радуют зрителей всех стран мира.

В 1936 году на базе различных мастерских в Москве была создана студия мультипликационных фильмов — «Союзмультфильм». Именно здесь получили путёвку в жизнь такие замечательные мультфильмы как: «Серая шейка», «Конёк-Горбунок», «Золотая антилопа», «Чудесница», «Варежка», «Каникулы Бонифация», «Летучий корабль», «Чебурашка», «Крокодил Гена», «Бременские музыканты», «Левша», «Умка», «Трое из Простоквашино», серии фильмов «Приключения кота Леопольда», «Ну, погоди!» и множество других. В связи с эти нельзя не вспомнить несколько имён сыгравших огромную роль в развитии советской мультипликации. Низкий поклон Котёночкину Вячеславу Михайловичу — российскому кинорежиссеру-мультипликатору, художнику — который поставил замечательную серию «Ну, погоди!» (1969—92), а также «Лягушку-путешественницу» (1965) и много других прекрасных мультфильмов. Огромное спасибо Хитруку Фёдору Савельевичу — российскому режиссеру-мультипликатору, художнику за серию мультфильмов «Винни-Пух» (1969—1972) … Все эти замечательные мультфильмы сыграли немаловажную роль в воспитании нескольких поколений и до сих пор собирают у экранов огромное количество поклонников, всех возрастов.

Компьютерная анимация

Для пользователей Internet уже давно стали привычными появляющиеся почти на каждой web-странице «живые» мультипликационные картинки. Именно такими, анимационными, в большинстве случаев являются рекламные баннеры. Это и понятно: анимация привлекает внимание посетителей и, кроме того, на небольшой площади можно поместить значительно больше информации за счёт чередующихся кадров.

В прошлом в традиционной анимации кадры рисовались «вручную». В последние годы анимационные технологии переведены на компьютерную основу. И хотя концепции разработки анимации остались прежними, используемые методы значительно отличаются. Ключевым моментом, определяющим качество любой анимации и фильма вообще, является количество кадров, использованных для их создания. Чем больше кадров содержит анимация, тем более сглаженным будет движение в процессе проигрывания. Когда кадров недостаточно, движение будет неравномерным, толчкообразным.

Если в традиционной анимации увеличение количества кадров лишь увеличивает длительность их проигрывания, то в компьютерной анимации, создаваемой для web, одновременно увеличивается размер файла и время его загрузки в сети. При подготовке анимации для web-страниц должно быть найдено разумное равновесие между её качеством и размером файла, поскольку и то и другое зависит от количества кадров. Найти наилучший вариант не так просто. Но приобретаемый со временем опыт будет подсказывать вам правильное решение.

В настоящее время существует несколько технологий создания анимации для www: gif, Flash, Java и JavaScript

Из этих технологий анимационный gif является, пожалуй, самым простым в создании, и практически любой современный браузер может его показать. Анимационные gif-файлы могут быть легко подготовлены в программах Adobe ImageReady или Ulead GIF Animator.

В отличие от gif-анимации, которая позволяет размещать в файле только изображения, Flash-технология предоставляет возможность объединить в одном формате анимацию, звук, текст, графику и, кроме того, элементы интерактивности, которые дают возможность пользователю или посетителю сайта определенным образом изменять данные на web-странице, превращая его из наблюдателя в активного участника. Интерактивными элементами сайта могут быть игры, онлайновые обучающие программы, викторины, тесты и т.п.

Покадровая и расчётная Flash-анимация

Для начала следует понять: в чём секрет компактности роликов, созданных в Macromedia Flash? Основная причина состоит в том, что Flash реализует анимацию векторных объектов. На практике это означает, что для создания мультипликационного или интерактивного ролика нам нужно только один раз создать анимируемый объект, а в дальнейшем просто манипулировать его атрибутами и формой, создавать экземпляры этого объекта, дублировать объект программно, в общем, фантазировать сколько душе угодно. Помимо этого Flash несколько изменяет основные принципы классической мультипликации, позволяя наряду с покадровой анимацией создавать так называемую расчётную анимацию.

Использование покадровой анимации неизбежно при создании мультфильмов. При этом нам с вами придётся прорисовывать все кадры, отражающие процесс изменения формы или движения. В случае использования расчётной анимации нам необходимо будет прорисовать только ключевые кадры, а изображение в кадрах, находящихся между ключевыми, Flash сгенерирует программно, значительно облегчив при этом нашу работу. К элементарным преобразованиям, которыми мы с вами можем манипулировать при создании расчётной анимации, относятся: изменение координат, размеров, масштаба, угла поворота, формы, цветовых атрибутов контура и заливки объекта.

Расчётная анимация может быть реализована двумя способами:

Анимация формы — Tween Shape

Анимация движения — Tween Motion

Принципиальное отличие между этими способами состоит в том, что в первом способе Flash работает с графикой как с набором графических примитивов (линий, дуг, окружностей, прямоугольников, заливок и т.д.), а во втором случае Flash будет работать только со сгруппированными объектами или символами.

Палитра, в которой создаётся анимация, вам уже хорошо знакома — это Timeline (временная линейка), но её потенциал не был раскрыт в материале 1 курса, так как в своей работе на сцене мы использовали только один кадр.

Основные правила маркировки кадров в палитре Timeline

Пустые кадры изображаются на белом фоне. Пустые ключевые кадры содержат пустые кружочки. Когда вы создаёте во Flash новый ролик, то на палитре Timeline вы видите единственный ключевой кадр, маркированный пустым кружочком.
Кадры, в которых имеются какие-то «персонажи» (например, вы сделали один мазок кистью) изображаются на сером фоне. Ключевые кадры содержат чёрные кружочки.
Кадры, в которых организована промежуточная анимация движения — Tween Motion, изображаются на сиреневом фоне. Ключевые кадры содержат чёрные кружочки, а через промежуточные (неключевые), проходит чёрная стрелка.
Кадры, в которых организована промежуточная анимация формы — Tween Shape, изображаются на зелёном фоне. Ключевые кадры содержат чёрные кружочки, а через промежуточные (неключевые) проходит чёрная стрелка.

Рисунок представленный в этой лекции мне хотелось бы прокомментировать подробней. Обратите внимание, что на слои я не скупилась. Персональные слои были созданы: для акций — 1_Action, для звукового фрагмента — 6_Sound, и для слоя с декорациями — 7_Background. Каждой анимации также предоставлена «отдельная жилплощадь»!

Некоторые слои имеют специфическую маркировку. Например, слой Guide: Motion_G (слой-гид — направляющий) на котором с помощью инструмента Pencil была определена траектория движения объекта расположенного слоем ниже. Ещё один замечательный и весьма примечательный слой — слой Mask (маска), который позволяет создавать очень интересные эффекты для объектов расположенных слоем ниже. В обоих случаях мы видим явную зависимость слоёв — зависимые слои немного сдвинуты вправо на палитре Timeline.

Частота кадров (fps — frame-per-second — кадров в секунду)

Стандартная частота кадров в профессиональном кинематографе составляет 24 кадра в секунду. В любительском кинематографе 16 кадров в секунду. Частота смены кадров на экране телевизора, для принятого в России и в Казахстане стандарта составляет 25 кадров в секунду. Flash устанавливает по умолчанию 12 кадров в секунду это наилучшая установка для Internet. Вы можете изменить это значение, воспользовавшись палитрой Properties. Обратите внимание, что, определяя значение fps, вы назначаете его для всего ролика, рекомендуется выставлять это значение заранее, до создания анимации.

Уменьшение частоты кадров позволяет получить эффект замедленного движения. Увеличение частоты кадров позволяет получить эффект ускоренного движения, при этом объекты могут «размазываться» из-за слишком быстрого движения.

«Удлинение» статичных иллюстраций (создание декораций для нескольких кадров)

При создании декораций для анимированного ролика очень часто возникает необходимость «растянуть» декорации на несколько кадров. Например, разыгрываем сцену, разворачивающуюся на дачной веранде — на переднем плане: плетёное кресло, стол, на котором стоит ваза с букетом из осенних листьев, на заднем плане: яблоневый сад и пруд — всё это статические объекты которые следует расположить на ключевом кадре слоя с декорациями, а затем растянуть эту иллюстрацию на несколько кадров. Как это сделать?

В первом ключевом кадре слоя располагаем декорации. Затем добавляем несколько кадров (не ключевых!). Для этого вы должны перейти на тот кадр в палитре Timeline, до которого вы хотели бы «растянуть» декорации (в этом примере это 15 кадр) и затем щёлкнуть правой кнопкой мыши и в появившемся меню выбрать пункт Insert Frame (вставить кадр) или нажмите клавишу F5.

Создание покадровой анимации

В покадровой анимации содержание сцены изменяется в каждом кадре, без неё невозможно обойтись при создании анимированного персонажа. Например, посадим на кресло, стоящее на дачной веранде пушистого котёнка, ушки у котёнка шевелятся, хвостик виляет…

Итак, создаём новый слой, и рисуем в первом кадре этого слоя очаровательного пушистого котёнка. Для того чтобы создать ещё один ключевой кадр, щёлкните правой кнопкой мыши и в появившемся меню выберите пункт Insert Keyframe (вставить ключевой кадр) или нажмите клавишу F6. Обратите внимание, что второй кадр полностью дублирует первый. Измените содержание второго кадра в соответствии с требованиями вашей анимации…

В ходе работы над персонажем вы можете использовать инструменты рисования, работать с буфером обмена, импортировать графику. Полезно периодически просматривать результаты своей работы, используя уже знакомую вам команду Control > Test Movie.

Домашнее задание: Основы создания анимации в Macromedia Flash MX

Завершите работу над сценой, представленной в этой лекции.

В домашних заданиях второго курса будут звучать строки из стихотворений Сергея Александровича Есенина:

Закружилась листва золотая
В розоватой воде на пруду,
Словно бабочек лёгкая стая
С замираньем летит на звезду…

Выполненное задание представьте в виде файла в формате fla (если размер файла превышает 150 Кб, пожалуйста, упакуйте его в архив) и вышлите учителю.

Тест: Основы создания анимации в Macromedia Flash MX

В материалы теста входят вопросы, которые позволят вам проверить прочность знаний полученных в ходе работы над первым модулем курса.
Тест создан в Macromedia Flash MX и представляет собой интерактивный flash-ролик: Загрузить тест в новом окне

5.1. На панели инструментов выбрать Текст (T), произвести в центре рисунка надпись “Уроки Flash”.

5.2. Выделить правой кнопкой кадр 40 слоя Монитор и Надпись Уроки Flash, выбрать Вставить ключевой кадр.

5.3. Кликнуть правой кнопкой по кадру 1 слоя Надпись Уроки Flash , выбрать Создать двойное движение.

5.4. Находясь в 1-м кадре, кликнуть правой кнопкой мыши по надписи Уроки Flash, выбрать Масштаб, угловыми маркерами уменьшить надписи Уроки Flash.

5.5 Для проверки анимации нажмите CTRL+ENTER.

6. Создать Слой 3, переименовать в Надпись Устройство компьютера.

6.1. Кликнуть правой кнопкой по кадру 54 слоя Монитор, выбрать Вставить ключевой кадр.

6.2. Перейти в кадр 41 слоя Надпись Устройство компьютера, нажать F6 (создать новый кадр), на панели инструментов выбрать Текст (T), произвести в центре изображения монитора надпись “Устройство компьютера”.

6.3. Кликнуть правой кнопкой по кадру 54, выбрать Вставить ключевой кадр.

7. Создать Слой 4 переименовать в Надпись Монитор.

7.1. Кликнуть правой кнопкой по кадру 85 слоя Монитор, выбрать Вставить ключевой кадр.

7.2. Перейти в кадр 55 слоя Надпись Монитор, нажать F6 (новый кадр), на изображении монитора компьютера сделать надпись – “Монитор – устройство вывода информации”.

7.3. Кликнуть правой кнопкой по кадру 85, выбрать Вставить ключевой кадр.

7.4. Кликнуть правой кнопкой по кадру 55, выбрать Создать двойное движение.

7.5. Находясь в 55 кадре кликнуть правой кнопкой по надписи “ Монитор – устройство вывода информации”, выберите Масштаб, угловыми маркерами уменьшите надпись.

7.6. Для проверки анимации нажмите CTRL+ENTER.Надпись “ Монитор – устройство вывода информации” должна увеличиваться на изображении монитора

8. Создать Слой 5,переименовать в Системный блок.

8.1. Сделать ключевым кадр 185 Слоя Монитор.

8.2. В кадре 86 Слоя Системный блок (нажав предварительно F6) нарисовать изображение системного блока, расположить рисунок за границей сцены.

8.3. Сделать ключевым кадр 185 Слоя Системный блок.

8.4. В кадре 86 создать двойное движение.

8.5. “Перетащить” изображение системного блока кадра 185 к изображению монитора.

8.6. При нажатии CTRL+ENTER изображение системного блока от правой части экрана должно плавно переместиться к изображению монитора.

9. Создать Слой 6, переименовать в Надпись Системный блок.

9.1. В кадре 86 (нажав F6) Слоя 6 сделать надпись “Системный блок”.

9.2. Создать двойное движение до кадра 185 (предварительно сделав его ключевым).

9.3. Переместить надпись “Системный блок” кадра 185 от изображения монитора к изображению системного блока.

9.4. При нажатии CTRL+ENTER надпись “Системный блок” должна перемещаться навстречу движущемуся изображению системного блока.

10. Создать Слой 7, переименовать в Устройство Системного блока.

10.1. В 130-м кадре Слоя 7 (F6) сделать надпись “Cодержит материнскую плату, ОЗУ, ПЗУ, HDD, FDD, CD-ROM”. Создать двойное движение до 185 кадра (предварительно сделав его ключевым). Создать анимацию надписи. Произвести проверку - CTRL+ENTER .

11. Создать Слой 8, переименовать в Клавиатура.

11.1. Сделать ключевым кадр 210 Слоя Монитор.

11.2. Нарисовать клавиатуру в кадре 186 слоя Клавиатура(F6-новый), кадр 210 сделать ключевым.

11.3. Сделать надпись “Клавиатура – устройство ввода информации” на изображении монитора компьютера.

11.4. Произвести проверку - CTRL+ENTER .

12. Создать Слой 9, переименовать в Системный блок 2.

12.1. Скопировать изображение системного блока из слоя Системный блок в кадр 186, кадр 210 сделать ключевым.

12.2. Произвести проверку - CTRL+ENTER.

13. Настройка параметров документа сцены 1:

13.1. Выполнить команду Изменить - Документ (Ctrl+J).

13.2. В диалоговом окне Свойства документа установить Размеры: 550 px, 400 px, фоновый цвет – белый, частота кадров -12 fps, ОK.

14. Сохранение файла.

14.1. Выполнить команду Файл – Сохранить как. Открыть свою папку, создать папку Flash, в ней папку Компьютер, сохранить файл под именем PC.fla.

14.2. Выполнить команду Файл - Общие настройки. В окне Настройки опубликования выбрать файлы с расширением swf, html, jpg, exe. Кликнуть по кнопке Публиковать, нажать ОК.

Анимация во Flash основана на изменении свойств объектов, используемых в “мультике”. Например, объекты могут исчезать или появляться, изменять свое положение, форму, размер, цвет, степень прозрачности и т. д.

покадровая (“классическая”) анимация, когда автор сам создает или импортирует из других приложений каждый кадр будущего “мультика” и устанавливает последовательность их просмотра;
автоматическое анимирование (так называемая tweened-анимация), при использовании которой автор создает только первый и последний кадры мультипликации, а Flash автоматически генерирует все промежуточные кадры; различают два вида tweened-анимации: анимация, основанная на перемещении объекта (motion animation), и анимация, основанная на трансформации (изменении формы) объекта (shape animation);
анимация на основе сценариев; сценарий представляет собой описание поведения объекта на собственном языке Flash, который называется ActionScript; синтаксис этого языка напоминает синтаксис других языков сценариев, используемых в Web-публикациях (например, JavaScript и VBScript).

во-первых, автор избавлен от необходимости создавать каждый кадр в отдельности;
во-вторых, для воспроизведения такого “мультика” Flash достаточно хранить только первый и последний кадры, что обеспечивает значительное уменьшение объема такого фильма.
Вместе с тем, tweened-анимация пригодна для создания лишь наиболее простых сюжетов, в которых свойства объектов изменяются равномерно.
С помощью сценариев на ActionScript можно описать достаточно сложное поведение объектов, однако. Однако для этого нужно изучить язык ActionScript.
Другими словами, прежде чем приступить к созданию собственного “мультика”, следует определиться с выбором механизма его реализации.

Если в рабочей области редактируется графическое содержимое, то в шкале времени фактически пишется сценарий флэш-фильма.

Линейка - отображает все кадры по возрастающей. Числом отмечен каждый пятый кадр.

Указатель шкалы времени - выполняет ту же функцию, что и инструмент Стрелка в рабочей области. Он выделяет кадр, для последующей с ним работы.

Чтобы выделить конкретный кадр, щелкните по нему левой клавишей мыши.

Наша анимация состоит из последовательности кадров. Кадр может быть как составленным вручную, так и сгенерированным Flash. Это относится к кадрам одного слоя. Так как сцены Flash состоят обычно из нескольких слоев, то итоговые "многослойные" кадры, могут содержать, как сгенерированные, так и "самодельные" слои.

Ключевой кадр - кадр доступный для обработки. В анимации этот кадр будет отображаться так, как нарисует пользователь. На временной шкале ключевой кадр отображается чёрным кружочком, если в нём есть изображение, и белым, если нет никакого рисунка.

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

Раскадровка - автоматический переход изображения из одного ключевого кадра в другой.

Кадр-фантом - пустая клетка на временной диаграмме, в которой может быть установлен либо ключевой кадр, либо обычный кадр.

По кадровое формирование изображения.

Самое простое формирование анимации - это по кадровое изменение рисунка, т.е. на каждом кадре изменяется положение объекта, его характеристики, или добавляются новые и удаляются старые объекты.

Элементарные операции с кадрами:

Действие	Контекстное меню	Комбинация клавиш	Примечание
Вставить пустой ключевой кадр	Вставить пустую клавиатуру	F7
Ключевой кадр, повторяющий содержание предыдущего	Вставить клавиатуру	F6	Если перед вставляемым кадром уже был ключевой кадр, содержащий объекты, то они будут скопированы в создаваемый кадр.
Очистить ключевой кадр	Очистить клавиатуру	Shift-F6
Вставить обычный кадр	Вставить кадр	F5	Вставляя обычный кадр (не ключевой), увеличиваем время анимации или время отображения предыдущего ключевого кадра.
Удалить кадр	Стереть кадры	Shift-F5

Покадровая анимация – это анимация, полностью составленная из ключевых кадров. Т.е. вы сами определяете, как содержимое кадра, так и его "длительность" (т.е. сколько таких статических кадров будет занимать изображение).

Достоинства: Покадровая анимация дает вам, в некотором смысле, больший контроль над анимацией, и если вы опытный аниматор, вы можете выгодно ею пользоваться. Это единственный способ организовать смену абсолютно независимых изображений – слайд-шоу (например, создавая обычный баннер средствами Flash).
И все остальное, что вытекает из возможности прорисовывать каждый кадр вручную.

Недостатки: Покадровую анимацию сложно модифицировать. Особенно, если это не дискретный набор изображений, а связанная анимация. Приходится модифицировать все кадры. На деле, у опытных Flasher-ов, такая ситуация практически не встречается.
Покадровая анимация занимает достаточно большой объем, так как приходится хранить информацию о каждом кадре.

Практическая работа № 1.

Создание покадровой анимации

Рассмотрим технологию покадровой анимации на примере создания анимированного заголовка "Анимация во Flash".

1. Выберите Документ Flash.

2. Выберите инструмент Стрелка и кликните левой клавишей мыши в первом кадре шкалы времени (Выбор кадра).

3. Выберите инструмент Текст и задайте параметры его модификаторов (тип шрифта, размер, цвет и пр.).

4. Кликните левой клавишей мыши в левом верхнем углу сцены, чтобы установить текстовую метку.

5. На клавиатуре наберите заглавную букву А. <Рисунок2>

6. Для того, чтобы в анимации буквы в разных кадрах располагались на одной линии, воспользуемся инспектором объектов. Для этого выберите инструмент Стрелка и кликните левой клавишей мыши на букве А. Чтобы оптимизировать площадь заголовка, задайте нулевые координаты в строках X и Y. Буква А будет размещена в самой верхней левой точке основной сцены. <Рисунок3>

7. Для формирования следующего кадра, в котором будет появляться новая буква, необходимо выполнить следующие действия: Кликните левой клавишей мыши в следующем пустом кадре шкалы времени. (Он станет темным).

8. Выберите Вставить клавиатуру или просто нажмите на клавиатуре клавишу F6. В кадре шкалы времени появится черная точка.

9. Выберите инструмент Текст и если это необходимо задайте новые параметры его модификаторов (тип шрифта, размер, цвет и пр.). Для лучшего усвоения технологии покадровой анимации будем рассматривать пример без изменения параметров модификаторов текста.

10. Кликните левой клавишей мыши рядом с предыдущей буквой, чтобы установить текстовую метку.

11. На клавиатуре наберите следующую букву. <Рисунок 4>

12. Выберите инструмент Стрелка и кликните левой клавишей мыши на новой букве. С помощью этого же инструмента букву, как графический объект, можно перемещать.

13. Задайте нулевую координату в строке Y, для того, чтобы все буквы располагались на одной прямой.

Тестирование анимации

Для того чтобы протестировать полученную анимацию:

1. Выберите в главном меню Регулировака – Проверить клип или просто нажмите на клавиатуре клавиши Ctrl-Enter.

2. Просмотрев анимацию, нажмите левой клавишей мыши в правом верхнем углу окна тестирования кнопку Закрыть окно (Х).

Формирование оптимальной сцены анимации

Перед публикацией в Web обрежем все лишнее:

1. Выберите в главном меню Преобразовать – Документ или на клавиатуре нажмите клавиши Ctrl+J.

2. В открывшемся окне Характеристики документа нажмите на клавишу Содержимое. <Рисунок6>

В результате сцена примет размеры содержимого анимации.

3. Сохраните файл под именем pr_1.fla.

Анимация с построением промежуточных кадров

Гораздо эффективнее другой тип анимации, когда создаются только начальный и конечный кадры некоторого фрагмента, а все промежуточные кадры система достраивает сама. Такой тип анимации называется автоматический (tweened-анимация).

При этом способе анимации Flash автоматически строит промежуточные кадры между ключевыми кадрами, заданными вами. Это означает, что вы рисуете объект, потом на другом кадре производите изменения и просите Flash рассчитать те кадры, которые лежат между этими двумя ключевыми кадрами. Он выполняет эту работу, и вы получаете плавную анимацию.

Скорость и плавность анимации зависят от количества кадров, которые вы отводите под движение и скорости вашего Flash фильма. Скорость фильма можно изменить здесь: Выберите в главном меню Преобразовать – Документ или на клавиатуре нажмите клавиши Ctrl+J. В открывшемся окне Характеристики документа параметр Частота смены кадра задает количество кадров в секунду. Для качественной анимации скорость должна быть не меньше 25-30 кадров в секунду.

Плавность и длительность задается количеством кадров, отведенных на анимацию (ее фрагмент). Например, если скорость вашего фильма - 30 кадров/сек., и вам нужно совершить перемещение, скажем, самолетика, из одного угла картинки - в другой за 2.5 секунды, то на это движение вам нужно отвести 75 кадров.

Во Flash существует два варианта построения промежуточных изображений - motion tweening (анимация движения) и shape tweening (построение анимации на основе изменения формы). Эти способы отличаются в корне. Первый используется чаще всего, т.к. с помощью него можно построить подавляющее большинство анимации. Второй применяется в случаях, когда нужно плавное изменение формы.

Практическая работа №2. Анимация перемещения объекта

1. В левом верхнем углу нарисуйте квадрат.

2. Первый кадр шкалы времени видоизменился – окрасился в бледно-красный цвет, и в нем появилась жирная точка – признак того, что кадр стал ключевым.

3. Вызовете контекстное меню и выберите “Создать промежуточное изображение”. <Рисунок7>

4. Вызовете контекстное меню в кадре диаграммы времени, где предпочитаете закончить анимацию и выберите команду “Вставить клавиатуру”

5. С помощью инструмента “Средства Выделения” (V) переместите объект в новое положение, но в начале проверьте, что вы находитесь в последнем ключевом кадре. <Рисунок8>

6. Отмените выделение объекта, и нажмите Enter – объект пришел в движение.

7. Для замедления движения надо переместить влево конечный ключевой кадр, для ускорения – вправо. Выделите слой.

8. Нажмите и не отпускайте клавишу Ctrl. Наведите курсор на ключевой кадр – указатель превратился в двунаправленную стрелку.

10. Сохраните файл под именем pr_2.fla. <Приложение2.>

Практическая работа №3. Анимация изменения размера объекта

1. Создайте новый файл.

2. В 1-м ключевом кадре – создать промежуточное изображение.

3. Выберите время анимации и команду “Вставить клавиатуру”.

4. Измените размер объекта конечного ключевого кадра, используя инструмент “Свободная трансформация” (Q).

5. Протестируйте проект.

6. Сохраните файл под именем pr_3.fla.

Практическая работа №4. Анимация изменения цвета объекта

1. Создайте новый файл, нарисуйте новый объект и примените к нему правила создания анимации движения.

2. Находясь в конечном ключевом кадре выделите объект инструментом “Средства Выделения” (V). В результате в панели “Свойства” высветится поле “Цвет”. Выбрать вариант “Тон”, появятся дополнительные поля, с помощью которых можно выбрать цвет. <Рисунок9>

3. Сохраните файл под именем pr_4.fla. <Приложение3>

Некоторые особенности анимации

Одновременно можно изменять несколько свойств объекта. Для этого в конечном ключевом кадре необходимо указать их новые значения, например, переместить объект и одновременно изменить его размер.

Можно задать анимацию, не изменяя ни одного свойства. В результате объект “замрет” на протяжении указанного промежутка времени

Практическая работа №5. Создание анимации постепенно исчезающий рисунок

Объект маленький квадрат, расположен в левом верхнем углу кадра; анимация включает в себя следующие пять шагов:

1. Квадрат увеличивается.

2. Квадрат движется направо строго горизонтально и останавливается у правой границе кадра.

3. Квадрат движется по направлению к левому нижнему углу, изменяя свой цвет, и останавливается в точности под своим увеличенным на 1-м шаге изображением.

4. Квадрат некоторое время стоит неподвижно.

5. Квадрат возвращается в исходное положение с изменением размера до первоначального.

Сохраните файл под именем pr_5.fla. <Приложение4>

Практическая работа №6. Морфинг

Морфинг - это трансформация объектов. Например из квадрата может получится круг, а из круга, объект, который захотите.

1. Создайте новый файл.

2. Нарисуйте круг.

3. Выделите ключевой кадр и выберите на панели Свойства – Твин – Форма. <Рисунок10>

4. Выберите 20 кадр и нажмите F6.

5. Измените круг используя инструмент Выделение (заливку можно сделать другого цвета, получится очень красиво!).

Покадровая анимация является самой простой формой анимационных изображений в программе Macromedia Flash Professional 8. Покадровая анимация характеризуется использованием уникальных изображений в каждом кадре, и потому очень подходит для создания сложных анимаций, в которых каждое движение будет индивидуальным и неповторимым. Конечно, для создания неповторимых изображений в каждом кадре может потребоваться масса терпения и выдержки, а также большое количество времени, но результат может превзойти все ожидания.

Применение покадровой анимации также увеличивает размер итогового файла видео, так как вес имеет каждый кадр. В программе Macromedia Flash Professional 8 каждый кадр, содержащий уникальное изображение, называется ключевым кадром. Для создания покадровой анимации нужно нарисовать уникальное изображение в каждом кадре, и таким образом каждый кадр становится после этого ключевым.

Добавление ключевых кадров в Macromedia Flash Professional

Для того, чтобы добавить ключевой кадр, выделите на временной ленте кадр, который будет ключевым, и выберите в меню Insert — Timeline — Keyframe . Можно также для создания ключевого кадра кликнуть на нужном кадре правой клавишей мыши, и выбрать команду Insert Keyframe .

Обратите внимание: при создании нового документа первый кадр является ключевым в любом случае. А вот остальные ключевые кадры нужно создавать.

Например, выберите десятый кадр, и сделайте его ключевым. При этом в изображении кадра появится точка. Теперь Вы можете проигрывать анимацию. Для этого достаточно нажать Enter на клавиатуре компьютера, и Вы увидите, как воспроизводящая головка побежит по временной ленте, воспроизводя каждый кадр по очереди. Теперь осталось только сделать ключевые кадры в тех местах, которые Вам нужны, и создать в них изображения.

Ключевыми кадрами можно сделать не все кадры. Допустим, Вы сделали ключевыми кадры 1, 5, 6, 7 и так далее. Изображение, которое Вы создадите в кадре 1, будет оставаться видимым, пока не дойдет очередь до кадра 5. Таким образом Вы как-бы увеличиваете длительность проигрывания первого кадра в пять раз.

Создание покадровой анимации

Сделайте изображение в первом кадре.
Выберите кадр, с которого начнется анимация. Сделайте его ключевым с помощью меню Insert — Timeline — Keyframe , или с помощью клика правой клавишей мыши Insert Keyframe .
Измените изображение в новом ключевом кадре.
Продолжайте добавлять новые ключевые кадры и изменять их содержимое до тех пор, пока анимация не будет готова.
Протестируйте Вашу покадровую анимацию, нажав Enter или выбрав в меню Controle — Play .

Копирование изображений при создании покадровой анимации

Для создания изображений в ключевом кадре может возникнуть необходимость копирования изображения, которое есть в другом кадре. Для этого выделите кадр, изображение которого будете копировать, и выберите в меню Edit — Select All , или нажмите клавиши Ctrl+A . Все изображение станет выделенным. После этого копируете изображение с помощью меню Edit — Copy (или Ctrl+C ), затем выделяете ключевой кадр, в который Вы будете копировать изображение, и выбираете меню Edit — Paste in Place (или Ctrl+Shift+V ). Изображение будет вставлено в новый ключевой кадр, и Вам останется только его отредактировать.

Еще проще скопировать сам ключевой кадр, и вставить его в другое место на временной ленте. Для этого нажимаете на кадре, который Вы хотите скопировать, правой клавишей мыши, и выбираете Copy Frame . Нажимаете правой клавишей мыши после этого на кадр, вместо которого хотите поставить скопированный кадр, и выбираете Paste Frame . Кадр будет скопирован.

Работа с кадрами в программе Macromedia Flash

Insert Frame — вставить кадр;
Insert Keyframe — вставить ключевой кадр;
Remote Frames — удалить кадры (один или несколько). Если Вы выделите сразу несколько кадров с помощью перемещения по ним мышкой с нажатой левой клавишей, Вы их сразу все можете удалить.
Insert Blank Keyframe — вставить пустой ключевой кадр, изображение в котором не будет повторять изображение предыдущего кадра;
Clear Keyframe — удалить изображение ключевого кадра, при этом он перестанет быть ключевым.
Clear Frames — удаляет изображение кадров (одного или нескольких). Если удалить изображение ключевого кадра, он станет пустым ключевым кадром.

Создаем анимацию в программе Macromedia Flash

Сделайте такой, или похожий ролик:

и сохраните его с помощью меню File — Save as , в формате .fla .

В качестве подсказки можете посмотреть изображение временной ленты, которая у меня получилась.

Используйте при создании Вашей покадровой анимации инструмент Text .

Инструмент Text

Используйте этот инструмент для написания текста. Для его активации нажмите на иконку с изображением буквы А. Пропишите текст, задайте его свойства в панели свойств, если нужно, передвиньте границы, чтобы он весь поместился, а затем, при необходимости, с помощью инструмента Free Transform измените его размеры.

Более подробные сведения Вы можете получить в разделах "Все курсы" и "Полезности", в которые можно перейти через верхнее меню сайта. В этих разделах статьи сгруппированы по тематикам в блоки, содержащие максимально развернутую (насколько это было возможно) информацию по различным темам.

Также Вы можете подписаться на блог, и узнавать о всех новых статьях.
Это не займет много времени. Просто нажмите на ссылку ниже:
Подписаться на блог: Дорога к Бизнесу за Компьютером

Вам понравилась статья? Поделитесь, буду весьма признателен:

Читайте также: