Добавить материал и получить бесплатное свидетельство о публикации в СМИ
Эл. №ФС77-60625 от 20.01.2015
Свидетельство о публикации

Автоматическая выдача свидетельства о публикации в официальном СМИ сразу после добавления материала на сайт - Бесплатно

Добавить свой материал

За каждый опубликованный материал Вы получите бесплатное свидетельство о публикации от проекта «Инфоурок»

(Свидетельство о регистрации СМИ: Эл №ФС77-60625 от 20.01.2015)

Инфоурок / Информатика / Другие методич. материалы / Лабораторная работа по созданию анимации
ВНИМАНИЮ ВСЕХ УЧИТЕЛЕЙ: согласно Федеральному закону № 313-ФЗ все педагоги должны пройти обучение навыкам оказания первой помощи.

Дистанционный курс "Оказание первой помощи детям и взрослым" от проекта "Инфоурок" даёт Вам возможность привести свои знания в соответствие с требованиями закона и получить удостоверение о повышении квалификации установленного образца (180 часов). Начало обучения новой группы: 28 июня.

Подать заявку на курс
  • Информатика

Лабораторная работа по созданию анимации

библиотека
материалов

ЛАБОРОТОРНАЯ РАБОТА

на тему: «Ознакомление с Flash. Создание простого мультика»

Содержание

Тема 1. Ознакомление с Flash. Создание простого мультика

Тема 2. Трансформация, исчезновение и появление объектов

Тема 3. Движение по направляющему пути

Тема 4. Движущиеся элементы

Тема 5. Раскадровка формы и морфинг

Тема 6. Создание анимационного спутника планеты

Тема 1. Ознакомление с Flash. Создание простого мультика

Цель занятия: познакомится с основными командами Меню, научиться создавать простые мульты.

Задание.

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

Пример.

Выполните следующую последовательность действий:

1. Выберите инструмент "овал" и нарисуйте с помощью него овал или круг в левой части сцены.

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

3. Теперь войдите в меню Insert и выберите Convert to symbol (или нажмите F8). В появившемся диалоге выберите селектор Graphic и нажмите ОК:

Рис. 1 - Выбор типа символа при создании

4. Теперь выберите на шкале времени вверху 25-й кадр (просто щелкните по нему мышкой), и выберите меню Insert- -Keyframe (или нажмите F6). Этим вы создадите так называемый "ключевой кадр" на 25-м кадре вашей шкалы времени.

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

6. Вернитесь на шкале времени в 1-й кадр. (В доказательство Вы должны увидеть свою фигуру опять в левой части экрана). Из меню Insert (или из контекстного меню при нажатии правой клавиши мыши на первом кадре) выберите Create motion tween.

Выберите Control- -Play (или просто нажмите Enter) чтобы просмотреть результат.

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

Меню View:

Goto (Идем к ) - переход по кадрам и сценам.

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

Show Frame (Показать кадр) - показывает весь кадр на экране.

Show All (Показать все) - все, что есть то и покажет

Outlines (Контуры-границы) - включает режим отображения объектов в контурном виде (для быстрой прорисовки на медленных компьютерах) без заливки.

Fast (Быстро) - режим отображения объектов с заливкой, но без сглаживания (для тех же целей).

Antialias (Сглаживание) - нормальное отображение объектов со сглаживанием, не считая текста.

Antialias Text (Сглаживание текста) - загладит все, что есть на сцене.

Timeline (Шкала времени) - показать или убрать киноленту.

Work Area (Рабочая зона) - отображение рабочей зоны (удобно отключать при больших размеров фильма).

Rulers (Линейки) - включает линейки для удобства позиционирования объектов.

Grid (Сетка) - где линейка, там и сетка. Очень удобно при рисовании.

Snap (Магнит) - притягивание объектов друг к другу и к сетке. Об использовании данной команды читайте в следующих работах.

Show Shape Hints (Показывать магнитные отметки) - включает режим отображения магнитных отметок с помощью, которого например, можно проконтролировать соединение объектов между собой.

Меню Insert:

Практически одно из основных меню.

Convert to a Symbol (Преобразование в символ) - применяется при преобразовании выделенных объектов Stage в символы.

New Symbol (Новый символ) - создать новый символ.

Layer (Слой) - добавляет новый, пустой слой.

