II. Создание анимации

1.1. Покадровая анимация

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

Итак, еще раз окинем взглядом окно программы Flash. Когда в нем открыт какой-либо ролик, в верхней части окна располагается так называемая шкала времени (timeline). В ее левой части приведены названия слоев, о которых мы поговорим в этой главе чуть позже, и их атрибуты. А в правой части обозначены пронумерованные кадры ролика (рис. 3.1). Благодаря нумерации кадров это окно и называют шкалой времени - ведь в ролике кадры следуют один за другим.

Рис. 3.1. Шкала времени, иначе именуемая временной диаграммой

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

Если предыдущие две фразы не совсем понятны, можно проделать следующее. Откройте новый ролик командой File New (Файл Создать) и нарисуйте что-нибудь в рабочей области. Обратите внимание на то, что указатель шкалы времени находится при этом на первом кадре. Создайте еще один кадр: выделите второй кадр на шкале и нажмите клавишу F7 (тайный смысл этого действия объясняется чуть ниже). Затем перетащите указатель на второй кадр. Вы увидите, что рабочая область пуста!

Передвинув указатель обратно, можно снова увидеть то, что было нарисовано в первом кадре. Итак, в первом кадре у нас имеется изображение, а второй пуст. Вообще-то нас можно поздравить: мы только что создали простейшую анимацию. Чтобы просмотреть результат анимации, нажмите клавиши CTRL+ENTER. Запомните это сочетание клавиш: экспериментируя с анимацией и интерактивностью в программе Flash, этой комбинацией придется пользоваться очень часто. Вы увидите мигающее изображение, поскольку два созданных кадра (с изображением и пустой) быстро сменяют друг друга.

1.1.1. Настройка свойств ролика

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

Зачастую ролик, фактически, отображается с очень низкой скоростью 3-4 кадра в секунду, которые, к тому же, сменяются неравномерно. Кроме того, ролики, в которых скорость проигрывания увеличена, обычно неоправданно велики по размеру, что затрудняет их загрузку через Интернет. Поэтому, как правило, флэшеры не пользуются скоростями больше чем 20-24 кадра в секунду, а по большей части оставляют без изменения исходную скорость в 12 кадров в секунду.

Чтобы установить скорость ролика, дайте команду Modify Movie (Изменить Ролик) или просто нажмите сочетание клавиш CTRL+M. Откроется диалоговое окно Movie Properties (Свойства ролика) (рис. 3.2). В самом верхнем поле Frame Rate (Частота кадров) и надо указать скорость воспроизведения в кадрах в секунду (frames per second, fps).

Рис. 3.2. Окно настроек ролика

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

Для эксперимента установим скорость воспроизведения равной 2 fps и щелкнем на кнопке ОК. Нажмем клавиши CTRL+ENTER, чтобы снова просмотреть ролик. Кадр с изображением и пустой теперь сменяют друг друга 2 раза в секунду, и изображение мигает медленнее.

1.1.2. Ключевые кадры

Чтобы двигаться дальше, введем еще два термина. Дело в том, что в программе Flash существуют кадры двух типов: ключевые кадры (keyframes) и обычные кадры. Ключевые кадры независимы друг от друга и могут содержать любое изображение. Обычные кадры в общем случае содержат в себе то же изображение, что и предыдущий ключевой кадр. Если сделать обычный кадр текущим (переместить на него указатель шкалы времени), то в рабочей области отобразится содержимое предыдущего ключевого кадра.

Поскольку в программе Flash очень часто приходится вставлять различные кадры, рекомендуется запомнить три основные горячие клавиши. Клавиша F7 вставляет в отмеченную позицию пустой ключевой кадр (это как раз то, что мы проделали в предыдущем эксперименте). Клавиша F6 вставляет в отмеченную позицию ключевой кадр и копирует в него содержимое текущего кадра. И, наконец, клавиша F5 вставляет обычный кадр.

При вставке какого-либо кадра "свободное" пространство на шкале времени заполняется обычными кадрами. Например, если создать изображение в первом кадре, а затем вставить ключевой кадр в позицию 10, то позиции со 2 по 9 автоматически заполняются обычными кадрами. Собственно говоря, при вставке в позицию 10 обычного кадра произойдет то же самое. Разница лишь в том. что в первом случае изменить содержимое кадра в позиции 10 можно, а во втором - нет.

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

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

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

Например, создадим четыре ключевых кадра в позициях с 1 по 4. Затем нарисуем в них что-то, подобное рис. 3.3. Если теперь установить скорость проигрывания 6 кадров в секунду и нажать клавиши CTRL+ENTER, на экране появится "пляшущий человечек".

Рис. 3.3. Покадровая анимация

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

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