Лабораторная работа №5
Тема: «Приемы анимации в программе Flash»
Задание1 Анимация формы.
Создаем новый файл (File, New)
С помощью инструмента Text Tool создаем произвольную надпись, меняем цвет заливки, размеры, тип шрифта и т.д. (меню Text).
Можно менять параметры текста в окне Text Options(Window, Panels, Text Options).
Основное отличие Flash от остальных графических редакторов при работе с текстом, заключается в том, что есть два разных состояния текста. Текст сам по себе, т.е. просто текстовый блок, всегда доступный для редактирования, работы с языком сценариев (ActionScript) и имеющий ограниченные возможности для визуального оформления - изменение размера, цвета и наклона. И второе состояние текста, в котором по сути дела мы имеем отношение не с самим текстом, а с его графическим представлением - "разбитый текст".
Выделим созданный текст с помощью инструмента Arrow(чёрная стрелка).
Разобъем текст Modify / Break Apart [Ctrl+B].
Зададим на таймелане пустой ключевой кадр, например 60 (см. рис.)
Для этого выделим 60 кадр, меню Inseart, Blank KeyFrame (F7).
Создадим другую произвольную надпись и разобьем ее.
Щелкнем правой кнопкой на первом кадре таймелана. Проверим активизировано ли окно Frame (Panels, Frame). Найдем на нем вкладку Frame, В поле Tweening выберем Shape (превращение), зададим параметр Blend - Distributive (плавно) или Angular (жестко). При этом первые 60 кадров должны окрасится в зеленоватый цвет.
Просмотрим получившийся ролик (Control, Test movie).
Чтобы зафиксировать на экране последнее слово, добавим в 90-м кадре еще один пустой управляющий кадр (F7). Снова посмотрим получившийся ролик.
При необходимости зададим высоту и ширину ролика (Modify, Movie).
Преобразуем Flash-ролик в HTML-документ. Задаем нужные установки (File, Publish Setting, вкладка HTML, при необходимости меняем параметры) и непосредственно преобразуем ().
Для просмотра HTML-документа выбрать File, Publish Preview, HTML.
Задания для самостоятельной работы
Создайте ролик по превращению слова «INTERNET» (шрифт Arial, размер 12, красный цвет, курсив) в слово «ИНТЕРНЕТ» (шрифт Courier New Cyr, размер 32, синий цвет, полужирный шрифт).
Создайте ролик по превращению треугольника в овал.
Создайте ролик по превращению одного графического файла в другой. Графические файлы можно импортировать из папки PICTURES
«Клиновый лист» Движение по заданному пути.
Создать новый документ.
На шкале «времени» Слой1 переименовать в «Лист».
Создать новый графический символ.
В режиме редактирования символа нарисуем клиновый лист.
Перейти на Сцену1 и перетащить из библиотеки новый символ с изображением клинового листа. Библиотека загружается через меню «Окно».
Определить продолжительность анимации – 3 секунды – это значит при скорость смены кадров 12 fpt надо выбрать 36 кадр и вставить в него «ключевой кадр».
Создаем специальный слой для направляющих при помощи расположенной внизу временной шкалы кнопки Add Motion Guide
На направляющем слое выделите 1 кадр и нарисуйте траекторию движения клинового листа с помощью инструмента Карандаш в сглаженном режиме. Чтобы полет листа казался более естественным, начните и закончите её за пределами видимой области.
Теперь необходимо закрепить клиновый лист на этой траектории. Для этого на первом кадре захватываем клиновый лист и перемещаем к началу направляющей. Чтобы лист прикрепился его центр (он обозначается белым кружком см. рис. Выше) должен расположиться точно в первой точки линии.
На 36-кадре аналогичным образом прикрепляем клиновый лист к концу направляющей линии.
Создаем анимацию. Выделяем первый кадр в слое «Лист» и выбираем в палитре «свойства» меню «Tween» (последовательность) команду «Motion» (движение).
Проверьте полученный результат нажав Ctrl+Enter
Улучшаем анимацию
Задание 2 Покадровая анимация
Задания для самостоятельной работы
Создайте анимированный ролик с управляющими кнопками (Play, Stop). Сценарий анимации разработайте самостоятельно. Это может быть демонстрация процесса решения геометрической задачи на построение (деление отрезка пополам, деление угла пополам, построение перпендикуляра к диаметру окружности из точки вне окружности с помощью одной линейки, построение сечения многогранника плоскостью, проходящей через три заданные точки и т.п.). Это может быть демонстрация физических, астрономических, биологических процессов и явлений (движение тела, брошенного под углом к горизонту, капиллярные явления, демонстрация диффузии и хаотического движения молекул и частиц, строение Солнечной системы, строение атома и т.п.)
Рассмотрим подробно сюжеты, предложенные как примеры в задании.
На голубом фоне неба — ветка с почками, появляется солнце, из почек появляются листики.
Фон надо изменить на голубой.
Первый (самый нижний) слой — "солнце". Первый ключевой кадр: "солнце" на рабочем столе справа снизу. Последний ключевой кадр (например, 20-й): "солнце" на монтажном столе в верхнем правом углу, размер его больше. Далее до 60-го кадра — дублируется ключевой кадр промежуточными.
Второй слой — "ветка". Изображение не анимируется, поэтому — только первый ключевой кадр и промежуточные длительностью 60 кадров.
Третий (и последующие слои) — "почки-листочки". Первый ключевой кадр на (например) 20-м кадре, последний — на 60-м. В первом ключевом кадре "почка" в форме маленького листочка темно-зеленого цвета, в последнем — тот же объект, увеличенный с помощью трансформации и с изменением цвета. И — анимация формы.
Чтобы добавить "еще один листок на ветку", повторяем действия в новом слое. Или можно скопировать кадры предыдущего слоя, вставить их на новый слой и отредактировать расположение "почки" и "листочка".
Рис. 2. Расположение слоев и ключевых кадров для данной анимации
Снеговик, из-за горизонта всходит солнце, снеговик тает.
Расположение слоев снизу вверх: солнце, "земля" (тот самый горизонт, из-за которого всходит солнце), снеговик.
Скрытое вторым слоем солнце окрашено в красный цвет. В последнем ключевом кадре оно ярко-желтое. Создается имитация восхода.
Для выполнения второй части задания:
импортируйте в библиотеку два растровых изображения — пейзажа;
в первый ключевой кадр поместите первый пейзаж, вытащив его из библиотеки;
выполните его трассировку. Параметры трассировки подбирайте опытным путем;
в последний ключевой кадр анимации поместите второй пейзаж, выполните трассировку;
задайте между ключевыми кадрами анимацию формы;
после тестирования возможно внесение изменений: заново выполнить трассировку, если результат не удовлетворил, добавить промежуточные кадры в начало и конец анимации для того, чтобы глаз успел "охватить" пейзаж до преобразования и после него.
Рис. 3. Расположение кадров для второй части задания