Уроки WEB дизайна




 Раскадровка во Flash


Рассмотрев основные принципы покадровой анимации, можно переходить к так называемой промежуточной анимации - или раскадровке. Смысл этого названия заключается в следующем вместо того, чтобы последовательно рисовать все кадры подряд пользователь рисует только первый и последний кадр анимации, а все промежуточные рассчитывает программа. В редакторе Flash существуют два вида промежуточной анимации - это анимация формы и анимация движения.
На этом уроке мы рассмотрим анимацию формы, или как принято ее называть морфинг, которая позволяет плавно изменять форму объектов. Кому совсем незнаком термин морфинг советую вспомнить или пересмотреть еще раз фильм Терминатор 2 Ссудный день, где многие спецэффекты построены на этом принципе. А теперь на простых примерах начнем разбираться как создается такой вид анимации. Для начала рассмотрим простейший пример, в котором круг плавно превращается в квадрат. Нарисуем в первом кадре круг.
Выделим, например, 12 позицию на шкале времени
и нажмем клавишу F7,
вставив туда пустой ключевой кадр. Теперь выберем инструмент прямоугольник. И изобразим в этом кадре квадрат. снова выделим первый ключевой кадр.
И посмотрим на панель Properties. Сейчас нас здесь интересует раскрывающийся список Tween - тип анимации, в котором по умолчанию выбран пункт None - нет.
Ранее в предыдущих версиях редактора, для создания промежуточной анимации использовалась отдельная вспомогательная панель Frame - кадр. Морфинг в программе Flash называют анимацией формы. Поэтому выберем в отмеченном списке пункт Shape - форма. Если все сделано правильно, то на шкале времени вся цепочка обычных кадров окрасится в салатовый цвет и по ней пройдет сплошная стрелка, указывающая на следующий ключевой кадр.
Теперь, нажав клавишу CTRL+Enter, можно посмотреть как круг плавно превращается в квадрат.
Закроем тестовое окно. Перетаскивая маркер по шкале времени можно рассмотреть все промежуточные кадры анимации, не тестируя ролик. Правда, изменить их программа не позволит, поскольку рисовать можно только в ключевых кадрах. Сразу хочу предупредить о типичной ошибке, которую часто допускают начинающие пользователи при создании анимации формы. Хорошенько запомните, что морфинг принципиально невозможен при работе с группами, символами или текстом.
В обоих ключевых кадрах должна находится только обычная несгруппированная векторная графика, а именно линии и заливки. Сгруппируем, например, фигуру в первом кадре, выделив ее
и выполнив команду Modify
-Group. Теперь можно убедиться, что анимация формы пропала. Если некорректный объект будет находиться в последнем кадре, то эффект будет тот же самый. Поэтому если у вас морфинг не получается проверьте прежде всего какие объекты находятся в ключевых кадрах анимации. Разгруппируем объект в первом кадре комбинацией CTRL+Shift+G
и немного усложним анимацию. Выделим последний кадр.
Передвинем прямоугольник.
Изменим его масштаб.
А также цвет заливки.
Протестируем ролик, нажав CTRL+Enter. Как видите, анимация идет нормально. Объект перемещается, плавно изменяя свою форму и цвет. Закроем тестовое окно и посмотри какие настройки допускает анимация формы. Вернемся в первый кадр. И обратим внимание на еще два списка на панели Properties ниже параметра Tween. Раскрывающийся список Blend - перетекание, отвечает за гладкость промежуточных форм, получающихся при морфинге.
При выборе пункта Distributive - распределенная, формы получаются более сглаженными, а при выборе пункта Angular - более угловатые. Поле Easing управляет равномерностью анимации. Сюда можно ввести любое число от -100
до +100. При нулевом значении превращение одной фигуры в другую происходит равномерно. при отрицательных значениях анимация начинается как бы постепенно, разгоняясь к концу. Давайте введем максимальное отрицательное число -100 и опубликуем ролик. Заметно, что анимация идет с ускорением. Закроем тестовое окно и введем в это поле максимальное положительное число.
Т.е. +100. И снова протестируем ролик. Теперь наблюдается противоположный эффект. Анимация к концу замедляется. С помощью этой настройки удобно создавать такие эффекты как движение с ускорением, торможение и т.д. А теперь поэкспериментируем немного с заливками. Выделим последний кадр.
Обратимся к панели Mixer и установим линейную градиентную заливку.
Настроим, например, красно-белый переход. Затем выполним команду Control-Test Movie
и посмотрим, что получилось. Анимация идет корректно. Сплошная заливка плавно перетекает в градиентную. Закроем тестовое окно. Если у нас в обоих кадрах градиентная заливка, то и в этом случае все будет работать нормально. Единственно, что редактор в этом плане не умеет делать, так это плавно превращать линейный градиент в круговой и наоборот. Поэтому следите, чтобы в начальном и конечных кадрах был одинаковый тип градиентной заливки, либо линейная, либо радиальная. Используя свойства плавного перетекания градиентных заливок, можно получить ряд интересных эффектов. Создадим, например, иллюзию перемещения источника освещения объекта. Перейдем к первому кадру, выберем инструмент Заливка,
на панели Mixer установим круговой градиент,
и настроим переход от белого цвета к темно-синему.
Затем щелкнем по кругу так, чтобы центр градиента находился где-нибудь слева вверху.
Скопируем объект в буфер, выделив его инструментом Arrow
и кликнув по кнопке Copy.
Теперь перейдем в последний кадр, удалим прямоугольник.
И вставим из буфера скопированный объект командой Edit
-Paste in Place вставить на место. При этом вставка произойдет точно в те же координаты, откуда объект был скопирован. Выберем инструмент Paint Bucket и сместим центр круговой заливки в противоположную сторону.
Протестируем ролик и посмотрим результат. Центр градиента плавно смщается и создается впечатление перемещения источника освещения. Похожим способом несложно сделать также пульсирующие градиенты, которые хорошо подходят для изображения фонарей, мигалок, светильников, звезд и т.п. Раскрепостите свою фантазию и успех будет вам обеспечен.

Карта сайта Реклама
На нашем сайте Вы сможете найти любую информацию о программах 3D Max, Macromedia Flash MX, Corel Draw 12, Adobe Illustrator и многих других. Вы не найдете на данном сайте различные серийники, ключи, активацию, русификаторы, кряк, crack, keygen, серийные ключи и кейгены для этих программ. Для приобретения или скачивания программ воспользуйтесь ссылками на официальных сайтах производителей.