Практические работы

Рисование 1: Фигуры

-------------------------------------------------------------------------------------------------------------------------------------------------

Рисование 2: Фигуры

Рисование 3: Фигуры

-------------------------------------------------------------------------------------------------------------------------------------------------

Взаимодействие форм

Используйте прямоугольный примитив и звезду. Используйте овал и линию.

-------------------------------------------------------------------------------------------------------------------------------------------------

Создание символа и использование инструмента Аэрограф

1. Измените цвет монтажного стола (Панель свойств).

2. Создайте любую фигуру (звезда, шар и тд).

3. Преобразуйте фигуру в символ (Правой кнопкой мыши по фигуре Преобразовать в символ).

4. Удалите фигуру со сцены.

5. Выберите инструмент Аэрограф, на Панели свойств в разделе СИМВОЛ нажмите на кнопку Правка и выберите ваш символ.

6. Используйте инструмент Аэрограф, изменяя параметры горизонтального и вертикального масштабирования, а также параметры ширины и высоты в разделе КИСТЬ.

Градиент

1. Для круга используйте радикальный градиент, а для квадрата линейный градиент.

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

3. Чтобы выровнять фигуры примените сетку (Просмотр Сетка Показать сетку).

-------------------------------------------------------------------------------------------------------------------------------------------------

Градиент

1. Для круга используйте радикальный градиент, а для квадрата линейный градиент.

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

3. Чтобы выровнять фигуры примените сетку (Просмотр Сетка Показать сетку).

-------------------------------------------------------------------------------------------------------------------------------------------------

Градиент

1. Для круга используйте радикальный градиент, а для квадрата линейный градиент.

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

3. Чтобы выровнять фигуры примените сетку (Просмотр Сетка Показать сетку).

-------------------------------------------------------------------------------------------------------------------------------------------------

Градиент

1. Для круга используйте радикальный градиент, а для квадрата линейный градиент.

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

3. Чтобы выровнять фигуры примените сетку (Просмотр Сетка Показать сетку).

-------------------------------------------------------------------------------------------------------------------------------------------------

Нарисуйте любого персонажа, распределив его по слоям. Каждому слою дайте соответствующее название.

• 1 слой - тело

• 2 слой - глаза

• 3 слой - брови

• 4 слой - рот

----------------------------------------------------------------------------------------------------------------------------------------------------------

Нарисуйте любого персонажа, распределив его по слоям. Каждому слою дайте соответствующее название.

• 1 слой - тело

• 2 слой - глаза

• 3 слой - брови

• 4 слой - рот

----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

Практическая работа: Знакомство с Adobe Flash CS6

Как создать новый файл (документ)

1. В главном меню Adobe Flash выберите Файл Создать.

1. Перед вами появится диалоговое окно Создать документ.

1. Выберите вкладку Общие, а в ней ActionScript 3.0.

ActionScript 3.0 — это последняя версия объектно-ориентированного языка программирования, на котором работает Flash. C его помощью вы можете добавлять интерактивность в разрабатываемые приложения. Выбор опции Actionscript 3.0 означает, что новый документ (файл) будет без проблем воспроизводиться в браузере настольного компьютера (например, Chrome, Safari, Firefox, Opera и др.) с помощью Flash Player'а.

Другие опции списка нацелены на другие среды воспроизведения, например, AIR for Android и AIR for iOS создадут новые файлы, которые сможет проигрывать AIR на устройствах под управлением операционной системы Android или устройствах, созданных компанией Apple (iPad, iPhone).

1. В правой части диалогового окна задайте нужные параметры для сцены.

2. Нажмите ОК. Adobe Flash создаст новый файл с заданными установками.

1. Выберите Файл Сохранить.

Интерфейс

Основные элементы Flash:

• Командное меню в верхней части экрана

• Панель инструментов. Она предоставляет набор инструментов, которые применяются для создания и редактирования графических объектов. Для удобства работы панель инструментов разделена на четыре части:

1. Инструменты выбора и инструменты рисования;

2. Средства управления просмотром изображения: «Рука» — при выборе этого инструмента рабочую область можно перемещать в любом направлении с помощью мыши; «Масштаб» — щелчок на кнопке включает режим быстрого масштабирования изображения в рабочей области;

3. Инструменты выбора цвета контура и цвета заливки объектов;

4. Параметры или дополнительные опции — элементы установки дополнительных параметров выбранного инструмента.