Motion Guide (Путеводитель) - тоже слой, но предназначен для задания произвольной траектории движения объектов.

Frame (Кадр) - создать новый, пустой кадр.

Delete Frame (Удалить кадр)

Keyframe (Ключевой кадр) - создает новый ключевой (определяющий) кадр с тем же содержимым, что и предыдущий Keyframe в этом слое.

Blank Keyframe (Пустой Keyframe) - иногда возникает необходимость вставки пустого, ключевого кадра.

Clear Keyframe (Очистить Keyframe) - превращает выделенный Keyframe в обычный.

Create Motion Tween (Создать преобразование перемещения) - вот та волшебная команда, которая заставит перемещать и трансформировать Ваши объекты.

Scene (Сцена) - вставить новую сцену в фильм.

Remove Scene (Удалить сцену) - но для этого необходимо иметь более одной сцены в проекте.

Меню Modify:

Служит для изменения объектов, свойств и т.д.

Instance (Экземпляр) - запускает окно Instance Properties для задания свойств выделенному объекту.

Frame (Кадр) - свойства кадра.

Layer (Слой) - свойства рабочего слоя.

Scene (Сцена) - возможность изменения имени сцены.

Movie (Фильм) - параметры фильма (размер, кадры и т.д.).

Далее идут команды работы с текстом.

Font (Шрифт) - работа с выделенным текстом.

Paragraph (Абзац) - свойства выделенного текстового блока.

Style (Стиль) - работа со стилем выделенного текста.

Kerning (Кернинг) - плотность выделенного текста.

Text Field (Текстовое поле) - параметры выделенных текстовых полей (открывает широкие возможности при написании интерактивных сцен).

После издевательства над текстом, можно заняться творчеством с другими объектами.

Transform (Преобразование) - трансформация объектов (повороты, изменение размеров и др.).

Arrange (Упорядочить) - позволяет изменять уровень наложенности объектов и блокировки.

Curves (Кривые) - работа с кривыми, позволяет добиться хороших результатов при правильном подходе.

Frames (Кадры) - синхронизация кадров, или их реверс.

Trace Bitmap (Трассировка растровой графики) - перевод обычной графики в растровую, для дальнейшей работы во Flash.

Align (Выравнивание) - удобная функция для установки объектов относительно друг друга.

Group (Группировка) - "склеивание" различных объектов в одну фигуру.

Ungroup (Разгруппировка)

Break Apart (Разбить) - разбивает текст на отдельные символы или преобразует растровое изображение.

Меню Control:

Служит для управления просмотром и проверки нашего фильма. Многие команды аналогичны командам управления любого плеера.

Play (Проиграть) - показывает фильм с текущего кадра.

Rewind (Обратная перемотка) - переход на первый кадр сцены.

Step Forward (Шаг вперед) - переход на следующий кадр.

Step Backward (Шаг назад) - переход на предыдущий кадр.

Test Movie (Тест фильма) - проверка фильма в тестовом режиме.

Test Scene (Тест сцены) - не путать с Test Movie, ведь наш фильм может состоять из отдельных эпизодов, и можем проверить их отдельно.

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

Loop Playback (Зациклить) - бесконечное проигрывание фильма.

Play All Scenes (Проиграть все сцены) - если не установить функцию, то вы увидите только текущею сцену.

Enable Frame Action (Включить действия в кадрах) - позволяет реагировать на все установленные действия.

Enable Buttons (Включить кнопки) - разрешает работу кнопок при просмотре и редактировании.

Mute Sound (Выключить звук) - чтоб соседям не мешать. Отключает звуки в фильме, полезна при работе с фильмом, в котором предусмотрена звуковая реакция на действия.

Меню Libraries:

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

Меню Window:

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

New Window (Новое окно) - открытие сцены в новом окне.

Arrange All (Упорядочить все) - расставляет все окна по вертикали.

Cascade (Каскадом) - тоже, но одно над другим.

Toolbar (Панель инструментов) - устанавливает режимы отображения рабочей панели.

Inspectors (Инспекторы) - вывод на экран инспекторов объектов, кадров, сцен и т.д.

Controller (Управление) - вывод панели управления воспроизведения фильма.

Colors (Цвета) - выводит панель, для управления цветом и создания градиентных заливок.

Output (Вывод) - окно Output предназначено для контроля за выводом переменных генератора, помогает при проверки корректности работа интерактивных форм.

Generator Objects (Генератор объектов) - используется при работе с содержимым генератора.

Library (Библиотека) - хранилище объектов (символов) текущего проекта.

Тема 2. Трансформация, исчезновение и появление объектов

Цель занятия: научиться работать с командами свободной трансформации, исчезновения и появления объектов.

Рассмотрим Shape tweening (трансформация фигуры). Мы научимся преобразовывать одну фигуру в другую. Попробуем превратить треугольник в квадрат, а его в свою очередь в круг.

- В первом кадре нарисуйте инструментом Line [L] треугольник.

- Создайте пустой ключевой кадр (например 20) Insert / Blank keyframe [F7].

- Нарисуйте в нем инструментом Rectangle [R] квадрат без заливки.

- Вновь, создайте пустой ключевой кадр (например 40) Insert / Blank keyframe [F7].

- Нарисуйте в нем инструментом Oval [O] круг, тоже без заливки.

- Создайте еще один пустой ключевой кадр (например 60) Insert / Blank keyframe [F7].

- И нарисуйте в нем последнею фигуру - треугольник.

- Дважды щелкнем левой кнопкой мышки на первом кадре Timeline. Откроется окно Frame Properties (параметры кадра).

- Выберем уже знакомую нам закладку Tweening.

- В выпадающем меню tweening, выбираем Shape (фигура). Кроме шкалы Easing (ускорение), появится пункт Blend type (тип преобразования) с двумя параметрами: Distributive - для плавных линий и Angular - для более жесткого преобразования.

- Выберем второе значение.

- Нажмем ОК.

На Timeline появится стрелка к следующему ключевому кадру, на этот раз на зеленоватом фоне, символизирующем анимацию Shape tweening.

- Повторите пункты с заданием параметров трансформации для каждого следующего ключевого кадра (кроме последнего). Экспериментируя с разными значениями Blend type и Easing.

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

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

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

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

Проиллюстрируйте пословицу - "Делать из мухи - слона".

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

Символы существуют трех видов:

графические - любые рисунки или импортированная статичная графика, рисование мультик flash колобок инструмент convert

клипы - анимированная графика (по сути дела - самостоятельные фильмы) и кнопки.

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

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

- Выделите объект инструментом Arrow.

- Преобразуйте объект в символ Insert / Convert to Symbol [F8].

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

После преобразования, символ всегда доступен через библиотеку Window / Library [Ctrl+L].

Для вставки символа из библиотеки, просто перетащите его из окна библиотеки в рабочую область Stage.

Создание символов Insert / New Symbol [Ctrl+F8]. При создании нового символа, мы попадаем в режим редактирования символа. Его признаком служит "безразмерное" рабочее поле и имя символа над перечнем слоев, слева от имени находится имя сцены, в которой мы до этого работали. Для выхода из режима редактирования символа, щелкните на имени сцены. Для редактирования уже используемого в сцене символа - щелкните на нем правой кнопкой мыши и выберите Edit. Учтите что, изменив рисунок одного символа, вы измените рисунок всех его экземпляров.

Рассмотрим еще один метод в анимации - исчезновение и появление объектов.

- Создайте новый символ (см. выше).

- Установите его в первый кадр.

- Вставьте ключевой кадр (например 15) Insert / Keyframe [F6].

- Установите для первого кадра режим анимации - Motion.

- Перейдите в конечный кадр анимации (в нашем случае в 15-й).

- Дважды щелкните на символе левой кнопкой мыши.

- Откроется окно Instance Properties (свойства экземпляра).

- Выберем закладку цветовых эффектов - Color Effect.

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

- Выберем эффект прозрачности - Alpha, в выпадающем меню - Color Effect.

- Перемещая ползунок, установим нулевую прозрачность.

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

Создайте фантастический фильм, точнее его эпизод - "Телепортация киборга".

Сценарий фильма таков:

На экране две кабины для телепортации (с мигающими лампочками и индикаторами).

В одну из них входит киборг и исчезает, одновременно появляясь в другой. Киборг выходит из второй кабины. Дополнительное уточнение: Все элементы фильма должны быть символами. Используйте разные слои и отдельные анимированные символы для других символов (например - лампочки и индикаторы для кабин).

Поворот символа в соответствии с траекторией движения

Зачастую необходимо, чтобы при анимации по заданной траектории, символ изменял угол вращения в соответствии с направлением движения. Добиться этого очень легко, достаточно в ключевом кадре задающим анимацию движения - Tweening Motion, установить галочку Orient to path direction (ориентация по направляющей). В этом случае, при движении символа по траектории заданной в направляющем слое - Guide Layer, будет.

Проверим это на практике.

- Создадим новый символ New / Symbol [Ctrl+F8], назовите его Car - гоночный автомобиль формула-1.

- Поместите машину в первый кадр.

- Вставьте ключевой кадр (например 45) Insert / Keyframe [F6].

- Задайте для первого кадра режим анимации Motion.

- Установите галочку Orient to path direction.

- Вставьте направляющий слой Insert / Motion Guide.

- Нарисуйте в нем незамкнутую траекторию движения.

- В первом кадре установите автомобиль на начало траектории, а в последнем кадре на ее конец.

При просмотре Вы увидите, что Ваш гонщик точно следует всем поворотам трассы.

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

Тема 3. Движение по направляющему пути

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

Фильм этого проекта называется: MovePach.fla

В фильме три слоя:

Guide: Ladybug (Направляющие: божья коровка);

Ladybug (Божья коровка);

Background (Фон).

Для создания такого пути нам понадобится специальный слой, называемый слоем направляющих (guide layer). Линии, нарисованные на таком слое, не видны в SWF-файле, и хотя направляющий путь может вести объект по петляющей дороге, у него достаточно хороших манер, чтобы не появляться на экране во время просмотра фильма.

Фильмы в Flash создаются на столе с использованием киноленты, слоев, кадров и ключевых кадров

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

Создайте два слоя. Назовите нижний слой Background (Фон), а верхний - Ladybug (Божья коровка). Выделите верхний слой и нажмите кнопку Add Guide Layer (Добавить слой направляющих), которая находится справа от кнопки Insert Layer (Вставить слой). Над слоем Ladybug (Божья коровка) появится слой направляющих с именем Guide: Ladybug (Направляющие: божья коровка) (рис. 3.8). Выделите 30-й кадр в слое направляющих и, держа нажатой клавишу Shift, щелкните во всех кадрах столбца. Нажмите F5, чтобы добавить кадры вплоть до 30-го во все три слоя. Теперь стол готов к созданию движения по направляющему пути.

Слой Фона

Сплошной цвет #E6AB4C, заданный с помощью полей RGB на панели Mixer (Палитра), будет цветом фона. Используйте инструмент Rectangle (Прямоугольник), чтобы покрыть весь стол, и затем заблокируйте слой фона щелчком в столе со значком замка.

Рисунок 1. Работая с движением вдоль пути, можно сделать путь видимым и невидимым, щелкая в столбце видимости. Это позволяет проверить, как движение будет смотреться в реальном фильме

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

Слой направляющих

Выделите служебный слой и, используя карандаш, перо или кисть, нарисуйте путь, вдоль которого будет передвигаться наш объект. Оставьте достаточно места в начале и в конце пути для самого объекта. Если вы нарисуете путь точно из конца в конец стола, то объект при движении будет «выползать» за каря стола. В левой части рисунка 1 показано примерное положение пути, при котором божья коровка не вылезает за края стола. Заблокируйте слой, когда закончите.

Слой Ladybug

Божья коровка - это еще один рисунок. Нарисуйте сами или импортируйте рисунок божьей коровки (или другого понравившегося насекомого), выделите его и выберите команду Modify - Convert to Symbol (Изменить - Преобразовать в символ) или нажмите F8. такт как другие слои заблокированы, вы не рискуете случайно нарисовать жука не на том слое. Проделайте следующие шаги, чтобы заставить объект следовать вдоль намеченного пути:

1. Поместите считывающую головку на 30-й кадр и вставьте ключевой кадр.

2. Перемотайте фильм обратно в начало и нажмите Ctrl+F (Cmd+F), перейти на панель Frame (Кадр). Выделите кадр 1 и на панели Frame (Кадр) выберите Motion (Движение) в списке Tweening (Раскадровка) и установите флажки Orient to path (Следовать по пути) и Snap (Привязка). Когда вы установите флажок Orient to path (Следовать по пути), объект повернется, чтобы следовать вдоль кривой пути. Флажок Snap (Привязка) делает объект «привязанным» к пути. Если объект еще не находится на столе, поместите его в начало пути.

