UMKD_KSIM

Тип Graphic

Это самый простой тип. Его можно представить как тип Movie Clip с полностью отключенной функциональностью, то есть как простой контейнер графики и анимации. Объекты этого типа не умеют реагировать на события и не имеют индивидуального имени, а значит, ими нельзя управлять извне. В такие клипы можно помещать циклические анимационные последовательности, которые будут крутиться бесконечно или будут воспроизведены один раз при активизации старшего клипа иерархии. Клипы типа Graphic не могут содержать в себе других клипов. В силу вышеописанных ограничений, использование таких объектов ограниченно. Вы сможете с успехом обходиться первыми двумя типами, даже не вспоминая о типе

Graphic.

Виды анимации, доступные во Flash, общие принципы

Понятие анимации

Давайте еще раз вспомним – что такое анимированное изображение? Анимированное, значит живое, движущееся с течением времени. То есть в отличие от статической картинки добавляется еще некая временная составляющая. Причем способов формирования этой временной составляющей может быть несколько.

Самый простой метод анимации – анимация путем смены отдельных картинок с некоторой частотой известен, пожалуй, всем. Этот метод, как самый простой, был и раньше всех реализован в кино. Обычное кино – это тоже смена отдельных изображений. Анимационное кино отличается от обычного только способом создания отдельных кадров. Это и есть традиционная анимация по кадрам.

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

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

100

щение различных техник анимации естественно и просто. Например, сегодня очень широко используется трехмерная графика для создания фонов. Хотя картинка при этом остается плоской. Впрочем, ничуть не реже используются чисто трехмерные фоны, без всякой стилизации. Как пример можно привести такие известные фильмы как «Красавица и чудовище» компании Disney, «Принц Египта» от DreamWorks. Пример полностью трехмерного анимационного фильма – «Шрек» от DreamWorks. Нередко и персонажи и объекты в сцене делаются в трехмерных пакетах и с помощью специальных конвертирующих фильтров приобретают вид, характерный для традиционной плоской анимации. Качество стилизации настолько высоко, что непрофессионалы обычно даже не могут различить грань – где кончается трехмерная графика и начинается обычная плоскостная анимация. Трехмерная графика обеспечивает точность и скорость анимации, а также предсказуемость визуализации. Это особенно важно при медленных движениях, когда различия между соседними фазами очень малы, и вручную реализовать их крайне сложно.

Flash-технология является продуктом развития технологий компьютерной анимации и допускает несколько способов создания анимационных последовательностей.

Основными методиками, доступными во Flash, являются:

•покадровая анимация;

•анимация движения;

•анимация формы;

•программная анимация.

Эти виды могут комбинироваться в зависимости от целей и задач разработчика в разных пропорциях. Но именно умелое сочетание всех приведенных методов анимации позволяет создавать по-настоящему интересные работы.

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

Хронометрическая линейка

В реальной жизни любой процесс имеет свою временную составляющую. Нам сложно представить жизнь вне времени.

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

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

101

принципы, как правило, сходны. Во Flash средство для контроля движения и времени называется TimeLine, или, в вольном переводе, Хронометрическая Линейка (рис. 31). С ее помощью можно задавать время существования объектов, их положение в различные моменты воспроизведения фильма, скорость перемещения объектов и различные виды дополнительных движений.

Хронометрическая линейка во Flash очень сходна с аналогичными средствами в других пакетах, в частности, средствах для трехмерной графики. Однако особенности технологии Flash заставили разработчиков оснастить хронометрическую линейку дополнительными возможностями, которые отсутствуют в большинстве других пакетов для анимационной графики. Это, в частности, возможность размещения кода языка ActionScript во фреймах и одновременное существование многочисленных хронометрических линеек для разных клипов.

Рассмотрим для начала окно TimeLine и его элементы, а потом разберем особенности реализации контроля времени и движения во Flash.

Рис. 31. Пример вида хронометрической линейки для клипа

Понятие слоя

Обычно содержание фильма или клипа (что почти одно и то же) сгруппировано в слоях (Layers). Слои позволяют удобно контролировать различные части фильма и обеспечивают изоляцию одних объектов от других. Это оказывается совершенно необходимым для создания анимации любого типа.

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

Слои можно легко перемещать относительно друг друга. Это позволяет изменять порядок расположения клипов по «дальности».

102

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

Для возможности работать со временем слой разбивается на фреймы. Каждый фрейм можно представить как ячейку информации, соответствующую некоторому моменту времени при воспроизведении клипа. Именно фреймы являются непосредственными носителями объектов и кода.

Понятие фрейма

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

Фреймы соответствуют отдельным моментам воспроизведения фильма. Фильм и любой клип, который в него входит, воспроизводятся на экране дискретно, с частотой смены кадров, устанавливаемой при создании фильма. Это как в кино. Кадр пленки фиксируется в проекторе и показывается некоторое время, пока не наступает пора сменить кадр. Тогда производятся переход на следующий кадр и его показ в течение заданного времени. И так далее.

Традиционно считается, что для анимации достаточно менять кадры 12 раз в секунду. Гораздо реже делают смену кадров 24 или 25 (для телевидения) раз в секунду. Это нужно для анимации, требующей очень интенсивного движения и смены картинок. Большинство анимационных фильмов от студии Диснея и других студий, специализирующихся на классической анимации, сделаны с такой скоростью.

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

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

103

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

Виды фреймов

Фреймы бывают двух видов – простые и ключевые.

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

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

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

Средства импорта изображений

Импорт графики. Преобразование в вектор

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

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

Форматы для импорта, допустимые во Flash

Возможности импорта во многом определяются тем, установлен ли на вашем компьютере драйвер QuickTime 4 или более поздний. Этот драйвер позволяет упростить обмен файлами для платформ Windows и Macintosh. Также расширяется поддержка для некоторых других графических форма-

тов, таких как Adobe Photoshop, PICT, QuickTime Movie и некоторых дру-

104

гих для обоих платформ.

Давайте рассмотрим форматы файлов, доступные для импорта, независимо от установки драйвера QuickTime 4.

Тип файла	Расширение
Adobe Illustrator (version	.eps, .ai
AutoCAD DXF	.dxf
Bitmap	.bmp
Enhanced Windows Meta-	.emf
FreeHand	.fh7, .ft7, .fh8, .ft8, .fh9,
FutureSplash Player	.spl
GIF and animated GIF	.gif
JPEG	.jpg
PICT	.pet, .pic
PNG	.png
Flash Player	.swf
Windows Metafile	.wmf

Следующие форматы файлов могут быть импортированы только при наличии установленного драйвера QuickTime 4 или более позднего:

Тип файла	Расширение
MacPaint	.pntg
Photoshop	.psd
PICT	.pet, .pic
QuickTime Image	.qtif
QuickTime Movie	.mov
Silicon Graphics	.sai
TGA	.tgf
TIFF	.tiff

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

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

Неплохо импортируются файлы PNG из пакета Fireworks. Здесь импортируются как вектор, так и растры. Можно выбрать импорт как в виде растра, так и в виде редактируемых объектов. Во втором случае могут быть импортированы и некоторые другие элементы (отдельные картинки

105

как элементы библиотеки, текст, направляющие).

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

Формат Windows Metafile Format (WMF) также импортируется группой в текущий слой, но работает не так красиво. Впрочем, и сам этот формат значительно проще и реже используется дизайнерами.

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

Особенности импорта растра

Импорт растровой графики может преследовать две основные задачи

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

Для ручной трассировки контура качество и формат источника особого значения не имеют.

Если вы трассируете растр автоматическими средствами Flash (меню Modify / Trace Bitmap), то следует думать о предварительной обработке изображения для достижения наилучшего результата еще до импорта во Flash. Можно, к примеру, увеличить контрастность и насыщенность до максимально приемлемого уровня (ориентируйтесь на конкретную задачу), можно повысить четкость изображения или изменить размер палитры.

Многие эти действия легко выполняются в Adobe Photoshop. Обработка картинки перед импортом может очень сильно повлиять на качество трассировки. И если уж вы выполняете предварительную обработку изображения перед импортом, не поленитесь выбрать подходящий формат для сохранения графики. Для перевода в вектор лучше всего использовать форматы с ограниченной палитрой и без компрессии с потерями (Gif, Bmp и другие).

Если нужно трассировать только контур, переведите изображение в Grayscale или даже Black & White. При изменении пространства цветов проследите, чтобы на изображении не было грязи – мелких точек, штрихов

ит. п.

ВPhotoshop их можно убрать фильтром Dust & Scratches (Шум и царапны). Грязь при трассировке только увеличит размер объекта. Хотя лишние детали можно убрать и после трассировки и иногда это даже легче.

Если растровая картинка используется непосредственно, то есть не переводится в вектор, то позаботьтесь заранее определиться с ее размером.

106

Линейные размеры картинки и тип компрессии являются основными факторами, определяющими, какой вклад внесет она в общий размер файла SWF на выходе.

Лучше всего в смысле компактности работает Jpeg-компрессия. Она совершенно незаменима при использовании фотографий и полноцветных изображений. Однако если нужно сохранить прозрачность картинки (отдельных ее частей), то может потребоваться использование форматов Gif или Png. Продумывайте это заранее.

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

Если вы используете графику Jpeg, то для уменьшения размеров результирующего файла картинку можно сделать даже несколько меньше, чем она будет выглядеть на экране. Дело в том, что во Flash есть дополнительные функции сглаживания картинки во время воспроизведения и качество несколько вытягивается. Это, конечно, во многом просто обман зрения, но использование данного фактора позволяет экономить на размерах файла, что нам никогда не помешает. Использовать такой подход или нет, зависит только от вашей задачи. Для второстепенных элементов (фоны, к примеру) это работает очень неплохо. Также хорошо это подходит для текстур и изображений с невысокой детализацией.

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

Импорт изображений можно осуществлять через буфер. Это удобно. Операция выполняется стандартно.

При использовании этой операции можно заметить одну странность – копируемая картинка помещается во Flash как объект. Это заметно и по синей рамке вокруг, появляющейся при выделении, но больше всего это заметно при попытке применения операций, которые обычно применяются к растру. Они просто не работают. Превращение в объект не было бы таким удивительным, если бы соответствующий символ появлялся в библиотеке. Но этого не происходит. Растровая картинка в библиотеку добавляется, а объект – нет. Лучше всего преобразовать объект командой Break Apart и затем уже действовать по ситуации – превращать снова в клип или оставить, как есть, и редактировать как растр.

107

Импорт последовательностей изображений

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

Имена файлов могут выглядеть примерно так: Ball001.jpg

Ball002.jpg

Ball003.jpg

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

Это может быть полезно при необходимости трассировки изображений с кальки или при трассировке движения трехмерного объекта, сделанного в 3D пакете. Прямое использование импортированной таким образом графики непомерно увеличивает размер файла, что можно позволить лишь в редких случаях.

Преобразование растра в вектор

Задача векторизации растровых изображений возникает нередко. Наиболее актуально это для «графичных» элементов, таких как логотипы, рисунки, элементы оформления. Очень сильно выигрывают векторные объекты со сложными градиентными заливками. В растре в формате Jpeg градиенты передаются очень плохо и сильно увеличивают размеры файла.

Обычно векторизацию производят для уменьшения веса графического объекта или для возможности редактировать изображение как вектор. Во многих случаях изображение после перевода в вектор уменьшается в размерах, но это происходит не всегда. Если в картинке много цветов или много деталей, то размер может даже возрасти. Если вы хотите трассировать фотографию лица человека или что-то подобное, то скорее всего получите увеличение размера относительно соответствующего файла Jpeg и значительно падение качества. Результат будет прямо противоположен ожидаемому. Если вы не стремитесь специально стилизовать ваше изображение, то это совершенно неприемлемо.

Критерий принятия решения – векторизовать или нет, определяется количеством деталей в изображении. Физические же размеры изображения на экране особой роли не играют. Здесь следует отметить, что ручная трассировка бывает обычно предпочтительнее автоматической в смысле эффективности. Flash трассирует графику неплохо. Можно сделать трассировку и в таком пакете как Adobe Streamline. Этот пакет позволяет доволь-

108

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

Для трассировки используется команда меню Modify / Trace Bitmap. Предварительно нужно выбрать растровый объект, который вы собираетесь перевести в вектор. При выборе команды открывается окно, где можно выбрать опции трассировки.

Установка опций трассировки

Color Threshold – значение может меняться от 1 до 500.

Эта опция работает следующим образом. При сравнении двух пикселей определяется разница между ними в значениях RGB, и, если она меньше установленного значения, обоим пикселям назначается одинако-

вый цвет. Чем больше это значение, тем меньше цветов останется в

картинке.

For Minimum Area – значение от 1 до 1000. Соответствует размеру стороны квадрата, по которому принимается решение о назначении

цвета пикселя.

Curve Fit – определяет степень гладкости кривых линий (контуров). Corner Threshold – определяет порог, после которого углы начинают

сглаживаться.

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

Разбиение растра на пиксели

Во Flash существует команда Break Apart, которая делает разбиение растровой картинки на отдельные пиксели, что позволяет выполнять некоторые операции редактирования с использованием средств рисования

Flash.

Разбиение на пиксели позволяет, в частности, обрезать фон по контуру, то есть добиться результата, который обычно достигается заданием прозрачного фона для исходной картинки или использованием маски во

Flash.

Работа со специальными слоями

Кроме обычных слоев, которые создаются по умолчанию и служат основными носителями объектов, во Flash существуют специальные типы слоев Guide, Motion Guide и Mask. Рассмотрим их по порядку.

109