• Сцена (Рабочая область и Монтажный стол). Рабочая область занимает всю центральную часть окна. В центре рабочей области находится монтажный стол. В рабочей области можно выполнять любые операции, однако в итоговый «кадр» попадут только те объекты или их фрагменты, которые расположены в пределах монтажного стола. На всей остальной части рабочей области можно рисовать, редактировать, располагать объекты. Кроме того, она нам потребуется в анимации для входа объекта в кадр (или выхода из него).

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

• Панель свойств. Если в рабочей области не выбран ни один объект, то панель свойств отображает общие параметры фильма. При выборе объекта или инструмента внешний вид панели соответственно меняется.

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

Выбор нового рабочего пространства

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

Кликните на кнопке Классический в правом верхнем углу рабочего пространства Flash и выберите одно из предопределенных рабочих пространств.

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

Сохранение рабочего пространства во Flash CS6

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

1. Кликните на кнопке с выпадающим списком рабочих пространств в правом верхнем углу экрана и выберите Создать рабочее пространство.

2. Появится диалоговое окно Создать рабочее пространство. 

3. Введите новое имя для вашего пользовательского рабочего пространства и нажмите OK.

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

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

Инструменты выделения и рисования «Стрелка»

1. Создайте новый документ.

1. Установите размер документа: 400 Х 300 px.

1. Установите такой масштаб отображения документа, чтобы Стол целиком отображался в рабочей области.

2. На Панели инструментов выберите инструмент Овал  и нарисуйте произвольный круг.

1. В Свойствах объекта задайте следующие параметры:

• Цвет обводки – Красный

• Цвет заливки – Зелёный

• Стиль обводки – Сплошная линия

• Толщина обводки – 3

1. Нарисуйте рядом с первым кругом еще один произвольный круг.

1. В Свойствах объекта задайте следующие параметры:

• Цвет обводки – Синий

• Цвет заливки – Оранжевый

• Стиль обводки – Пунктир

• Толщина обводки – 3

1. На Панели инструментов выберите инструмент Стрелка . Стрелкой выделите оранжевый круг (щелкните дважды мышью внутри объекта). Выбранный объект отображается покрытым мелкой сеткой, а контур – более толстым по сравнению с обычным.

1. Скопируйте выделенное изображение Ctrl + C, а затем вставьте Ctrl + V.
   Не отменяя выделения, переместите вставленное изображение.

1. Не отменяя выделения третьего, нового круга, в Свойствах объекта задайте следующие параметры:

• Цвет обводки – Фиолетовый

• Цвет заливки – Желтый

• Стиль обводки - Штриховка

• Толщина обводки – 10

1. После этого снимите выделение, щёлкнув мышью в любом свободном месте рисунка. Получим следующее изображение:

1. Подобным образом ниже добавьте в рисунок изображение трёх прямоугольников. При создании прямоугольника используйте инструмент Прямоугольник . В Свойствах объектов задайте следующие параметры:

для 1 прямоугольника:

• Цвет обводки – Зеленый

• Цвет заливки – Фиолетовый

• Стиль обводки – Сплошная линия

• Толщина обводки – 3

для 2 прямоугольника:

• Цвет обводки – Красный

• Цвет заливки – Голубой

• Стиль обводки – Пунктир

• Толщина обводки – 3

для 3 прямоугольника:

• Цвет обводки – Фиолетовый

• Цвет заливки – Оранжевый

• Стиль обводки – Штриховка

• Толщина обводки – 10

1. На Панели инструментов выберите инструмент Стрелка . Выделите только заливку этой фигуры и переместите выделенную заливку немного в сторону:

1. На Панели инструментов выберите инструмент Ведро с краской . Установите  цвет заливки - Зелёный. Залейте пустую область между контуром и заливкой.

2. Снова выберите инструмент Стрелка   и выделите только контур фигуры. Нажмите на клавиатуре клавишу Delete. В результате выделенный контур будет удалён из рисунка:

1. На Панели инструментов выберите инструмент Стрелка  и выделите только контур третьего круга.

1. Этим же инструментом переместите выделенный контур немного в сторону:

1. На Панели инструментов выберите инструмент Ведро с краской  и задайте цвет заливки - Голубой. Залейте пустую область между контуром и заливкой:

1. Снова выберите инструмент Стрелка  и выделите изображении заливки, оставшейся вне контура. В результате эта область окажется выделенной. Нажмите на клавиатуре клавишу Delete. В результате выделенная часть заливки будет удалена из рисунка:

1. На Панели инструментов выберите инструмент Стрелка . Подведите указатель мыши к границе контура второго круга. Рядом с указателем появится небольшая дуга, которая свидетельствует о том, что указатель находится в «горячей» зоне объекта

1. Нажмите левую клавишу мыши и, не отпуская, измените форму круга. Отпустите левую клавишу мыши и объект изменит форму:

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

Самостоятельно измените форму объекта примерно так, как показано на рисунке:

1. На Панели инструментов выберите инструмент Стрелка . Выделите правую границу второго прямоугольника. Этим же инструментом переместите выделенный контур немного в сторону:

Тоже самое проделайте с остальными границами прямоугольника:

Самостоятельно измените форму объекта так, как показано на рисунке:

1. Используя инструмент Стрелка  произвольно измените форму третьего прямоугольника так как показано на рисунке:

1. Готовое изображение сохраните на Рабочем столе в формате *.fla

Готовое изображение:

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

Инструменты выделения и рисования «Свободное преобразование»

1. Создайте новый документ.

2. Установите размер документа: 400 Х 300 px.

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

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

Чтобы получить правильную фигуру (квадрат) при рисовании, надо держать нажатой клавишу Shift на клавиатуре

==============================================================================

1. На Панели инструментов выберите инструмент Свободное преобразование . Выделите им первый квадрат.

2. С помощью маркеров, расположенных на выделяющей рамке, измените масштаб объекта:

=====================================================================================

1. На Панели инструментов выберите инструмент Свободное преобразование . Выделите им второй квадрат.

2. С помощью угловых маркеров, расположенных на выделяющей рамке, поверните объект на 45°:

=====================================================================================

1. На Панели инструментов выберите инструмент Свободное преобразование . Выделите им третий квадрат.

2. С помощью стороны выделяющей рамки, наклоните объект по одной из осей:

======================================================================================

1. На Панели инструментов выберите инструмент Свободное преобразование . Выделите им четвертый квадрат.

2. На Панели инструментов выберите инструмент Искажение и с помощью угловых маркеров, расположенных на выделяющей рамке, исказите объект:

=========================================================================================

1. На Панели инструментов выберите инструмент Свободное преобразование . Выделите им пятый квадрат.

2. На Панели инструментов выберите инструмент Огибающая и с помощью маркеров кривых Безье, расположенных на выделяющей рамке, измените объект:

==========================================================================================

1. Используя инструмент Свободное преобразование  и его модификаторы произвольно измените форму последнего квадрата:

==========================================================================================

1. Готовое изображение сохраните в своей папке в формате *.fla

Готовое изображение

Инструменты выделения и рисования «Лассо» и «Линия»

1. Создайте второй документ.

2. Установите размер документа: 400 Х 300 px.

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

4. Инструментами Овал   и Прямоугольник  нарисуйте 4 фигуры как показано на рисунке ниже. Задайте различные параметры заливки фигуры и контура.

===============================================================================

1. На Панели инструментов выберите инструмент Лассо . Нажав левую клавишу мыши, очертите произвольную границу вокруг объекта. Отпустите левую клавишу мыши, и объект окажется выделенным:

1. Инструментом Стрелка  переместите выделенный объект

========================================================================================

1. На Панели инструментов выберите инструмент Лассо . Нажав левую клавишу мыши, очертите произвольную границу внутри объекта:

2. Отпустите левую клавишу мыши, и выбранная часть объекта окажется выделенной:

3. Инструментом Пипетка  выберите произвольный цвет, и выделенная область окрасится в выбранный вами цвет

==========================================================================================

1. На Панели инструментов выберите инструмент Линия  а также активируйте инструмент Привязка к объектам . Установите указатель мыши в требуемой точке (либо за пределами, либо на контуре объекта), и, нажав кнопку мыши, проведите прямую линию, отделяющую выбираемую часть от остальной части объекта:

2. Выберите инструмент Стрелка  и щелкните дважды для выбора заливки и контура объекта или один раз для выбора только заливки или контура.

3. Инструментом Стрелка  переместите выделенную область

==========================================================================================

1. Инструментами Линия  и Указатель  разделите объект на четыре части.

=========================================================================================

1. Готовое изображение сохраните в своей папке в формате *.fla

Готовое изображение

Практическая работа: Работа со слоями

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

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

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

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

Чтобы изменить свойства уровня, выберите уровень на Графике времени, и выберите меню  Модификация  Временная шкала  Свойства слоя.

Добавление слоя

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

Чтобы добавить новый слой в список слоев, можно применить несколько вариантов:

1. В меню Вставка выберите Временная шкала   Слой

2. Щелкните по кнопке Создать слой в левом нижнем углу списка слоев

3. Щелкните по любому слою в списке слоев правой кнопкой, в контекстном меню выберите Вставить слой

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

Переименование слоя

При вставке новых слоев редактор автоматически дает им свое название - Слой 1, Слой 2… и т.д. Можно дать каждому слою свое название, чтобы легче различать слои.

Для этого:

1. Выделите существующий слой 

2. Дважды щелкните по названию слоя и дайте новое название

3. Щелкните вне названия, чтобы применить новое название слоя.

После этого на этот новый слой Вы можете вставить любые элементы. 

Заполнение слоев

Уровень может быть заполненным или пустым, т.е. не содержащим никаких объектов.

Пустой слой обозначен пустым кружком в кадре 1, заполненный слой - черным кружком.
На рисунке слева - фоновый уровень имеет заполнение (вставленные объекты), уровень текста создан, но не заполнен (пустой уровень).

Так как сам по себе пустой уровень создавать нет смысла, то такой пустой уровень можно назвать временно пустым

Блокировка слоя

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

На рисунке - слой с названием Фон - первый слой монтажного кадра мультипликации. Щелкните по белому кружку ниже значка замка, чтобы заблокировать слой. В слое  Фон появится значок замка. Кроме того, такой слой будет обозначен значком перечеркнутого карандаша. Это означает, что в заблокированном слое нельзя выделить и редактировать объекты.

Чтобы заблокировать все уровни за исключением выделенного уровня, удерживайте клавишу Alt.

Скрытие слоя

Слой можно временно скрыть (сделать невидимым). Для скрытия слоя щелкните по белому кружку ниже значка глаза .

На рисунке слева Слой 2 скрыт, что обозначено красным крестиком. При повторном щелчке по красному крестику слой вновь становится видимым.

Дублирование слоя

Выделите слой, в контекстном меню уровня выберите Дублировать слои.

Копирование и вставка слоев

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

Удаление слоя

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

Перемещение слоев

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

Создание папок слоев

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

В этом случае есть два выхода:

1. Отсоединить график времени от основного окна программы и расположить его отдельно, соответственно увеличив ширину и высоту.

2. Распределить связанные уровни по папкам. При этом можно просматривать, блокировать, скрывать связанные уровни.

Чтобы создать папку уровней, щелкните по кнопке Создать папку ниже списка уровней.

Уровни помещаются в папку уровней перетаскиванием. Для этого щелкаете по нужному уровню и перетаскиваете его к нужной папке. Когда черная полоса оказывается под папкой, отпускаете кнопку мыши.

В результате Панель уровней приобретает вид, показанный на рисунке ниже: слева - в развернутом виде (показано все содержимое папки слоев), справа - в свернутом виде.

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

Справочные слои

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

Справочный слой создается как обычный слой - при щелчке по кнопке Создать слой внизу списка слоев Временной шкалы. Чтобы отметить на Графике времени справочный уровень, щелкните  правой кнопкой и выберите Направляющая. Стандартный значок уровня преобразовывает в значок T-square , указывая, что это теперь справочный уровень. Вы можете преобразовать любой стандартный уровень в справочный уровень.

Практическая работа: Временная шкала

Временная шкала (или График времени) по умолчанию располагается в нижней части окна программы, открывается / закрывается из меню Окно (Window) -Временная шкала (Timeline).

Общий вид временной шкалы

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

1. Переключение между Временной шкалой и Редактором  движения. На рисунке выше - режим Временной шкалы.

2. Красный движок

3. Шкала кадров

4. Кадры

5. Открытие меню Временной шкалы

6. Слои (уровни)

7. Строка состояния

8. Полосы прокрутки Временной шкалы

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

Чтобы отсоединить Временную шкалу от окна программы - щелкните по серой полосе вверху временной шкалы и перетаскивайте его на нужное место. При этом можно настроить размеры временной шкалы (ширину и высоту).

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

Все части временной шкалы неразрывны, т.е. перемещаются одновременно. Нельзя, например, отсоединить и расположить отдельно список слоев или строку состояния.

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

Шкала кадров

Шкала кадров имеет вид линейки с делениями. Одно деление шкалы соответствует 1 кадру мультипликации.

Вид шкалы кадров настраивается, используя Меню временной шкалы.

Красный движок

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

Красный движок активирует (т.е. делает видимыми) все объекты, находящие на всех уровнях (слоях) в определенном кадре.