3. Передвиньте считывающую головку на 30-й кадр. Если вы уже выполнили привязку к пути, осторожно выделите объект (но не линию пути!) и перетащите объект вдоль траектории к ее концу. Во время перетаскивания вы увидите круглый маркер, который указывает центральную точку объекта и следует точно по линии пути. Убедитесь, что центральная точка находится в самом конце направляющего пути.

Тема 4. Движущиеся элементы

Цель занятия: использовать анимации движения.

1. Откроем готовый проект самолет.

2. Добавим новый слой. (Insert- Layer). Дадим название Фон. Расположим слой Фон самым нижним.

3. В качестве фона будем использовать растровое изображение. Для этого в меню File выбираем Open as Shared Library. В появившемся окне на локальном диске C:- Program files -Macromedia-Flash5-Tutorial-My Kite и открываем файл My Kite.

3.1. В появившейся библиотеке выбираем Bitmap, Background sky.

3.2. Перетащим изображение в наш ролик.

4. Меняем размер изображения:

4.1. Выберем Show all.

4.2. Вызовем панель Align (Ctrl+k). Выделяем To Stage.В опции - Match Size кликнем по Match Width и Match height, а также в опции Align -Align Left Edge и Align top Edge.

4.3. Затем снова выбираем Show all.

Преступим к созданию подвижной маски. Для этого необходимо выполнить следующие операции: 1)преобразовать этот фильм в эталон типа Movie Clip 2) Создать дубликат, присвоить тип - графический 3) отредактировать этот дубликат, заменив самолет залитым кругом и удалить фон 4) После чего смонтировать экземпляры из созданных эталонов новый фильм с подвижной маской.

5.Скопируем все кадры в новый эталон:

5.1. Выделяем все слои (с помощью клавиши Shift).

5.2. Щелкаем правой кнопкой мыши по выделенным слоям и выбираем Copy Frames.

6.Создадим новый эталон (Ctrl+F8). Дадим название - Самолет и выберем тип видеоклип.

6.1.На первом кадре клипа самолет, щелкнув правой кнопкой мыши, выбираем Paste Frames.

6.2.Дадим соответствующие названия нашим слоям (рис.1):

Рис. 1

7. Продублируем клип Самолет.

7.1. Открываем библиотеку, щелкаем правой кнопкой мыши по объекту эталона Самолет и выбираем Duplicate.

7.2. В появившемся окне Symbol Properties выбираем тип Graphic и даем название эталону Маска.

8.Теперь необходимо отредактировать эталон Маска. В библиотеке выбираем Маску и кликнем по ней двойным щелчком.

8.1. В редактирование Маски удаляем слой Фон. Щелкнув по кнопке Delete Layer.

8.2. На слое Самолет удаляем кадры (выделить кадры и нажать Shift+ F5).Затем первый кадр делаем ключевым (F6).

8.2.1. На панели инструментов выбираем овал и в опции Color щелкнем по No Color.

8.2.2. Рисуем окружность, удерживая Shift.

8.2.3. 40-й кадр делаем ключевым и перемещаем круг в конец траектории.

8.2.4. Выделяем всю дорожку и выбираем Create Motion Tween .

9. Перейдем в сцену 1 и вставим новую сцену для внесения новых изменений (Insert-Scene). Далее будем работать в появившейся Scene 2.

10.Откроем Библиотеку и перетащим самолет на сцену.

11.Добавим новый слой и перетащим маску.

12.Выровним Эталоны относительно центра сцены. В окне Align (для самолета) устанавливаем To Stage . Затем в опции Align выделяем горизонтальный и вертикальный центры.

Повторим это действие и для эталона Маска.

13. Слоям дадим соответствующие названия Самолет и маска.

14. Выделяем 40-е кадры на обоих слоях и делаем их ключевыми.

15. Откроем библиотеку и запустим редактирование Маска.

15.1.Выделим киноленту слоя самолет, и щелкнем правой кнопкой мыши, выберем Frame , установим бегунок до-100 в опции Easing.

16. Переходим на сцену 2.

16.1.Щелкнем правой кнопкой мыши по слою Маска и в выпадающем меню отметим MASK.

Готово. Запустите и проверьте, что получилось. (Ctrl+Alt+Enter).

Тема 5. Раскадровка формы и морфинг

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

Ход работы:

Фильм этого проекта называется: Flower.fla

В фильме три слоя:

Flower (Цветок);

Stem (Стебель);

Background (Фон).

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

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

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

Используя данные из таблицы 1, создайте цветовую палитру фильма. После задания каждого цвета на панели Mixer (Палитра) не забывайте давать команду Add Swatch (Добавить образец в каталог) из меню, расположенного в правом верхнем углу панели.

Бутон перед началом раскадровки формы

10-й кадр - середина раскадровки изменений формы

Распустившийся цветок на последнем кадре фильма

Слой фона

Выберите на панели Stroke (Контур) толщину линий контура равной 10. выберите бежевый цвет (цвет 1) для контура и коричневый (цвет 4) для заливки. Используя инструмент Rectangle (Прямоугольник), нарисуйте прямоугольник, закрывающий весь стол. Добавьте временный рабочей слой, выбрав рабочий слой, выбрав слой фона и щелкнув на кнопке Insert Layer (Вставить слой) внизу раздела слоев. В новом слое нарисуйте круг диаметром 338 (W=338, H=338). Оставьте значение 10 для толщины контура, возьмите сиреневый цвет (цвет 6) для контура и голубой (цвет 3) для заливки. Используя панель Align (Выравнивание), расположите круг в центре стола. Сначала выберите Edit - Select All (Правка - Выделить все) или нажмите Ctrl+A (Cmd+A), а затем дайте команду Edit - Cut (Правка - Вырезать) или нажмите Ctrl+X (Cmd+X). Перейдите на слой фона и выберите Edit - Paste in Place (Правка - Вставить на место) или восполь-зуйтесь горячими клавишами Shift+Ctrl+V (Shift+Cmd+V). Особенно важно то, что таким образом (вырезая и вставляя) легко рисовать поверх уже существующих изображений на слое фона. Как только вы вставите круг в слой фона, выделите рабочий слой и удалите его щелчком на кнопке с корзиной внизу раздела слоев. Заблокируйте слой фона.

Слой стебля

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

Слой цветка

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

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

2. Передвиньте головку на последний кадр, выделите его и клавишей F6 вставьте ключевой кадр.

3. один из способов обеспечить одинаковую форму для всех лепестков цветка - используя инструмент Pen (Перо), нарисовать один лепесток, а затем командами Copy (Копировать) размножить лепестки в нужном количестве (можно также воспользоваться перетаскиванием при нажатой клавише Alt (Option)). Потом с помощью панели Transform(Преобразование) поверните каждый лепесток в нужную позицию. Возьмите сиреневый цвет для лепестков и бежевый для серединки цветка. Цветок должен располагаться на кончике стебля, там же, где в 1-м кадре находится бутон.

4. Когда бутон и цветок будут закончены, щелкните на первом кадре, выделив его. Нажмите Ctrl+F (Cmd+F) для перехода на панель Frame (Кадр). Откройте список Tweening (Раскадровка) и выберите Shape (Форма). Появится стрелка раскадровки с зеленым фоном от первого до последнего кадра.

Тема 6. Создание анимационного спутника планеты

Цель занятия: научиться работать со слоями, использовать графику.

Создание эталона

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

- Выберите команду меню Insert * New Symbol (Вставить * Новый эталон). На экране появится диалог Create New Symbol (Создание эталона) (Рис.), в котором обычно достаточно только задать тип эталона и присвоить ему имя.

Диалог Create New Symbol (Создание эталона)

- В поле ввода Name (Имя) введите: Спутник.

Группа переключателей Behavior (Тип) позволяет определить тип создаваемого эталона:

Movie Clip (Клип), Button (Кнопка), Graphic (Графический). По умолчанию в этой группе установлен переключатель Button (Кнопка).

- Установите щелчком мыши переключатель Movie Clip (Клип).

- Закройте диалог Symbol Properties (Свойства эталона) щелчком мыши на кнопке ОК. Программа переключится в режим редактирования эталона и откроет соответствующее окно (Рис.).

