Технология создания анимации в Adobe Flash

Технология создания анимации в Adobe Flash

Как загрузить заготовленные картинки в библиотеку?

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

Панель библиотеки находится сразу после панели «свойства».

Панель библиотеки

Чтобы импортировать картинку или любой другой графический объект, обратимся к верхнему меню – Файл - Импорт и выберем один из предложенных пунктов.

• «Импортировать в рабочую область» – означает, что картинки будут импортироваться сразу на сцену.
• «Импортировать в библиотеку» – означает, что картинки будут импортироваться в библиотеку.

Как выглядит монтажный стол?

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

Слои

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

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

Кадры

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

В компьютерной анимации существует понятие - ключевые кадры (keyframes). Их название говорит само за себя. Это кадры, которые Flash не вправе изменять в процессе создания анимации. Вы задаете эти ключевые кадры, а промежуточные кадры между ними выстраивает Flash. Существует два типа промежуточных кадров - кадры, построенные на основе изменения геометрии (shape tweening) или кадры, построенные на изменении символов (motion tweening). И, конечно же, кадры могут быть пустыми, т.е. ничего не содержать.

Элементарные операции с кадрами:

• Вставить пустой ключевой кадр - Insert->Blank keyframe, F7
• Ключевой кадр, повторяющий содержание предыдущего - Insert->Keyframe, F6
• Очистить ключевой кадр - Insert->Clear keyframe, Shift-F6
• Вставить обычный кадр - Insert->Frame, F5
• Удалить кадр - Insert->Remove Frames, Shift-F5

Как создать классическую анимацию движения?

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

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

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

Примечание: Для создания анимации движения необходимо, чтобы на слое находился только один элемент.

3. Создайте второй ключевой кадр, на котором должна заканчиваться анимация, и оставьте новый ключевой кадр выбранным. 

4. Чтобы изменить элемент в конечном кадре, выполните одно из следующих действий:

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

5. Чтобы создать классическую анимацию, выполните одно из следующих действий.

• Щелкните любой кадр в диапазоне кадров анимации и выберите «Вставка» > «Классическая анимация движения».
• В диапазоне кадров анимации щелкните любой кадр правой кнопкой мыши  и в контекстном меню выберите «Создать классическую анимацию движения».

Если на шаге 2 был создан графический объект, Flash автоматически преобразует объект в символ и присвоит ему имя tween1.

6. Если на шаге 4 был изменен размер элемента, выберите «Масштаб» и разделе «Анимация» инспектора свойств, чтобы анимировать изменение размера выделенного элемента.

7. Чтобы обеспечить более реалистичное ощущение движения, примените замедление/ускорение к классической анимации движения. Чтобы применить замедление к классической анимации, используйте поле «Замедление» в разделе «Анимация» инспектора свойств, чтобы указать значение замедления для каждого экземпляра классической анимации движения. В диалоговом окне «Пользовательское замедление и ускорение» можно более точно контролировать скорость классической анимации движения.

Перетащите значение в поле «Замедление» или введите значение, чтобы настроить скорость изменений между промежуточными кадрами.

• Чтобы начать классическую анимацию движения медленно и ускорить по направлению к конечному кадру анимации, введите отрицательное значение между -1 и -100.
• Чтобы начать классическую анимацию движения быстро и замедлить по направлению к конечному кадру анимации, введите положительное значение между 1 и 100.
• Чтобы выполнить более сложное изменение скорости в пределах диапазона кадров анимации, щелкните кнопку «Редактировать» рядом с полем «Замедление», чтобы открыть диалоговое окно «Пользовательское замедление и ускорение».

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

Подробнее познакомиться с процессом анимации вы можете в видео: