Редактор движения в adobe flash cs6
Обновлено: 01.07.2024
Adobe Flash Professional - большая многофункциональная программа, сложная в изучении и применении.
Adobe, по своей неизменной привычке, мало заботится о том, чтобы упростить свои программы. Если другие программисты ради простоты отбрасывают все промежуточные варианты, то в Adobe не пропадает ничего. Все промежуточные варианты работы над программой будут включены в окончательный вариант в виде какой нибудь кнопочки, панели или строки в меню. Как результат - вес программ (в Мб) разрастается и программа становится переусложненной. Кроме того, многие инструменты полностью или частично дублируют друг друга.
Не стала исключением из этого правила и Adobe Flash Professional. В программе имеются три разных режима рисования, три разных режима создания мультипликации и много других запутывающих особенностей, которые способны отпугнуть от программы потенциальных пользователей.
Настройки программы
Программа Adobe Flash Professional настроена по умолчанию, но Вы можете при необходимости изменить эти настройки.
Highlight colors (Цвет подсветки) - Вы можете изменить цвета значения по умолчанию, используемые для отображенных ограничивающих прямоугольников вокруг рисунка объектов, групп или символов.
Или: в меню Файл (File) выберите Создать (New).
Откроется окно "Создать документ" (New Document).
На вкладке Общие выберите тип создаваемого файла Flash (ActionScript 2.0 или 3.0).
По умолчанию выбран язык ActionScript 2.0, но Вы можете выбрать и ActionScript 3.0. Применение ActionScript 3.0 позволяет использовать все функции программы последних версий (CS5 и CS6). Например, если Вы хотите при создании мультипликации применить 3D- вращение к объектам, то нужно выбирать ActionScript 3.0 (ActionScript 2.0 эту функцию не поддерживает).
ActionScript 3.0 также требует, чтобы у посетителей стояли последние версии проигрывателя Flash.
В последних версиях программы
1. Применение ActionScript 2.0 не предусмотрено.
2. Есть возможность создания анимации в формате HTML5.
В Инспекторе свойств определите размеры (ширину и высоту) кадров, настройте линейку, укажите частоту кадров, цвет фона и др.
При необходимости эти данные можно будет изменить, используя Панель Свойства - Подробнее .
На вкладке Создать по шаблону Вы можете выбрать шаблон, чтобы открыть его для редактирования.
Вы можете всегда изменить свойства своего проекта - в меню Модификация (Modify) выберите Документ (Document), или используйте комбинацию клавиш Ctrl+J (Windows) или Command+J (Mac OS).
В разделе Dimensions (Размеры) установить ширину и высоту Вашего кино в пикселях.
В разделе Ruler units устанавливаются единицы измерения линейки - сантиметры. мм, пиксели и др. Обычно единица измерения линеек - пиксели.
В разделе Background Color выбирается цвет фона мультипликации.
В разделе Frame rate устанавливается скорость - кадры в секунду. Обычно принимают скорость по умолчанию - 24 кадра в секунду.
Опция Auto-Save - установка периодичности автосохранения Вашей работы.
Опция Printer заставляет Ваш новый документ соответствовать формату бумаги Вашего принтера.
Сохранение документа
Ваш новый документ должен быть сохранен прежде, чем начать любую работу или добавить любое содержание.
По умолчанию, документы сохраняются в формате Flash CS6 - .fla
1 В меню Файл (File) выберите Сохранить (Save).
2 Выберите папку для сохранения проекта. дайте проекту свое название.
Всегда включайте расширение .fla в конце названия проекта.
Документы, созданные в Flash CS6, не будут открываться в Flash CS5 или более ранних версиях.
Документы, созданные во Flash CS5 и ранее, будут открываться во Flash CS6.
При установке на Ваш компьютер Adobe Flash Professional одновременно будет установлен и файловый менеджер Adobe Bridge , который можно использовать при работе с файлами.
В меню Файл (File) выберите Просмотр в Bridge или Перейти к программе Bridge (Browse in Bridge).
Выберите файл формата .fla в Adobe Bridge . При двойном щелчке по файлу он открывается в Adobe Flash.
Настройка интерфейса
При необходимости настройте рабочее пространство - Подробнее
Шаблоны
Adobe Flash включает множество типовых шаблонов.
В шаблонах заранее установлены размеры и версия ActionScript.
Выберите меню File > New и нажмите на вкладку Templates (Шаблоны).
Рассмотрите включенные flash-шаблоны.
Рисование
Adobe Flash Professional имеет встроенный графический редактор векторных изображений, которые используются при создании мультипликации.
В Adobe Flash существует несколько режимов рисования, работа в которых имеет свои отличия - см. Режимы рисования
Ознакомьтесь в набором инструментов для рисования, которыми располагает Adobe Flash - см. Панель инструментов .
Не представляет особого труда создать такие простые объекты, как прямоугольник (квадрат), эллипс (круг), линию.
Для создания более сложных объектов придется ознакомиться со всей функциональностью программы в области рисования - см. Рисование .
Для создания покадровой рисованной мультипликации Вам придется использовать графический планшет для рисования, т.к. без этого крайне трудно создать качественную мультипликацию.
О графических планшетах
Создание простой мультипликации
В Adobe Flash существует два основных способа создания мультипликации - покадровая мультипликация и мультипликация плавных изменений (tweens). В свою очередь мультипликация tweens имеет несколько разновидностей - подробнее .
При любом способе создания мультипликации Вам нужно изучить работу
Временой шкалы (Графика времени). Если Вы разберетесь с работой Временой шкалы - считайте, что половина дела по изучению программы сделана.
Особенно нужно обратить внимание на работу со слоями и на работу с кадрами .
Освоив все вышеперечисленное, Вы уже сможете создавать Flash-элементы (например - баннеры. слайды и пр.) для вставки на свои html-страницы.
Вы можете создать все элементы для своей мультипликации в Adobe Flash Professional. Или Вы можете импортировать элементы, созданные в Adobe Illustrator , Adobe Photoshop , Adobe After Effects и др. программах.
Другая половина успеха при освоении Adobe Flash Professional - изучить язык ActionScript 3.0. В этом случае Вы сможете использовать всю функциональность программы, в том числе создавать интерактивные Flash-сайты.
Как неполноценная альтернатива - использование отрывков кода, которые идут с программой (меню Окно (Windows) - Фрагменты кода ).
Данный обзор не содержит обучающих материалов по ActionScript, но такие материалы имеются в Интернете.
Управление Flash - мультипликацией
Если Вы хотите создавать что-то более сложное, чем простые анимированные баннеры или слайды, Вам потребуется:
а. Научиться создавать кнопки
б. Научиться использовать код ActionScript.
Кнопки (графические или текстовые) нужны, чтобы посетитель Вашего сайта мог управлять мультипликацией - см. Кнопки .
Анимация в Adobe Flash создается с использованием кода ActionScript. Более ранние версии программы использовали версию ActionScript 2.0, в последних версиях используется ActionScript 3.0. Эти версии имеют серьезные отличия и совместимы частично.
Вам не придется при создании flash-анимации вручную писать код, т.к. в Adobe Flash основная работа ведется в визуальном режиме. Однако в некоторых случаях требуется вставка кода ActionScript. При этом можно использовать отрывки кода, которые идут с программой, или писать код самостоятельно.
Код ActionScript используется, чтобы придать кнопкам навигации правильные действия - переход к определенному кадру мультипликации или к определенной странице сайта, для управления и синхронизации звука и изображения и для многого другого.
Для краткого знакомства с ActionScript см. ActionScript .
Создание flash - сайта
Вы можете быстро анонсировать свою мультипликацию, передвигая красный движок (playhead) взад и вперед на Шкале кадров (см. Временная шкала ).
Чтобы посмотреть, как мультпликация будет выглядеть в Интернете (т.е. со всеми вложенными мультипликациями), выберите меню Управление (Control) > Тестировать ролик (Test Movie) > в Flash Professional (in Flash Professional).
При этом созданная мультипликация просматривается во встроенном проигрывателе Flash (Flash Player).
Для тестирования Flash для мобильных телефонов используйте меню Управление (Control) > Тестировать ролик (Test Movie) > in Device Central .
Подробнее о предварительном просмотре
При публикации редактор создает файлы HTML, файл SWF и другие файлы, необходимые для нормальной работы Flash.
Для настроек публикации в меню Файл (File) выберите Параметры публикации (Publish Settings).
Для публикации в меню Файл (File) выберите Опубликовать .
Чтобы изменить линию или контур фигуры, перетащите любую точку на линии с помощью инструмента «Выделение». Указатель изменяется, показывая, какое изменение формы можно выполнить для линии или заливки.
Animate изменяет изгиб отрезка линии в соответствии с новым положением перемещенной точки. Если перемещенная точка находится в конце линии, линия станет короче или длиннее. Если перемещенная точка является точкой преломления, то отрезки линии, образующие угол, остаются прямыми, но удлиняются или укорачиваются.
Изменить форму закрашенных кистью областей обводки проще, если рассматривать их как контуры.
Если при изменении формы сложной линии возникают трудности, выполните сглаживание, чтобы удалить некоторые детали и упростить изменение формы. Упростить и повысить точность изменения формы также можно, повысив уровень увеличения.
Выберите инструмент «Выделение» .Перетаскивая любую точку, можно изменить форму сегмента.
Чтобы переместить линию и создать новую точку преломления, нажмите кнопку мыши, удерживая нажатой клавишу «Alt» (Windows) или «Option» (Macintosh).
При выпрямлении вносятся небольшие корректировки в существующие линии и кривые. Выпрямление не влияет на сегменты, которые уже являются прямыми.
Чтобы задать уровень автоматического смягчения и выпрямления, укажите параметры рисования.
Чтобы настроить Animate на распознавание фигур, используйте метод выпрямления. Если фигуры в форме овала, прямоугольника или треугольника нарисованы с отключенным параметром «Распознавать фигуры», то с помощью параметра «Выпрямление» можно получить геометрически идеальные фигуры. Соприкасающиеся фигуры, соединенные с другими элементами, не распознаются.
При сглаживании смягчаются кривые и уменьшаются неровности и другие отклонения от общего направления кривой. Также уменьшается число сегментов в кривой. Однако смягчение — это относительная операция, которая не влияет на прямые сегменты. Сглаживание особенно полезно, когда возникают трудности с изменением формы нескольких очень коротких отрезков кривой линии. Выбор и смягчение всех отрезков сокращает число отрезков, что позволяет получить более плавную кривую, изменить форму которой проще.
При повторном применении выпрямления или смягчения каждый отрезок становится еще более плавным или прямым, в зависимости от того, насколько кривым или прямым каждый отрезок был первоначально.
Чтобы сгладить кривизну каждого выделенного контура, выберите инструмент «Выделение» и щелкните модификатор «Смягчение» в разделе «Параметры» панели «Инструменты». Каждое нажатие кнопки модификатора «Смягчение» делает выделенную кривую более гладкой.
Чтобы ввести конкретные параметры для операции смягчения, выберите команду «Модификация» > «Фигура» > «Смягчить». В диалоговом окне «Смягчение» введите значения для параметров «Смягчить углы выше», «Смягчить углы ниже» и «Степень смягчения».
Чтобы внести небольшие модификации для выпрямления каждого выбранного контура заливки или кривой линии, выберите инструмент «Выделение» и нажмите модификатор «Выпрямление» в разделе «Параметры» панели «Инструменты».
Чтобы ввести конкретные параметры для операции выпрямления, выберите команду «Модификация» > «Фигура» > «Выпрямить». В диалоговом окне «Выпрямление» введите значение для параметра «Степень выпрямления».
Чтобы использовать распознавание фигур, выберите инструмент «Выделение» и нажмите модификатор «Выпрямление» или выберите меню «Модификация» > «Фигура» > «Выпрямление».
При оптимизации кривые смягчаются благодаря уточнению изогнутых линий и контуров заливки, что уменьшает число кривых, определяющих эти элементы. При оптимизации кривых также уменьшается размер документа Flash Professional (FLA-файл) и экспортируемого приложения Animate (SWF-файл). Оптимизацию можно повторно применять к одним и тем же элементам.
Motion Editor - Редактор Движения.
Редактор движения - специальная панель, которая отображает все доступные свойства Вашего плавного изменения движения визуально как линии на графике.
Редактор движения сочетает в себе одновременно некоторые функции Графика времени и Инспектора свойств , а также имеет некоторые собственные способности.
Редактор движения полезен, когда происходят изменения в нескольких слоях одновременно.
В новых версиях Flash Professional CC редактор движения не используется.
Редактор движения расположен на той же панели, что и График времени. Открыть редактор движения можно, или щелкнув по соответствующей вкладке выше Временной шкалы , или из меню Окно (Window) > Редактор движения (Motion Editor).
Высоту панели Редактора движения можно увеличить или уменьшить. Для большой и сложной мультипликации имеет смысл отсоединить панель Редактора движения от основного окна программы, увеличить размеры панели и расположить в удобном месте на экране компьютера.
На левой стороне Редактора Движения отображен список свойств наряду с их значениями и ослабляющимися опциями. На правой стороне - график времени в виде различных линий и кривых, показывающих, как эти свойства изменяются.
Например, ранее мы создали объект - шар красного цвета, который по заданному пути совершает движение (см. Мультипликация изменения пути движения ).
Щелкнем по шару в Монтажном кадре, щелкнем по вкладке Редактор движения выше Временной шкалы.
Открываетмя Редактор движения, в котором открыты все свойства нашего шара:
Здесь есть координаты объекта по осям X и Y, наклоны по осям, масштабы по осям, цветовые эффекты (в т.ч. установка прозрачности), фильтры и другое.
При этом свойства указаны как для начальной точки (начального ключевого кадра) плавного изменения, так и для конечной точки.
В редакторе времени можно устанавливать начальный и ключевой кадр для любого объекта, можно изменять положение ключевых кадров, можно добавлять ключевые кадры и другое.
Используйте также правый щелчок и контекстное меню при работе в Редакторе движения.
Например, Вы хотите изменить прозрачность объекта (шара) по мере того, как он двигается слева направо и сверху вниз.
Выбираем начальный ключевой кадр.
Выбираем раздел Цветовой эффект щелкаем по значку +, выбираем Альфа-канал. Устанавливаем величину прозрачности 100% (полная прозрачность)
Затем выбираем конечный ключевой кадр. Для него устанавливаем прозрачность 0%.
После этих настроек наш шар в начальном ключевом пункте будет невидим (прозрачный), по мере движения слева направо будет все ярче и в конечном ключевом кадре шар - без применения прозрачности.
Чтобы добавить ключевой кадр (keyframes), щелкните правой кнопкой мыши (Windows) или Ctrl+click (Mac OS) в любом пункте вдоль линии. В ключевом кадре Вы можете корректировать значения.
Аналогично можно изменить и все другие свойства объекта.
Чтобы видеть результаты, можно просто передвигать по шкале влево-вправо движок
Как видим, Редактор движения во многом дублирует другие инструменты Adobe Flash - Инспектора свойств и различные панели настроек.
В редакторе движения есть такое понятие как ослабление . Ослабление означает неравномерное движение - объект может медленно начать движение, затем двигаться равномерно и в конце резко замедляется.
На графике в Редакторе движения такое движение будет выглядеть не прямой линий, а линией ломаной или плавной кривой.
На рисунке ниже - пример графика изменения прозрачности по плавной кривой.
Может быть создано движение с двумя ключевыми кадрами, между клторыми объект перемещается взад-вперед, и другое.
Редактор Движения отображает шкалу кадров и красный движок (playhead) наверху точно так же, как График времени. Поэтому Вы можете анонсировать Ваши изменения без необходимости переключиться назад на панель Графика времени (Timeline).
Рисование, Дизайн и Разработка игр
Главная » Анимация движения в Adobe Flash по направляющей (guide)
Анимация движения в Adobe Flash по направляющей (guide)
В предыдущих уроках мы рассматривали рисование кнопки и простую анимацию движения окружности. В этом уроке рассмотрим, что такое анимация движения объекта по заданной направляющей траектории (guide). Создадим условный объект и нарисуем для него путь, по которому он будет проходить.
Создания нового документа ActionScript 3.0
Должно получиться два таких слоя:
Размещаем объект для создания анимации движения
Тоже самое нужно проделать для пятидесятого кадра, возьмите объект и разместите его на правом крае линии.
В итоге мы должны получить два таких слоя:
Запускаем анимацию движения объекта
Выберите пятидесятый кадр на слое, где расположен объект, и также как в первом кадре немного поверните его.
Чтобы посмотреть, что получилось, нажмите ctrl+enter.
Читайте также: