Для того чтобы в редакторе adobe flash cs4 добавить к движущемуся автомобилю
Motion Editor - Редактор Движения.
Редактор движения - специальная панель, которая отображает все доступные свойства Вашего плавного изменения движения визуально как линии на графике.
Редактор движения сочетает в себе одновременно некоторые функции Графика времени и Инспектора свойств , а также имеет некоторые собственные способности.
Редактор движения полезен, когда происходят изменения в нескольких слоях одновременно.
В новых версиях Flash Professional CC редактор движения не используется.
Редактор движения расположен на той же панели, что и График времени. Открыть редактор движения можно, или щелкнув по соответствующей вкладке выше Временной шкалы , или из меню Окно (Window) > Редактор движения (Motion Editor).
Высоту панели Редактора движения можно увеличить или уменьшить. Для большой и сложной мультипликации имеет смысл отсоединить панель Редактора движения от основного окна программы, увеличить размеры панели и расположить в удобном месте на экране компьютера.
На левой стороне Редактора Движения отображен список свойств наряду с их значениями и ослабляющимися опциями. На правой стороне - график времени в виде различных линий и кривых, показывающих, как эти свойства изменяются.
Например, ранее мы создали объект - шар красного цвета, который по заданному пути совершает движение (см. Мультипликация изменения пути движения ).
Щелкнем по шару в Монтажном кадре, щелкнем по вкладке Редактор движения выше Временной шкалы.
Открываетмя Редактор движения, в котором открыты все свойства нашего шара:
Здесь есть координаты объекта по осям X и Y, наклоны по осям, масштабы по осям, цветовые эффекты (в т.ч. установка прозрачности), фильтры и другое.
При этом свойства указаны как для начальной точки (начального ключевого кадра) плавного изменения, так и для конечной точки.
В редакторе времени можно устанавливать начальный и ключевой кадр для любого объекта, можно изменять положение ключевых кадров, можно добавлять ключевые кадры и другое.
Используйте также правый щелчок и контекстное меню при работе в Редакторе движения.
Например, Вы хотите изменить прозрачность объекта (шара) по мере того, как он двигается слева направо и сверху вниз.
Выбираем начальный ключевой кадр.
Выбираем раздел Цветовой эффект щелкаем по значку +, выбираем Альфа-канал. Устанавливаем величину прозрачности 100% (полная прозрачность)
Затем выбираем конечный ключевой кадр. Для него устанавливаем прозрачность 0%.
После этих настроек наш шар в начальном ключевом пункте будет невидим (прозрачный), по мере движения слева направо будет все ярче и в конечном ключевом кадре шар - без применения прозрачности.
Чтобы добавить ключевой кадр (keyframes), щелкните правой кнопкой мыши (Windows) или Ctrl+click (Mac OS) в любом пункте вдоль линии. В ключевом кадре Вы можете корректировать значения.
Аналогично можно изменить и все другие свойства объекта.
Чтобы видеть результаты, можно просто передвигать по шкале влево-вправо движок
Как видим, Редактор движения во многом дублирует другие инструменты Adobe Flash - Инспектора свойств и различные панели настроек.
В редакторе движения есть такое понятие как ослабление . Ослабление означает неравномерное движение - объект может медленно начать движение, затем двигаться равномерно и в конце резко замедляется.
На графике в Редакторе движения такое движение будет выглядеть не прямой линий, а линией ломаной или плавной кривой.
На рисунке ниже - пример графика изменения прозрачности по плавной кривой.
Может быть создано движение с двумя ключевыми кадрами, между клторыми объект перемещается взад-вперед, и другое.
Редактор Движения отображает шкалу кадров и красный движок (playhead) наверху точно так же, как График времени. Поэтому Вы можете анонсировать Ваши изменения без необходимости переключиться назад на панель Графика времени (Timeline).
 (1)  
 (2)  
 (3)  
 (4)  
 (5)  
Номер 2
Ответ:
 (1)  
 (2)  
 (3)  
 (4)  
 (5)  
Номер 3
Ответ:
Упражнение 9: Номер 1
Ответ:
Номер 2
Ответ:
Номер 3
Ответ:
Упражнение 10: Номер 1
Ответ:
Номер 2
Ответ:
 (1) звук будет привязан к определенным событиям фильма и будет воспроизводиться только с привязкой к временно диаграмме 
 (2) звук будет привязан к определенным событиям фильма и будет воспроизводиться с момента наступления этого события без привязки к временной диаграмме 
 (5) звук будет воспроизводиться только тогда, когда пользователь включит музыкальную дорожку 
