Практическая работа «Анимация формы в Macromedia Flash»
Цель:
знакомство с алгоритмом создания
анимации формы; изучение возможностей
контроля анимационного процесса путем
создания меток
Задание
1.Создайте flash-ролик
“Превращение1”.
Алгоритм работы:
Сопровождающие
иллюстрации
|
Шаги
|
|
Создайте новый
документ Macromedia
Flash
На
первом кадре нарисуйте яблока
Перейдите
на 30 кадр и нажав клавишу <F7>
вставьте пустой ключевой кадр
|
|
На 30 ключевом
кадре нарисуйте машинку
Откройте
панель Properties
и в списке Tween
выбираем Shape,
а в список Blend
выбираем
Distributive
Запустите
файл на просмотр
Сохраните
ролик
|
|
Изменим
ход анимации. Для этого выделите
первый кадр и выберите пункт меню
Modify
/Shape/Add
Shape
Hint
(<Ctrl>
+ <Shift>
+ <Н>)
Перенести
мышкой метку на одну из точек контура
яблока
|
|
Перейдите
на последний ключевой кадр и перенесите
метку на этом кадре в предполагаемую
точку перетекания метки из первого
кадра
Запустите
ролик
Создайте
еще несколько меток и проследите как
будет изменяться ход анимации.
Сохраните
ролик в своей папке
|
Задание
2.Создайте flash-ролик
“Превращение2”.
Алгоритм работы:
Сопровождающие
иллюстрации
|
Шаги
|
|
Создайте новый
документ Macromedia
Flash
Импортируйте
на первый кадр рабочего поля растровый
рисунок
Перейдите на 20
кадр и преобразуйте его в пустой
ключевой кадр
|
|
В 20 кадр
импортируйте другое растровое
изображение
Откройте
панель Properties
и в списке Tween
выбираем Shape,
а в список Blend
выбираем
Distributive
Запустите
ролик
Откройте
панель Properties
и в списке Tween
измените Shape
на
Angular
Запустите
ролик, проследите за изменением хода
анимации
Сохраните
файл
|
Задание
3.Создайте flash-ролик
“Капля”.
Алгоритм работы:
Сопровождающие
иллюстрации
|
Шаги
|
|
Запустив
Macromedia Flash, создаем
новый flash документ
Переименуйте
первый слой в Краски.
Нарисуйте (либо импортируйте из файла)
и сгруппируйте на первом кадре этого
слоя краски.
|
|
Перейдите на 6
кадр этого слоя и сделайте его ключевым
Выбрав
инструмент Free
Transform,
немного поверните рисунок
Вернитесь
на первый кадр и установите анимацию
движения
Выделите
7 кадр и сделайте его ключевым
Разгруппируйте
изображение на 7 кадре
Перейдите
на 37 кадр и нажмите на клавишу <F5>
|
|
Создайте
новый слой Капля
и расположите его ниже слоя Краски
Слой
Краски
заблокируйте
На
слое Капля
перейдите на 6 кадр и сделайте его
ключевым
На
этом ключевом кадре нарисуйте каплю
и сгруппируйте ее
Постройте
анимацию движения с 6 по 29 кадры, в
которой на 6 кадре капля будет возле
кисти, а на 29 кадре – на полу под кистью
Преобразуйте
30 кадр в ключевой
|
|
Разгруппируйте
рисунок на 30 кадре
Перейдите
на 37 кадр и нарисуйте там каплю в
разбитом состоянии
|
|
Вернитесь
на 30 кадр и откройте панель Properties
В
списке Tween
выберите Shape;
окне Ease
установите -31;
в списке Blend
выберите Distributive
Запустите
ролик
Сохраните
ролик
|
Задание
4.Создайте flash-ролик
“Спутник”.
Алгоритм работы:
Сопровождающие
иллюстрации
|
Шаги
|
|
Запустив
Macromedia Flash, создаем
новый flash
документ, которому даем название
Спутник
Установим
частоту кадров (Frame
Rate)
8fps
Создадим
новый символ Insert / New Symbol,.
Указываем Name(имя) Спутник, а
Behavior(поведение) создаваемого
символа оставим нетронутым.
Инструментом
Oval нарисуем круг
Выделим
круг и в окне Info изменим размер
на 30x30.
Совмещаем
центр нарисованного круга с точкой
привязки в центре сцены.
|
|
Перейдите в
режим сцены и измените масштаб так,
чтобы рабочее поле полностью умещалось
на экране.
Выберем
инструмент Oval и установим
радиальную заливку, изменим цвет
чёрного маркера на сине-голубой и
белого на светло-жёлтый (панель Color
Mixer);
и бесцветный контур.
Нарисуем
планету. и выполним ее группировку
Нарисуем
орбиту,. выбрав инструмент
Oval и установив синий цвет
контура и цвет заливки – бесцветный.
Выделив
орбиту, выполним группировку. Выделив
планету и орбиту опять выполним
группировку.
|
|
Выравним их по
центру, открыв для этого окно
выравнивания комбинацией клавиш
Ctrl+K или выбрав пункт меню
Window-Design Panels-Align.
В этом
окне выберем
выравнивания: Align
Horizontal Center и
Align Vertical Center
и закроем
окно.
Выделим
рисунок и разгруппируем Modify-Ungroup.
Снимем выделения, выберем орбиту
и придадим ей более правдоподобный
вид. Для этого выполним команды
Modify->Transform-> Scale
and Rotate
и установим параметр Rotate
– 150
|
|
Изменим название
слоя с Layer1 на Планету
и добавим еще два слоя, назвав их,
Орбита и Спутник.
На
слое Планета выделим орбиту
и вырежем ее, нажав клавиши Ctrl+X.
Выберем слой Орбита и вставим
рисунок в тоже место Edit ->Paste in
Place.
Разгруппируем
орбиту и удалим верхнюю её часть,
которая находится в области планеты.
Сделаем
невидимым сой Планета и
заблокируем слои Орбита и
Планета
|
|
На слой Спутник
перетащим из библиотеке символ спутник
так, чтобы его центр совпал с концом
орбиты
Выделим
слой Спутник и на панеле
Properties выберем
Motion Tween, выставим галочки в
полях масштабирования (Scale),
движения по траектории (Orient
to path),
синхронизации(Sync)
и привязки (Snap).
Сохраняем изменения Ctrl+S или
File ->Save.
|
|
На всех слоях
выделим 66-й кадр и сделаем его ключевым,
нажав F6
Выделим
слой Спутник
и добавим над ним с помощью кнопки на
временной шкале
направляющий слой. На этот слой
скопируем орбиту.
Выделим
66 кадр слоя спутник и мышкой перетащим
спутник, соединив его центр с другим
концом орбиты. Запустим ролик
Ctrl+Enter.
|
|
Выделим первый
кадр каждого слои и добавим ещё по 4
кадра с помощью клавиши F5.
Выделим
5-й кадр на слое Спутник и
нажмем клавишу F6
Тоже самое проделаем с 65 кадром.
Возвращаемся
к первому кадру и в окне Info
выставляем размер спутника 1x1,
тоже проделываем с последним кадром.
Сделайте
35 кадр ключевым и измените размеры
спутника на 60x60. Потом
через 4 кадра вставляли ключевые
кадры, сначала справа, уменьшая размер
спутника с 60 до 55, потом 55 до 50 и т.д.
до тех пор, пока не дошли до 34, а потом
так же в обратную сторону.
|
|
Заблокируйте
все слои, кроме слоя Планета.
Выделите
слой Планета и выполните
команды Modify-Ungroup.
На
панели Properties
устанавливаем вид анимации Shape.
Выделяем
первый кадр слоя Планета и выбираем
инструмент Fill
Transform
Toll С
помощью центрального маркера выносим
градиент за пределы планеты и переносим
его влево, так чтобы центр градиента
и центр планеты находились на одной
прямой. Тоже самое проделаем с последним
кадром перенеся градиент вправо.
|
|
Создадим новый
слой «Звук», расположив его поверх
остальных слоев. Импортируем музыкальный
файл File –
Import –
Import to
Library Выделим
слой Звук и на панели Properties
и из списка Sound
выбираем вставленный файл
Ролик
готов. Сохраните файл
|
Занятие
21 – 22
Анимация
движения по заданной траектории
Иногда нужно, чтобы
в процессе анимации движения объект
двигался не по прямой, а по произвольно
заданной траектории. Анимация в этом
случае создается обычным образом, а
траектория движения рисуется в отдельном
слое. Это не обычный слой, а специальный,
так называемый слой траекторий.
Слой траекторий
создается нажатием второй слева
кнопки
под изображением слоев на панели
Timeline. При этом
слой с анимацией, для которой нужна
траектория, должен быть выделен. Можно
поступить по-другому и создать слой
траекторий, выбрав пункт Add
Motion Guide
(добавить направление движения) в
контекстном меню выделенного слоя (слоя
с анимацией). Созданный слой траекторий
располагается над слоем с анимацией.
Он автоматически получает такое же имя,
как и слой анимации, но с приставкой
Guide (направляющий).
Слева от его имени помещается эмблема,
не такая, как у известных нам слоев, а
такая, как на кнопке, с помощью которой
этот слой был создан.
Слой траекторий
может обслуживать несколько разных
анимаций, каждая из которых размещена
в отдельном слое. Но все эти слои с
анимациями должны располагаться под
слоем траекторий. Чтобы подключить еще
один слой к слою траекторий, достаточно
просто перенести его под слой траекторий.
На рабочем поле
слоя траекторий рисуется кривая, по
которой должен двигаться анимированный
элемент. Это может быть любая линия:
гладкая или ломаная, прямая или кривая.
Для рисования траектории можно
использовать любой инструмент рисования:
Карандаш, Кисть, Линия, Перо, Эллипс
или Прямоугольник.
Чтобы превратить
слой траекторий или слой направляющих
в обычный слой, можно просто отключить
пункт — выключатель в контекстном меню
этого слоя.
При запуске файла
траектории, по которой перемещается
объект не видно.
