Применение эффекта «маскирования» при создании анимационных фильмов

Урок 7. Применение эффекта «маскирования» при создании анимационных фильмов.

В этом параграфе мы научимся создавать эффекты

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

Слой-маска и маскируемый слой.

Кроме «слоя-траекторий» и «вспомогательного слоя» программа Flash предоставляет создателям анимационных фильмов еще один тип специального слоя. Им является «слой-маска».

«Cлой-маска») призван замаскировать, т. е. сделать невидимой часть объектов, изображения или анимации, находящихся на расположенном под ним слое. Поэтому «слой-маска» часто называется «маскирующим слоем», а слой, расположенный под ним, «маскируемым слоем».

«Слой – маска» и «маскируемый слой» представляют собой пару аналогично тому, как это было в случае пары «слой траектории – слой анимации».

«Маскируемый слой» не является специальным слоем с какими-то особыми свойствами. Это обычный слой, свойства и возможности которого мы изучили ранее.

«Слой-маска» (в отличие от «маскируемого слоя») обладает новыми по сравнению с другими слоями, особыми свойствами. Суть этих новых свойств состоит в следующем.

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

Наоборот, если на рабочем поле ключевого кадра «слоя-маски» имеется какой-либо объект (например, что-то нарисовано), то любая заливка становится «окном», сквозь которое можно видеть содержимое «маскируемого слоя».

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

Очевидно, что применение «слоя-маски» без анимации не может быть сколько-нибудь целесообразно. Действительно, вырезать часть изображения в «маскируемом слое» и показать только его можно более простыми средствами. Смысл применения «слоя-маски» состоит именно в возможности создания и использования анимации, находящейся как в этом слое, так и в расположенном ниже маскируемом слое.

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

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

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

Создание «слоя-маски». Преобразование обычного слоя в «маскируемый» и обратно.

Для того, чтобы преобразовать обыкновенный слой в «слой – маску», нужно выделить его на панели Timeline (Шкала времени) и выбрать команду Mask (Маска) в контекстном меню. Выделенный слой тотчас же становится слоем - маской, а слой, находящийся непосредственно под ним – «маскируемым слоем». Содержание маскируемого слоя (и графика, и анимация) при этом сохраняется.

Теперь оба слоя имеют характерные, сдвинутые одна относительно другой эмблемы, которые расположены слева от их имени. Это происходит аналогично тому, как это было в случае пары «слой траектории – слой анимации». Эмблемы позволяют распознать маскируемый слой и «слой-маску» в стеке других слоев.

«Слой-маска» и маскируемый им слой при этом автоматически оказываются заблокированными. Это видно по появившимся изображениям замка рядом с именами слоев. Блокировка обоих слоев является непременным условием возможности просмотра их работы прямо на рабочем поле (при нажатии клавиши <Enter>). Однако, если Вы захотите отредактировать любой из этих слоев, например, дорисовать что-либо или создать анимацию, то блокировку придется снять.

В файле может быть много «слоев-масок». Сделать обычный слой маскируемым можно изменив его положение в стеке слоев. Достаточно просто с помощью мыши перенести обычный слой непосредственно под «слой-маску». Аналогичную картину мы наблюдали, работая с парой «слой траектории – слой анимации».

Также легко разрушить связь между маскируемым слоем и «слоем-маской». Для этого достаточно перетащить мышкой маскируемый слой так, чтобы он оказался выше «слоя-маски». Другой способ разрушить связь между маскируемым слоем и «слоем-маской» - с помощью мышки переместить влево эмблему нижнего маскируемого слоя. Так, чтобы положение эмблемы соответствовало обычному слою.

Кроме двух описанных выше способов разрушить эту связь есть еще один. Нужно выделить «слой-маску» и воспользоваться контекстным меню.

Если в результате перемещений в стеке слоев «слой-маска» окажется расположенным ниже других слоев, то он не перестанет быть «слоем-маской», однако теперь он не работает по своему прямому назначению. Тем не менее, все, что находится в нем, остается невидимо пользователю.

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

Теперь, после изложения теории перейдем к практической части урока. В качестве первого упражнения рассмотрим простой пример. Создадим эффект постепенного, буква за буквой появления текста на экране. Для этого используем анимацию движения изображения, находящегося на «слое – маске».

Упражнение 1. Создание эффекта постепенного появление текста. (slovo. swf).

В первом и единственном пока кадре слоя вставим статический текстовый блок и напишем какое-нибудь слово, например «ЭЛЕКТРИФИКАЦИЯ». Увеличим его так, чтобы оно покрывало все рабочее поле. Выделим сороковой кадр и нажмем клавишу F5, определяя тем самым длину будущей анимации. Создадим новый слой и сделаем его «слоем – маской». Снимем блокировку с этого слоя. В первом кадре «слоя-маски», слева от слова нарисуем небольшой прямоугольник и сгруппируем его. Группировка необходима для того, чтобы затем применить к этому прямоугольнику технологию анимации движения. Оставаясь в «слое-маске», выделим сороковой кадр и нажмем клавишу F6. Теперь сороковой кадр стал ключевым кадром, содержащим копию сгруппированного прямоугольника. Оставаясь в сороковом кадре, с помощью инструмента "Трансформатор" растянем нарисованный прямоугольник так, чтобы он закрывал все слово. Выделим символ первого кадра на панели Timeline (Шкала времени) и, открыв панель Properties, выберем Motion. Нажмем клавишу <Enter> и убедимся, что "анимация движения" работает. Нарисованный небольшой прямоугольник, увеличивается в размере и постепенно закрывает все слово. Теперь заблокируем слои и еще раз нажмем клавишу <Enter>. На этот раз мы увидим то, что и должны увидеть те, для кого мы сделали этот фильм. Слово появляется на рабочем поле постепенно, буква за буквой.

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

Именно так устроены файлы, которые сопровождают текст урока: «mallorka», «Lake», «Slonoven», «bird_cat». Остановимся на одном из них чуть более подробно. На этот раз не станем подробно по шагам описывать процесс создания анимации, а предложим лишь основную идею.

Упражнение 2. Создание анимации «окно в виде текста» в непрозрачном экране. (Lake. fla )

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

Иллюстрация к такому фильму представлена на рис. 1, где в отладочном режиме одновременного просмотра нескольких кадров показан рост и перемещение объекта на фоне пейзажа. На этом рисунке видно совсем не то, что увидит пользователь, для которого создается фильм. Пользователь увидит, как на экране вырастает слово "ОЗЕРО", через которое виден пейзаж. Прием просвечивания изображения сквозь текст является достаточно эффектным. Должно понравиться.

Похожее содержание имеет и фильм «Mallorka», где применялась как анимация движения, так и анимация формы.

Рис. 1.

Упражнение 3. Создание анимированного поздравления С Новым Годом!

Как вариант упражнения 2 можно предложить в качестве маскируемого слоя использовать не картинку с изображением пейзажа, а многоцветную градиентную заливку. Тогда "слово", перемещаясь по экрану, будет еще и переливаться всеми цветами радуги.

Можно усложнить этот проект и выполнить многоцветную градиентную заливку тоже в виде анимации. Для этого в первом (маскируемом) слое нарисуем прямоугольник, зальем его многоцветной градиентной заливкой и заставим его перемещаться (или вращаться)! Именно так устроены фильм «New_Year_L» (или «New_Year_R»). Переливающееся всеми цветами радуги поздравление с Новым годом эффектно падает сверху и, оставаясь неподвижным, продолжает переливаться разными цветами. Поскольку это происходит на черном (ночном) фоне, так и хочется разукрасить его фейерверком! Что касается этого черного цвета, то он легко достигается, например, перекрашиванием рабочего поля. А вот как сделать фейерверк, Вы узнаете чуть дальше в этом параграфе.

Роль слоя, расположенного под «маскируемым слоем».

Внимание! Пора сделать важное замечание о том, какого рода невидимкой становится слой, закрытый «слоем-маской». Действительно, «нечто» может считаться невидимым, если оно либо помещено в непрозрачный контейнер, либо наоборот, само абсолютно прозрачно.

Когда мы говорили о том, что «слой-маска» делает невидимой часть изображения (или анимации), находящегося на «маскируемом слое», то имели в виду второй вариант! Применяя сказочные образы можно сказать, что «слой маска» это не непрозрачный плащ, а шапка – невидимка.

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

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

Из этого следует очень интересный вывод. Сквозь прозрачную часть маскируемого слоя можно увидеть фоновый слой, лежащий под ним!

Другими словами если ключевой кадр «слоя-маски » не содержит достаточно больших объектов, то он (как шапка – невидимка!) делает абсолютно прозрачным и, соответственно, невидимым содержимое ключевого кадра расположенного ниже «маскируемого слоя». При этом становится видным содержимое (фонового) слоя, расположенного еще ниже, и не связанного со «слоем-маской»!

Это обстоятельство позволяет создавать очень эффектные анимации с участием слоев, расположенных под «маскируемым слоем». Примером могут служить фильмы «romashka».

Следующим шагом является использование слоев, лежащих как ниже, так и выше пары «слой – маска» - «маскируемый слой». Примерами такой структуры являются фильмы («poezd» и «comp-new»).

Как не трудно догадаться, в фильме «poezd» окном вагона является прямоугольная заливка в «слое-маске». Пейзаж находится на маскируемом слое. Интерьер вагона– суть содержание слоя, расположенного под маскируемым слоем. Пьющий чай пассажир – это анимация, расположенная в слое, находящемся выше слоя-маски. Это становится понятно из того, что рука пассажира перемещается на фоне окна вагона.

Очевидно, что в фильме «comp-new» кроме пары слоев «слой – маска» - «маскируемый слой» и расположенного ниже фонового слоя, имеется еще пара слоев «слой траектории – слой анимации». Эта пара слоев обеспечивает «беспорядочный» полет бабочки. Такая достаточно сложная структура фильма является типичной для анимационных Flash – фильмов.

Вопросы для самопроверки.

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