На этот режим указывает появившийся в центре сцены крестик +, обозначающий точку привязки эталона, а также имя эталона - Спутник, появившееся в верхней части окна фильма, справа от названия сцены - Scene 1 (Сцена 1).

- Нарисуйте овал, нажав на кнопку [Oj - Oval Tool (О) (Овал) в секции Tools (Инструменты) панели инструментов. Цвет овала - градиентный, радиальный, черно-белый. Убедитесь, что контур отсутствует.

- Установите указатель мыши, который примет форму крестика + , несколько выше и правее центра сцены, обозначенного также крестиком.

- Нажмите и удерживайте клавишу Shift.

- Не отпуская клавишу Shift, нажмите и удерживайте левую кнопку мыши.

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

Отпустите левую кнопку мыши.

Отпустите клавишу Shift. Будет создан объект в форме круга с градиентной круговой черно-белой заливкой без контура (Рис.).

Рис. Круг с градиентной заливкой создан

- Выберите команду меню Window * Design Panels * Info (Окно * Панели конструирования * Информация). На экране появится панель Info (Информация) (Рис.).

- Убедитесь, что созданный объект по-прежнему выделен - покрыт точечным узором. Если это не так, щелкните на нем мышью.

- На панели Info (Информация) дважды щелкните мышью в поле ввода W (Ширина), Н (Высота).

- Введите с клавиатуры 30.

- Если значения в полях ввода X и Y отличаются от -15.0, то откорректируйте их так, чтобы они были равны -15.0, и завершите ввод значений нажатием клавиши [[Enter].

Положение выделенного объекта изменится. Теперь его центр точно совмещен с точкой привязки.

Создание эталона Спутник завершено, и он автоматически помещен в библиотеку (Library), в которой хранятся эталоны всех объектов, используемых в фильме.

Выберите команду меню File * Save (Файл * Сохранить). На экране появится диалог Save As (Сохранить как).

Диалог Save As (Сохранить как).

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

- Откройте папку, в которой вы хотите создать папку Flash.

- В поле ввода File name (Имя файла) двойным щелчком мыши выделите находящееся там имя Untitled-1 .fla и введите: Sputnik - такое имя мы присвоим файлу фильма.

Создаем графические элементы фильма

- Нажмите кнопку - Oval Tool (О) (Овал) в секции Tools (Инструменты) панели инструментов, чтобы включить этот инструмент.

- Укажите отсутствие цвета контура, щелкнув мышью на изображении карандаша кнопки - Stroke Color (Цвет контура), а затем - нажав кнопку - No Color (Не задан) в секции Colors (Цвета) панели инструментов.

- Заливку выберите коричневый цвет.

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

- Выберите команду меню Window * Design Panels * Info (Окно * Панели конструирования * Информация). На экране появится панель Info (Информация).

- В полях ввода W (Ширина) и Н (Высота) введите значения 275 и нажмите клавишу [[Enter]. Размер «планеты» изменится в соответствии с указанными значениями.

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

- Нажав кнопку [Of - Oval Tool (О) (Овал) в секции Tools (Инструменты) панели инструментов, снова выберите этот инструмент.

- Выберите синий цвет в открывающейся палитре Ц - Stroke Color (Цвет контура) секции Colors (Цвета) панели инструментов.

- Укажите отсутствие заливки, щелкнув мышью на значке ^ кнопки [& О j - Fill Color (Цвет заливки) и вслед за ней нажав кнопку - No Color (He задан) в секции Colors (Цвета) панели инструментов.

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

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

- Выберите команду меню Modify * Group (Модификация * Сгруппировать). С помощью инструмента Free Transform Tool (Q) (Произвольная трансформация) поверните контур.

- Выберите команду меню Modify * Ungroup (Модификация * Разгруппировать), затем удалите ненужную часть контура.

- Дважды щелкните мышью на имени слоя Layer 1. Это имя будет выделено темным цветом и появится мигающий текстовый курсор.

- Введите новое имя слоя - Планета - и нажмите клавишу [[Enter} или щелкните мышью где-нибудь на пустом месте в шкале времени. Введенное имя отобразится в названии слоя.

- Убедитесь, что включен инструмент [hj - Selection Tool (V) (Выделение). В противном случае нажмите его кнопку в секции Tools (Инструменты) панели инструментов.

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

-Выберите команду меню Edit * Cut (Правка * Вырезать).

Создадим новый слой.

- Нажмите кнопку Insert Layer (Вставить слой) в нижнем левом углу окна шкалы времени (Timeline). В левой части этого окна появится и будет выделен новый слой, которому по умолчанию присвоено имя Layer 2 (Рис.).

- Выберите команду меню Edit * Paste in Place (Правка * Вставить в то же место). Изображение эллипса будет вставлено из буфера обмена на новый слой Layer 2 и выделено.

Переименуем слой Layer 2, присвоив ему более выразительное имя - Орбита.

Движение по заданной траектории.

Создадим новый слой Спутник.

- Откройте окно библиотеки (Library) командой меню Window * Library (Окно *Библиотека).

Установите указатель мыши на значке или имени эталона Спутник в окне библиотеки (Library).

-Нажмите и удерживайте левую кнопку мыши.

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

- Отпустите левую кнопку мыши. Положение объекта будет закреплено, и он будет выделен голубой квадратной рамкой

Теперь для первого ключевого кадра слоя Спутник следует определить тип и параметры анимации. Это выполняется с помощью панели Properties (Свойства).

- В открывающемся списке Tween (Расчетная анимация) выберите пункт Motion (Движение). На панели Properties (Свойства) отобразятся элементы управления анимацией движения (Рис.).

-Сбросьте флажок Scale (Масштаб), чтобы пока не включать анимацию размеров.

- Установите флажок Orient to path (Ориентировать по траектории), чтобы заставить спутник двигаться по траектории, определенной на специальном ведущем слое.

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

- Установите флажок Snap (Привязка), чтобы автоматически фиксировать объект на траектории, если его положение определено недостаточно точно.

- Установите указатель мыши у правого края окна шкалы времени (Timeline) в строке слоя Спутник под меткой 62 шкалы нумерации кадров.

- Щелкните мышью в этом месте. В указанной позиции появится темный прямоугольник.

- Не отпуская клавишу shift, щелкните мышью в строке слоя Орбита, Спутник и Планета под меткой 62 шкалы нумерации кадров. В этом месте появится темный прямоугольник. Выберите команду меню Insert * Timeline * Keyframe. Щелкните мышью в окне шкалы времени (Timeline) на слое Спутник, чтобы выделить его. При этом на сцене будет выделено изображение спутника.

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

- Щелкните мышью на слое Орбита в окне шкалы времени (Timeline). Этот слой и все его кадры будут выделены. Одновременно будет выделен эллипс на сцене.

- Выберите команду меню Edit * Сору (Правка * Копировать). Выделенный объект будет скопирован в буфер обмена.

Создадим над слоем Спутник с анимацией новый ведущий слой.

- Щелкните мышью в окне шкалы времени (Timeline) на слое Спутник, чтобы выделить его.

- Нажмите кнопку Add Motion Guide (Добавить траекторию движения) в левой нижней части окна шкалы времени (Timeline). Над слоем Спутник будет вставлен новый ведущий слой, которому по умолчанию присвоено имя Guide: Спутник (Ведущий: Спутник) (Рис.).

Вставим изображение траектории из буфера обмена на ведущий слой Guide: Спутник.

- Щелкните мышью на слое Guide: Спутник в окне шкалы времени (Timeline), чтобы выделить его и снять выделение слоя Спутник.

- Выберите команду меню Edit * Paste in Place (Правка * Вставить в то же место). Изображение эллипса будет вставлено из буфера обмена на слой Guide: Спутник и выделено на сцене.

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

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

- Чтобы сделать проигрывание фильма циклически повторяющимся, то есть таким, каким оно обычно бывает при просмотре в проигрывателе или браузере, выберите команду меню Control * Loop Playback (Управление * Циклическое проигрывание).


6



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


Выберите специальность, которую Вы хотите получить:

Обучение проходит дистанционно на сайте проекта "Инфоурок".
По итогам обучения слушателям выдаются печатные дипломы установленного образца.

ПЕРЕЙТИ В КАТАЛОГ КУРСОВ

Автор
Дата добавления 10.11.2015
Раздел Информатика
Подраздел Другие методич. материалы
Просмотров323
Номер материала ДВ-140874
Получить свидетельство о публикации
Похожие материалы

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