При перемещении движка по шкале кадров (вправо или влево) последовательно  активируются кадры всех слоев, позволяя тем самым предварительно просматривать создаваемую мультипликацию.

Движок можно перемещать простым перетаскиванием. Перемещение движка на 1 кадр (вперед или назад) производится при щелчке по кнопкам на клавиатуре   "" (вперед) или "

Строка состояния

1. Кнопки, позволяющие одновременно видеть не только текущий кадр, но и несколько предыдущих и последующих кадров. Эта функция (так называемая "луковая шелуха") особенно полезна при создании покадровой мультипликации

2. Номер текущего кадра, который соответствует положению красного движка на шкале кадров. Если напечатать другой номер кадра, красный движок  перескочит в положение введенного номера кадра.

3. Скорость мультипликации (кадры в сек). В строке состояния можно изменить скорость мультипликации, которая была определена в настройках проекта.

4. Время мультипликации, которое зависит от числа кадров и скорости мультипликации.

Кнопки управления мультипликацией

Как сказано ранее, перемещением красного движка по шкале кадров можно предварительно просмотреть создаваемую мультипликацию.

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

Настройки временной шкалы

Вы можете корректировать вид временной шкалы.

Если Вы хотите видеть больше слоев, то можете сдвинуть границу шкалы (вверх/вниз).

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

Окрашенные кадры -  чтобы включить расцветку последовательности кадров.

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

Чтобы изменить свойства уровня, выберите уровень на Графике времени, и выберите меню  Модификация  Временная шкала  Свойства слоя.

Практическая работа: Работа с кадрами. Вставка простых и ключевых кадров

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

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

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

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

Ключевые кадры - кадры, в которых мы сами определяем необходимые изменения.

Ключевой кадр обозначен на Графике времени как маленький круг. Ключевой кадр может быть заполненным (обозначен черным кружком) или пустым (пустой кружок).

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

Вставка простых кадров

Сделаем первый слой фоновым слоем. Для начала поменяем цвет монтажного стола. Затем дважды щелкнем по Слою 1 и переименуем его в «Фон».

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

• В контекстном меню кадра выберите Добавить кадр

• В меню Вставка выберите Временная шкала Кадр

• Нажмите клавишу F5

График времени изменится:

Как видим, все вновь созданные кадры - обычные кадры, в которых не происходит никаких изменений.

Закончим со слоем «Фон» и заблокируем его.

Вставка ключевых кадров

• Пример 1

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

Вставим на новый слой объект, например круг зеленого цвета - вверху справа на сцене.

В 1-м кадре Слоя 2 появляется черный кружок, т.е. создается ключевой кадр. Переименуем слой в «Круг».

Программа автоматически отвела для круга 30 кадров, т.е. столько же, сколько мы ранее отвели для фонового слоя. 

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

В слое "Круг" щелкаем по 5-му кадру и вставим здесь ключевой кадр.
Для этого можно использовать несколько способов:

• В контекстном меню кадра выберите Вставить ключевой кадр

• В меню Вставка выберите Временная шкала  Ключевой кадр 

• Щелкните по клавише F6.

На сцене немного передвигаем круг по направлению к правому нижнему углу. Затем щелкаем по 10, 15, 20, 25, 30 кадрам, создаем в них ключевые кадры и продолжаем продвигать круг к его финишу.

График времени приобретает вид:

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

Можно просмотреть созданную мультипликацию, нажав клавишу Enter.

Сохраните файл (Файл Сохранить Пример 1).

• Пример 2

Создадим новый файл. Затем Слой 1 переименуем в «Фон» и поменяем цвет монтажного стола. Также как и в первом примере заблокируем слой «Фон».

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

Вставим на слой «Круг» круг красного цвета (вверху слева), преобразуем его в символ (Правой кнопкой по кругу Преобразовать в символ Выбрать тип Фрагмент ролика Нажать ОК).

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

Устанавливаем красный движок в 5-й кадр, переместим круг на сцене в направление нижнего правого угла (круг будет двигаться по диагонали из одного угла сцены в другой).

Создадим ключевой кадр в 10-м кадре, щелкаем между 5-м и 10-м кадрами и вновь создаем классическую анимацию движения. Круг на сцене перемещаем еще дальше к нижнему правому углу.

Таким же образом создаем другие ключевые кадры и плавное перемещение круга между ними.

Временная шкала приобретает вид:

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

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

И второе отличие - наш круг выступает здесь как символ (при покадровой анимации круг был просто векторным рисунком).

Можно просмотреть созданную мультипликацию, нажав клавишу Enter.

Сохраните файл (Файл Сохранить Пример 2).

• Пример 3

Создадим новый файл. Затем Слой 1 переименуем в «Фон» и поменяем цвет монтажного стола. Также как в первом и втором примерах заблокируем слой «Фон».

Добавим новый слой и переименуем его в «Круг».

Создадим движение круга, аналогичное его движению в примере 2, но другим способом. На этот раз используем другую функцию Создания анимации движения.

Вставляем на этот слой круг синего цвета (вверху слева на сцене), преобразуем круг в символ, т.е. делаем все также как в примере 2.

Выделяем круг на сцене (или выбираем 1-й кадр на Временной шкале), в контекстном меню выбираем Создать анимацию движения.

Так как фоновый слой у нас демонстрируется 30 кадров, то и для слоя «Круг» программа автоматически создает 30 кадров плавного изменения (движения). 

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

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

Выделяем 5-й кадр (ключевого кадра не создаем), отклоняем круг от прямолинейного движения так, как в примере 2. Программа автоматически создает ключевой кадр в 5-м кадре.

Выделяем 10-й кадр, снова создаем отклонение в траектории движения круга. Программа автоматически создает ключевой кадр в 10-м кадре.

Аналогично поступаем с положением круга и в кадрах 20 и 30.

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

Практическая работа: Покадровая анимация, анимация формы и классическая анимация движения

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

1. Создайте новый файл размером 200 Х 200 пикселей

2. Установите такой масштаб отображения документа, чтобы Монтажный стол целиком отображался в рабочей области

3. Создайте 2 слоя и переименуйте их в «Циферблат» и «Стрелка»

4. На слое «Циферблат» нарисуйте циферблат будущих часов. Заблокируйте слой

5. На слое «Стрелка» нарисуйте стрелку секундомера

1. Выделив во всех слоях вторые кадры, щелкните правой клавишей мыши и выполните команду Вставить ключевой кадр:

1. На 2-м кадре, выделив стрелку, выберите инструмент Свободная трансформация. Сместите точку трансформации к центру циферблата и поверните стрелку

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

1. Установите частоту смены кадров: 1 кадр в секунду (Панель свойств вкладка Свойства значение FPS - 1)

1. Просмотрите готовый ролик, нажав сочетание клавиш Ctrl + Enter

Анимация формы

1. Создайте новый файл размером 700 Х 200 пикселей

2. Нарисуйте круг красного цвета без контура слева монтажного стола

1. Щелкните правой кнопкой мыши в ячейке того кадра, который хотите сделать последним в преобразовании, например, 24-го. В контекстном меню выберите команду Вставить ключевой кадр или нажмите клавишу F6

В результате получим следующую «цепочку»:

• ключевой кадр,

• 22 промежуточных, идентичных первому ключевому,

• ключевой кадр.

1. Во втором ключевом кадре замените изображение круга на квадрат синего цвета без контура

1. Выделите 12 кадр и в контекстном меню кадра выберите команду Создать анимацию формы

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

1. Установите частоту смены кадров 10 кадров в секунду

2. Просмотрите ролик

Классическая анимация движения

1. Создайте новый файл размером 600 Х 400 пикселей

2. Переименуйте 1 слой в «Пол» и нарисуйте внизу монтажного стола линию по горизонтали, это будет у нас пол

3. Заблокируйте слой

4. Создайте 2 слой и переименуйте его в «Мяч». Нарисуйте мяч и преобразуйте его в символ (в контекстном меню мяча выберите команду Преобразовать в символ или нажмите клавишу F8. Затем выберите Фрагмент ролика)

1. Щелкните правой кнопкой мыши в ячейке того кадра, который хотите сделать последним, например 25-го. В контекстном меню выберите команду Вставить ключевой кадр или нажмите клавишу F6

1. В контекстном меню 1-го кадра в контактном меню выберите команду Создать классическую анимацию движения

В результате первый и последний ключевые кадры на временной линейке будут соединены стрелкой на светло-сиреневом фоне.

1. Выберите 12 кадр и передвиньте мяч вниз к полу

1. Просмотрите готовый ролик, нажав сочетание клавиш Ctrl + Enter

Можно сделать передвижение мяча более реалистичней. Для этого:

1. Выберите 11 кадр и сделайте его ключевым. Затем сплющьте мяч инструментом Преобразование и приспустите его к полу

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

1. Установите частоту смены кадров 15 кадров в секунду

2. Просмотрите ролик