Предположим, вам нужно, чтобы круг превратился в квадрат, или какой-нибудь текст превратился в какую-нибудь фигуру, или человек превратился в http://avtopd.bget.ru/master2/master2. В этих случаях используется анимация-трансформация (shape tweening).
Как обычно для расчетной анимации, вы задаете два ключевых кадра на некотором расстоянии друг от друга.
В этом варианте анимации есть жесткое ограничение: ключевые кадры должны быть векторной "разбитой" графикой (Modify-Break Apart), если объекты - текст или импортированная растровая графика.
Вы назначаете объекты, находящиеся в этих ключевых кадрах фигурами (Shape). От этого слова и происходит название этого вида анимации - шейпинг.
Назначение фигурами производится в панели Properties (Cвойства) в списке Tweening необходимо выбрать параметр Shape.
Кадры на временной шкале при данном виде анимации должны окраситься в зеленоватый цвет и от первого кадра ко второму должна протянуться стрелочка.
Пример 1. Превращение круга в квадрат
Создадим трансформацию: превращение круга в квадрат.
Создайте новый файл.
В левой части рабочей области нарисуйте окружность и залейте ее радиальным градиентом.
Выделите первый кадр и в панели Properties в списке Tween задайте параметр Shape (Фигура).
Создайте пустой ключевой кадр в 20-м кадре:
Выделите правой кнопкой мыши 20 кадр (в шкале времени).
Пункт Insert Blank Keyframe (Вставить пустой ключвой кадр).
Нарисуйте квадрат (в рабочей области).
В шкале времени между первым и 20 кадрами появится черная стрелка на светло-зеленом фоне. Это признак того, что трансформация создана.
Рассмотрим дополнительные параметры в панели Properties для данного вида анимации.
Ease (Ослабление) задает обратное экспоненциальное ускорение. Величина этого параметра может изменяться от - 100 до + 100. Это означает, что если вы зададите отрицательный ease, движение будет происходить с положительным ускорением, скорость будет увеличиваться. И наоборот, если ease будет положительным, анимация будет замедляться.
Параметр Blend (Смесь), определяет алгоритм перехода:
Distributive (Распределяющий, общий)
Angular (Угловатый).
Первый старается максимально смягчить, сгладить переход от одной фигуры к другой. Второй же пытается сохранить пропорции углов.
Если трансформация вас не удовлетворяет, можно поэкспериментировать с этим параметром.
Контрольные точки
Контрольные точки (shape hints, дословно - подсказки для форм) - инструмент в анимации-трансформации shape tweening. Контрольные точки - это точки, с помощью которых вы помогаете Flash правильно осуществить переход. Вы должны указать Flash, какая точка контура одного объекта должна перейти в указанную вами точку контура другого объекта. Без контрольных точек не обойтись в случае сложных форм.
Пользоваться ими очень легко:
Выделите первй ключевой кадр в шкале времени.
Добавьте контрольную точку - Modify - Shape - Add shape hint (Модифицировать - Фигура - Добавить контрольную точку) или Ctrl-Shift-H.
На сцене появится маленькая красная точка, обозначенная буквой латинского алфавита.
Вы прикрепляете ее к той части изображения, которая трансформируется не так, как вы хотели.
Перейдите на второй ключевой кадр (выделив в шкале времени), и в рабочей области прикрепляете эту же контрольную точку к части объекта, в которую должна перейти часть объекта из начального кадра.
Воспользуйтесь кнопками Onion SkinOutlines (Смежные кадры в виде контуров) и Edit Multiple Frames (Редактирование нескольких кадров), чтобы видеть этапы трансформации одного объекта в другой.
Проиграйте трансформацию (Ctrl-Enter) - вы увидите, что она осуществляется по-другому:
Вы можете, при нажатых кнопках Onion Skin Outlines (Смежные кадры в виде контуров) и Edit Multiple Frames (Редактирование нескольких кадров), перемещать контрольную точку во втором ключевом кадре и смотреть, как будет меняться трансформация.
Можно сделать не одну контрольную точку.
Для каждой новой контрольной точки вы должны повторить технологию с 1 по 3 пункт.
без контрольных точек
с контрольными точками
Удаление контрольных точек
Удалить все точки можно с помощью Modify - Shape - Remove All Hints (Модифицировать - Форма - Удалить все контрольные точки).
Удалить единственную точку можно, нажав на ней правую кнопку мыши, и в контекстном меню выбрав Remove Hint (Удалить контрольную точку).
Так как контрольные точки обозначаются буквами латинского алфавита, то их может быть максимум 27.
При использовании анимации на основе изменения формы (shape tweening) могут модифицироваться следующие параметры фигуры:
форма
расположение
размер (любые пропорции)
цвет
угол поворота
Если вам нужно отключить Shape tweening, в панели Properties выберите Tween: None.
Задание
Сделайте анимацию-трансформацию любых 2-3 животных. Животных вы должны нарисовать самостоятельно или воспользоваться готовыми изображениями и обрисовать их по контуру, так чтобы они превратились в векторный рисунок.
Желаю удачи!
Слой-маска
Остался еще один тип слоя, о котором мы пока ничего не знаем - маскированный слой. Замечательным качеством маскированного слоя заключается в том, что изображения на подчиненных ему слоях будут видны только через маску слоя. Что бы, было легче, понять принцип его действия представьте, что у Вас на столе лежит открытка, но смотрите Вы на нее через лист плотной бумаги, в котором вырезано отверстие произвольной формы. Лист с отверстием, можно перемещать, просматривая тем самым другие фрагменты изображения.
Давайте посмотрим, как работать с анимированным, маскированным слоем. Для этого используем простейший прием - сканирование надписи.
Назовите первый слой - "Фон"
Напишите крупными буквами Ваше имя в первом кадре.
Вставьте новый слой Insert/Timeline/Layer или щелкните на кнопке нового слоя, под списком слоев на Timeline и назовите слой - "Маска".
Нарисуйте в нем узкий прямоугольник, равный ширине надписи и располагающийся над ней.
Задайте для данного кадра анимацию движения Insert /Timeline/Create Motion Tween или правой кнопкой мыши на первом кадре нового слоя пункт Create Motion Tween.
Вставьте ключевой кадр Insert /Timeline/Keyframe [F6], в нашем случае 25-й.
Переместите прямоугольник под надпись, создав тем самым движение будущей маски.
Щелкните правой кнопкой мышки на названии слоя с именем "Маска".
В появившемся списке выберем - Mask. Данный слой станет маской, а слой, расположенный под ним - маскированным. Кроме того, оба слоя автоматически будут заблокированы от изменений, обратите внимания на замочки, справа от названия слоя. Исчезнет изображение прямоугольника (нашей маски), а возможно и надписи (если маска находится не на надписи). Это не страшно. Достаточно посмотреть фильм в тестовом режиме Control / Test Movie или нажать Enter и просматривать не переходя в режим просмотра.
Слой-маска не может использоваться в одиночку, а должен быть связан с одним или несколькими обычными слоями, в отношении которых он даёт эффект маски. То есть, содержимое связанных слоёв видно только через «дырки» в маске, а вся остальная их часть остается невидимой. Более того, маска может иметь анимацию (кроме анимации, использующей направляющую для движения), что позволит создавать весьма необычные эффекты.
В ходе работы на слое маски, для создания «дырок», чаще всего используется графический примитив — заливка. В этом случае она играет роль очень ядовитой краски или кислоты разъедающей поверхность слоя. Линии таким свойством не обладают! Итак, маска может быть создана на основе:
графического примитива — заливки,
текстового блока,
экземпляра символа типа Graphic или Movie Clip, конечно же, при условии, что в этих символах имеются области заливки.
При работе с этими элементами следует учитывать, что на маскирующем слое одновременно можно помещать объекты только одного типа — либо только заливки, либо только текст, либо символы типа Graphic, либо символы типа Movie Clip. Причём «обычных» заливок может быть сколько угодно, а вот текстовой блок или символ может быть только один!
Если слой-маска уже существует, с ним можно связать дополнительные слои. Это можно сделать несколькими способами.
Перетащить существующий слой так, чтобы он располагался прямо под слоем-маской.
Создать новый слой непосредственно под слоем-маской.
Открыть диалоговое окно свойств слоя и установить в нём переключатель Masked (под действием маски).
Существующую связь со слоем-маской можно и разорвать. Эту операцию также можно выполнить несколькими способами.
Перетащить маскированный слой так, чтобы он располагался выше слоя-маски.
Открыть диалоговое окно свойств слоя и установить в нём переключатель Normal (обычный).
Поэкспериментируйте со слоями. Создайте маскирующие слои на основе заливки, блока текста, символа типа Graphic и Movie Clip и убедитесь в правоте изложенных выше утверждений.
Вложенная анимация
Задание
Предлагаю сделать ролик с использованием всех изученных видов анимации. Тематику выбираете сами.
Потрудитесь над оформлением сцены (фон, декорации, объекты http://avtopd.bget.ru/master2/master2. ).
Эффекты Timeline
Эффект Copy to grid(копирование в таблицу) - создает таблицу из копий выделенного объекта.
Эффект Distributed duplication(распределенное дублирование) - дейсвтует подобно предыдущему эффекту, создавая из копий выделенного объекта каскадный ряд. Однако в ряду помимо положения меняются и другие параметры: размер, угол наклона, цвет, прозрачность. Вдобавок можно задать необходимость постепенного (растянутого во времени) появления копий.
Эффект Blur(размытие) - создает эффект размытия в движении благодаря изменению прозрачности, позиции и размера объекта во времени.
Эффект Drop shadow(тень) - создает тень под выделенным элементом.
Эффект Expand(расширение) - работает с несколькими группами или символами, а также с текстовыми блоками. По действием эффекта Expand (расширение) объекты должны расползаться друг от друга.
Эффект Explode(взрыв) - похож на предыдущий, однако может применяться к отдельному рисунку: программа Flash сама разорвет его на 16 фрагментов, которые полетят по дуге.
Эффект Transform(преобразование) - по сути является готовой раскадровкой движения, то есть параметры, которые вы можете изменить при раскадровке, доступны при настройке эффекта.
Эффект Transition(стирание) - напоминает восход или закат. Но восход применительно к квадрату - не самый понятный термин. Стирать объект можно, удаляя его с какого-то конца или просто обесцвечивая.
Insert - Timeline Effects
Assistants - Copy to Grid Эффект Copy to Grid — очень простой, он позволяет автоматически получать бесконечное множество заданных элементов, выровненных по сетке. В его основе лежат знакомые всем операции Copy (Копировать) и Paste (Вставить) с дальнейшим выравниванием.
Number of rows (Число рядов) — задайте в поле, соответствующем числу рядов, значение 3;
Number of columns (Число колонок) — укажите 2 колонки;
Distance between rows (Расстояние между рядами) — пусть расстояние между рядами будет равно 8 пикселам;
Distance between columns (Расстояние между колонками) — задайте также 8 пикселов для дистанции между колонками.
Допустим, что вам нужно сделать заготовку для игры. У вас есть блоки
и их необходимо распределить, например, вот так:
Можно копировать блоки, распределять их вручную, потом с помошью панели Align выравнивать, а если еще и точное промежуточое расстояние необходимо соблюдатьhttp://avtopd.bget.ru/master2/master2. Все гораздо проще с помощью эффекта Copy to Grid (Копировать в сетку). Из элементов, расположенных на кадре можно сформировать сетку, указав кол-во строк и столбцов и расстояние между ячейками. Нажать клавишу OK и сетка готова к использованию.
Assistants - Distributed Dublicate
Number of Copies - число копий объекта
Offset Distance - расстояние между копиями по X и Y
Offset Rotation - поворот копий
Offset Start Frame - с какого кадра начать эффект
Exponential Scaling - распределение копий в сторону увеличения или уменьшения в размерах
Scale - изменение размеров в % соотношении от исходного
Change Color - изменение цвета копий
Final Alpha - изменение прозрачности конечных копий
Effects - Blure
Effects - Explode
Effects - Expand
Рассмотрим следующий эффект — Expand (Расширение), служащий для автоматического создания такой анимации, в которой части объекта могут как расширяться, так и сужаться на основе использования движения Motion Tween (Анимация движения), применяемого для каждого символа текста.
Его параметры мы сейчас рассмотрим и настроим.
Effect Duration (Продолжительность эффекта) — уже знакомый параметр, помогающий устанавливать длительность эффекта в фреймах. Пусть эффект длится 19 кадров.
Эффект Expand (Расширение) имеет три алгоритма работы, одним из которых вы можете воспользоваться, установив флажок напротив нужного названия.
Expand (Расширить) — применение метода позволит плавно растянуть объект. Установите флажок в данном пункте, чтобы наш текст подчинялся алгоритму «расширения».
Squeeze (Сузить) — предлагается алгоритм, противоположный рассмотренному выше, когда объект не растягивается, а сужается.
Both (Оба) — позволяет использовать комбинацию первых двух приемов.
Direction of movement (Направление движения) — в отличие от рассмотренного в предыдущем номере журнала эффекта Blur (Размытие), где можно было задать любое направление движения, используя все стрелки диалогового окна, в эффекте Expand (Расширение) эта опция сильно ограничена — предлагается всего три направления, остальные будут неактивны. Выберите центральный пункт, чтобы расширение происходило от центра объекта.
Shift Group Center by (Сместить центр группы) — с помощью данной опции можно сместить центр, от которого происходит расширение по горизонтали, указав количество пикселов смещения в поле X, и по вертикали, приведя значения пикселов в поле Y. Нам не нужно, чтобы смещался центр начала движения, поэтому эти значения равны нулю.
Fragment offset (Смещение фрагмента) — задается величина смещения фрагментов относительно друг друга в пикселах. Установите данное значение равным 7.
Change Fragment Size by (Изменять размер фрагмента) — можно установить иные пропорции фрагмента, вводя новые масштабы для ширины и длины в поля Height (Высота) и Width (Ширина). Задайте по 5 пикселов для данных параметров.
К сожалению, на данном этапе фильтром не предусмотрены такие важные опции, как уменьшение и увеличение скорости движения (аналоги параметра Ease (Ослабить)) и изменение прозрачности растягивающихся фрагментов (аналоги параметра Alpha). Но не беда, мы исправим это вручную.
Transform/Transition - Transform
Transform/Transition - Transition
И наконец, последний эффект Transition (Перемещение) хотя достаточно тривиален, все же весьма удобен в применении. Он позволяет последовательно «открывать-проявлять» объекты, находящиеся на сцене и выбранные для эффекта.
Direction (Направление) — выберите одно из направлений in (внутрь) или out (наружу) для реализации эффекта. Я, например, использовала in (внутрь).
Fade (Исчезновение) — включите флажок, что позволит выполнить эффект перехода от прозрачного объекта к непрозрачному (или наоборот, в зависимости от выбранного направления). Такой эффект мы с вами уже не раз применяли ранее на основе параметра Alpha.
Wipe (Стирание) — отмеченный флажок делает возможным выполнение эффекта последовательного стирания фигуры, направление для которого вы определяете с помощью располагающегося рядом блока стрелок.
Motion ease (Замедление движения) — знакомый параметр, замедлите движение в начале анимации, потянув ползунок влево.
Анимация - трансформация
В этом варианте анимации есть жесткое ограничение: ключевые кадры должны быть векторной "разбитой" графикой (Modify-Break Apart), если объекты - текст или импортированная растровая графика.