Номер 3
Ответ:
Упражнение 11: Номер 1
Ответ:
 (2) это распечатка всех кадров готового фильма, причем для каждого кадра используется отдельный лист 
 (3) это текстовая версия всего фильма, которая включает в себя все диалоги, описание сцен и т.д 
Номер 2
Ответ:
Номер 3
Ответ:
Упражнение 12: Номер 1
Ответ:
 (1) вставленный между двумя другими кадр, резко отличающийся между ними по содержанию, но соответствующий общему сюжету 
Номер 2
Ответ:
Номер 3
Ответ:
 (5) при монтаже собираются кадры с самой различной освещенностью, но с совпадающими цветами 
Мультипликация вращения
Для создания вращения объектов Adobe Flash имеет функцию Tweening.
В одной позиции объекта программа не может создать вращение более одного оборота.
Пример:
1. Используем временную шкалу (меню Window > Timeline).
2. Можно создать фоновый слой (а можно и не создавать)
3. Создадим новый слой выше фонового, назовем его "Солнце".
4. Вставим на сцену стилизованное изображение солнца. Такое векторное изображение можно создать в Adobe Flash, используя инструменты рисования (см. Рисование ).
В данном примере изображение солнца импортировано (см. Импорт ) в формате файла .jpg.
5. Преобразуем изображение солнца в графический символ.
6. Создадим анимацию движения - выделим солнце на сцене и в контекстном меню выберем Создать анимацию движения (Create Motion Tween).
7. На Временной шкале автоматически будут созданы 24 кадра анимации. При необходимости настройте продолжительность анимации, перетаскивая последний кадр вправо или влево (см. Работа с кадрами ). Например, установим продолжительность в 30 кадров.
8. Переключимся на вкладку Инспектора свойств .
На слое "Солнце" щелкаем по любому кадру.
В Инспекторе свойств используйте раздел вращения (Rotation).
В строке "Rotate" делаем настройки:
Выберите количество оборотов (Rotation count). Если установлено "1", то за 30 кадров наше солнце сделает 1 полный оборот, если 2 - то два оборота и т.д. Фактически эта настройка определяет скорость вращения.
Вы также можете добавить градусы поворота, например к полному обороту (360 градусов) добавить еще 30 градусов.
Примечания:
1. Функции добавления дополнительных градусов вращения нет в ранних версиях программы.
2.если Вы добавите дополнительные градусы поворота, то при демонстрации зацикленной анимации могут получиться нестыковки. Для таких круглых объектов, как наше солнце, лучше не добавлять дополнительных градусов поворота.
Направление вращения определяется опцией "Direction":
CW - по часовой стрелке
CCW - против часовой стрелки.
Ручное создание вращения объекта
Вы можете создать покадровую анимацию вращающегося объекта. Для этого на Временной шкале создаются ключевые кадры в каждом кадре, а на сцене объект вручную поворачивается на определенный (небольшой) угол.
Поворот (вращение) объекта производится при наведении курсора на угол выделенного объекта. Когда курсор преобразуется в значок вращения (), можно повернуть объект вокруг оси вращения.
Объект не нужно преобразовывать в символ.
Можно сместить центр вращения объекта.
При создании мультипликации движения можно определить движение объекта по определенной траектории - по прямой линии, по ломанной кривой, состоящей из отрезков прямой линии, и по гладкой кривой линии.
Анимация движения по прямой
Создадим движение самолета по прямой линии.
В монтажном кадре вставьте изображение самолета на левой стороне сцены. Векторное изображение самолета можно создать в Adobe Flash (см. Рисование ) или импортировать изображение, созданное на стороне (в формате .jpg с прозрачным фоном).
Выделите самолет на сцене. В контекстном меню самолета выбираем Преобразовать в символ (Convert to Sumbol). Выбираем графический тип символа.
В контекстном меню изображения выбираем Создать анимацию движения (Create Motion Tween). Программа автоматически создает 24 кадра для плавного изменения.
Перемещаем изображение на правую сторону сцены.
Можно настроить продолжительность анимации и другое - см. Работа с кадрами .
Анимация движения самолета по прямой создана, ее можно просмотреть, щелкнув по клавише Enter .
Из этого примера можно сделать такие выводы:
• длина любого нового участка изменения (tween span), который автоматически создается програмой, по умолчанию соответствует установленной скорости мультипликации. Если скорость мультипликации выбрана 24 кадра в сек., то будет по умолчанию создан участок изменения в 24 кадра (1 сек мультипликации). Если выбрана скорость 30 кадров в сек. - участок изменения по умолчанию составит 30 кадров.
• Чтобы программа смогла создать плавное изменение, вставленный на сцену объект должен быть преобразован в символ. При этом объект может быть любым - созданный в Adobe Flash векторный рисунок, текст, импортированное растровое изображение и пр. Если Вы пытаетесь создать плавное изменение на несимволе, программа попросит Вас преобразовывать элемент в символ ( подробнее о символах ).
• Только к одному символу может быть примененно плавное изменение (tweened) за один раз. Если Вы попытаетесь применить изменение к уровню с несколькими объектами, программа запросит Вас преобразовать графические символы в единственный символ.
• Плавное изменение можно применить для изменения размеров/масштабирования, изменения цвета и применения фильтров.
Примечание: плавное изменение для эффектов фильтров применимо только к символам клипов и кнопок, не применимо к символам графики.
Примечания:
1. При создании классической анимации движения порядок действий иной - см. Создание классической анимации движения .
2. Создание движения объектов при покадровой мультипликации - см. Покадровая мультипликация
3. В нашем примере самолет двигался в пределах сцены. Но начальное положение самолета (или другого объекта) может быть вне сцены, при этом самолет может выскакивать "из-за кулис" (справа, слева, сверху. снизу). Точно также он может исчезать со сцены "за кулисами". В принципе, и начальное и конечное положение объекта может быть вне сцены, т.е. объект выскакивает "из-за кулис", показывает на сцене свои трюки и снова исчезает "за кулисами".
Анимации движения по кривой
Есть несколько способов создать движение объекта по кривой:
А. При создании покадровой анимации Вы можете создать движение объекта по любой траектории
Б. Вы можете пребразовать прямой путь, который создается при создании анимации движения (Create Motion Tween) в кривую линию.
В. Вы можете создать собственную кривую линию как траекторию движения объекта
Преобразование прямого пути
При использовании функции Анимации движения ("Motion Tween") на сцене траектория движения объекта отмечена прямой линией с маркерами.
Вы можете скорректировать путь движения объекта по сцене несколькими способами.
Самые простые способы корректировки пути движения:
Потянув за маркеры, можно создать криволинейную траекторию движения, как показано на рисунке слева.
Примечание: при создании классической анимации движения такой функции нет, но есть другие способы - см. Анимация движения по кривой при создании классической анимации движения
Способ 2
Вставьте на сцену красный квадрат
Создайте анимацию движения квадрата (см. Создание анимации движения)
В результате на сцене будет фигурировать наш квадрат и его путь движения (в виде линии с маркерами).
Вы можете скорректировать путь движения, воздействия не на сам путь, а на объект (так, как показано на анимации ниже):
Использование этого метода простое: щелкайте по выбранному кадру на Шкале времени (у нас это 10, 20 и 30-й кадры) и соответственно перемещайте объект по сцене (не затрагивая при этом кривую пути) Программа автоматически создает ключевые кадры в выбранных кадрах.
Создание собственного пути движения
1. Вставляем на сцену рисунок самолета.
2. Преобразуем рисунок самолета в графический символ
3. Создаем новый слой под названием "Путь", на котором карандашом () рисуем траекторию движения самолета. Линия пути не должна быть замкнутой.
4. При необходимости сглаживаем линию пути, используя инструмент "Smooth" () внизу Панели инструментов .
5. Выделяем созданный путь и копируем его в буфер обмена. После этого сам путь можно удалить.
6. Возвращаемся в слой самолета. Выделяем самолет на сцене, в контекстном меню выбираем " Создать анимацию движения " (Create Motion Tween).
7. Выделяем самолет на сцене, в меню Правка (Edit) выбираем "Вставить" или "Вставить по месту" (Paste in Place).
К изображению самолета добавляется изображение пути движения.
8. Для просмотра ставим красный движок на 1-й кадр, щелкаем по клавише Enter .
Редактирование пути движения
Вы можете преобразовать путь движения так же, как и другого графического объекта.
Выберите инструмент свободного преобразования (Free Transform) на панели инструментов и щелкните по пути движения.
Маркеры преобразования появляются вокруг пути движения.
Можно изменять масштаб или повернуть путь движения. Можно создать кривизну пути, используя инструменты выбора и инструмент Преобразовать узловую точку (Convert Anchor Point) - этот инструмент скрыт под инструментом Перо (Pen) .
Нажимают на отправную точку и перемещают маркер начала выделения, который управляет искривлением пути.
3 Для коррекции пути выберите инструмент спецвыделения (Subselection) на панели инструментов.
4 Щелкните и перетащите маркер, чтобы редактировать кривую пути.
Примечание: путем движения можно также непосредственно управлять с инструментом выделения ().
Выберите инструмент выделения () и переместите его близко к пути движения. Значок кривой появляется рядом с Вашим курсором, указывающий, что Вы можете редактировать путь. Щелкните и перетащите путь движения, чтобы изменить искривление.
Можно выделить объект, щелкнуть по нему правой кнопкой мыши, в меню выбрать Создать анимацию движения . После этого передвигать движок по Временной шкале и синхронно передвигать объект по созданной кривой.
Примечание:
Если Вы своей дрожжащей рукой нарисовали слишком корявый путь и одновременно для движения по этому пути отвели слишком мало кадров, то программа не сможет выполнить задачу и повторить все изгибы пути.
В этом случае появится объявление:
"The curve must be simplified to fit the number of frames available in the current motion tween. Please choose one of the following methods"
Или: "Кривая должна быть упрощена, чтобы соответствовать числу кадров, доступных в текущей анимации движения. Пожалуйста выберите один из следующих методов. " и предлагается два варианта, первый из которых - упростить путь.
Чтобы объект двигался от конечной точки к начальной, в контекстном меню объекта выберите Траектория движения ( Motion Path ) - Обратная траектория ( Reverse Path).
Ориентация объекта при движении
Иногда важна ориентация объекта, двигающегося вдоль пути.
В нашем примере самолет должен двигаться не только по своей траектории, но и одновременно поворачиваться, чтобы его нос был по направлению движения.
1 Щелкните по слою плавного изменения движения (motion tween) на Временной шкале (Графике времени). В нашем примере это слой "самолет".
2. Выделите путь движения, используя инструмент выделения ()
3. Правильно установите объект относительно пути движения в 1-и и последнем кадрах анимации.
4. В Инспекторе свойств выберите Ориентацию по траектории (Orient to path) в опции пути.
Редактор вставляет крайние кадры для вращения вдоль плавного изменения движения так, чтобы нос самолета ориентировался по пути движения.
Программа автоматически добавляет ключевые кадры, разворачивая самолет по траектории.
Временная шкала будет выглядеть так:
Отметьте: Чтобы опция ориентации работала правильно, самолет в начальной позиции должен быть установлен правильно, т.е. его нос должен быть направлен вдоль пути движения.
Для этого используйте инструмент свободного преобразования , поворачивайте самолет, чтобы установить его правильно.
• Удостоверьтесь, что и старт и окончание движения объекта зафиксированы непосредственно на созданном пути.
• Удостоверьтесь, что Ваш путь движения не объект рисунка, группа или символ. Путь движения создается только в режиме рисования "Merged Drawing".
• Избегайте использовать при создании пути необычные штриховые стили, такие как черточки, точки и пр. Это приводит к непредсказуемому поведению объекта при движении по такому пути.
Замена объекта при движении
Вы можете заменить объект, который движется по определенному пути, например вместо самолета использовать летчика.
Для этого нужно выделить самолет в Монтажном кадре. Затем перетащить новое изображение из Библиотеки и отпустить на старое изображение.
Редактор спроситт Вас, хотите ли Вы заменить существующий объект новым объектом. Нажмите ОК.
Или:
Выберите объект, котрый Вы хотите заменить в Монтажном кадре.
В Инспекторе свойств щелкните кнопкой Swap (Замена). Появится диалоговое окно для выбора нового изображения.
Выберите новый символ и нажмите OK .
Панель определения движения
Если Ваш проект неоднократно совершает идентичные плавные изменения движения, можно использовать Панель определения движения (Motion Presets), которая открывается из меню Окно (Window ) - Определение движения (Motion Presets).
Подробнее о панели Motion Presets
Как сделать движение объекта по траектории в Adobe Animate (Flash)
Сначала продемонстрирую работу этого приема на простом примере.
Создайте новый документ размером 600 на 200 пикселей. Назовите его First_animate. Цвет фона голубой или любой другой. Кто не помнит — сначала нужно создать новый документ Action Script 3.0. (Файл — Создать Ctrl + N).А затем на панели свойств (Ctrl + F3) задать размер рабочего окна и цвет фона.
Первый слой переименуйте в «Объект». Создайте на нем овал (O). Не снимая выделения с объекта. нажмите на клавишу F8 и назначьте его символом. Назовите object1.
Создайте второй слой над слоем «Объект», назовите его «Траектория». На этом слое нарисуйте карандашом траекторию движения шара.
Щелкните правой клавишей мыши по слою «Траектория» и выберите пункт «Направляющая». Слева появится значок с молоточком. Теперь потяните слой «Объект» под слой «Траектория», так вы свяжите их друг с другом.
Теперь вернемся к рабочей области. Поместите наш объект в начало траектории. Создайте ключевые кадры для слоя «Объект» и слоя «Траектория» на 30 кадре. Поместите шар на конец траектории. (В демонстрационном варианте включен каркасный вид слоя «Объект»).
Теперь щелкните правой клавишей мыши по первому кадру слоя «Объект» и выберите пункт «Создать классическую анимацию движения». После этого можно тестировать нашу анимацию (ctrl + Enter).
Пример с воздушным змеем в облаках
Теперь, давайте посмотрим, что можно сделать с этими знаниями. Приведу еще один простенький пример. Предположим. что нам нужно нарисовать воздушного змея. который летит по небу.
Создадим новый документ размером 600 на 200 px. Зальем его градиентом от синего к желтому. Для этого создадим в самом начале слой, который назовем «Фон«, нарисуем прямоугольник во весь размер рабочей области (то есть 600 на 200 пикселей) и зальем его градиентом. Как работать с градиентом, я уже писала в статье «Работа с градиентом в Adobe Flash».
Нажмите «Вставка — Создать символ (ctrl + F8)». Задайте имя kite. Нарисуйте воздушного змея. Это сделать нетрудно, он похож на ромб.
Чтобы наш воздушный змей выглядел реалистично. Давайте зададим его движение еще в самом символе kite. Это будет покачивание вверх вниз змея и развивающиеся ленты. Покачивание сделаем за счет анимации движения , развивающиеся ленты за счет анимации формы . Сначала займемся лентами. Их анимация будет похожа на контурную анимацию формы (ленты кстати говоря нарисованы инструментом Кисть и подходят для данной манипуляции), о которой я писала в статье «Контурная анимация в Adobe Flash».
Теперь создайте новый символ (ctrl + F8), назовите его kite_move. Поместите в центре него символ kite из библиотеки (F11). И задайте движение плавное вверх — вниз символу kite.
Вот что у нас получилось после размещения символа kite_move на главной сцене.
Ну вот, теперь пришло время задать нашему змею траекторию. Вспомним все, что я писала и вперед. Я создала вот такую направляющую.
На моментах подъема линии я буду увеличивать змея, а на моментах спада — уменьшать. Это добавит реалистичности сцене.
Надеюсь я подробно объяснила как создать движение по направляющей в Adobe Flash. Это поможет сделать вашу анимацию более реалистичной. Не расстраивайтесь, что в статье нет исходников. В своей следующей статье я научу вас, как вытащить любые исходники из swf файлов расположенных на сайтах.
Компания Adobe объявила, что с конца 2020 года она прекращает поддержку популярного и любимого многими Flash Player.
Adobe и дальше продолжит работать над популярным графическим редактором. только теперь он будет полностью ориентирован на интернет технологии и поддержку технологии Html 5, которой, как раз и уступает пальму первенства технология Flash.
Подписывайтесь на обновления блога «Дизайн в жизни»
по e-mail или социальных сетях
и мы обязательно опубликуем для вас еще больше полезных бесплатных уроков!
Читайте также: