Что такое Macromedia Flash? Можно не долго думая придти к ответу 'Это программа для создания флеш-анимации, или, проще говоря - мультяшек!' конечно ответ в какой то степени верный, но это малая доля из всех возможностей этой замечательной программы) основное ее достоинство перед остальными ПО данной отрасли в том, что делать в ней можно не только "Мультики', но и игры, да-да, те самые игры которые мы играем в интернете с помощью своего браузера. Однако в этой статье я буду как можно подробней описывать способы создания своей анимации, т.к. делать игры - больше относится к программированию с которым я и без того не очень дружу... Ну... не будем о грустном)) Давайте начнем обучение ;)
Итак, начинать мы будем с простого, а именно рассмотрим способы анимации. Мне известны 2 способа: Покадровка (aka Frame-by-Frame (с англ. Кадр-за-Кадром)) и Автоматизированный способ анимации объектов (Tweening (или "перетекание")). Способ первый понятен уже из названия - каждый кадр нужно прорисовывать вручную, многие сталкиваясь с этим вопросом представляют себе как это сложно рисовать одно и тоже лишь с мельчайшими изменениями в деталях, одни думают что таким способом может заниматься только человек не имеющий личной жизни дабы убить время рисуют и рисуют получая минимум от результата за максимум потраченного времени, другие просто сдаются и пытаются осилить другие ПО дабы найти легкое решение в этом плане, однако люди знакомые с таким способом анимирования знают как им пользоваться чтобы получить максимальный результат, ведь они пользуются и вторым способом - Tweening. Автоматизированный способ анимирования может использоваться как основной, однако все зависит и от сложности исполнения вашего проекта.
Рассмотрим на примере:
Покадровая анимация:
----------------------------------потрачено 10 минут Автоматизированная:
----------------------------------потрачено 6 минут
Думаю вы уже заметили разницу в качестве и времени.
Конечно в примере покадровки я мог создать ровный квадрат и постепенно кадр за кадром передвигать его, но так бы особой разницы вы не заметили =)
Теперь давайте рассмотрим глубже эти оба примера а именно:
-Рабочее пространство;
-Рассмотрим инструментарий используемый в этих примерах;
-Рассмотрим Технику анимирования.
Приступим:
Рабочее пространство Macromedia Flash 8:
Рабочее пространство Флеша я поделил на 8 пунктов, это:
1. Панель управления проектом;
2. Инструментарий;
3. Палитра;
4. Библиотека объектов;
5. Сцены;
6. Редактируемое окно;
7. Панель управления объектами;
8. Временная шкала (для простолюдинов - Таймлайн (англ. Timeline)).
Думаю про вышеперечисленные пункты обсуждать подробнее бессмысленно т.к. это займет уйма времени как для меня так и для вас, легче изучать только то, что мы используем в проекте на данный момент.
Рассмотрим способ анимирования - FrameByFrame:
Все что я использовал в "покадровой анимации" это:
- Пункт 2: Кисть (Brush) для рисования;
- Пункт 6 где я рисовал кадр за кадром;
- Пункт 8 -его мы рассмотрим подробнее:
Когда я закончил рисовать 1-й кадр, я создал новый фрейм (англ. Farme - Кадр). Такое можно проделать двумя способами: Щелкнуть в нужное место на временной шкале Правой Кнопкой Мыши (ПКМ) и выбрать "Insert Keyframe" или просто щелкнуть на клавишу [F7] при этом создастся новый ключевой кадр:
более действий при создании покадровки я не использовал.
Советы:
-Чтобы быстро просмотреть результат я использую комбинацию клавиш [Ctrl]+[Enter] (В панели управления: Control=>Test Movie)
-Чтобы видеть предыдущие кадры включаем функцию «луковой кожуры» (Onion Skin) в нижней части панели Таймлайна:
Рассмотрим Следующий способ анимирования - Tweening:
Все что я использовал при создания второго ролика:
В этот раз при создании анимации я преобразовал Квадрат и Пулю в объекты/символы используя клавишу [F8] (выделить преобразуемый объект, щелкнув ПКМ выбрать "Convert to Symbol...") и назвал их своими именами:
Q. Зачем я это сделал?
A. Затем, что в этом способе существует 2 типа анимации - Shape Tween (анимация формы) и Motion Tween (анимация движения/размера)
В случае с квадратом мы используем анимацию движения т.к. от начала к концу анимации он движется слева на право. Motion Tween отличается от Shape тем, что работает только с символами, т.е. с объектами не изменяющими свою форму.
"Но ведь в твоей анимации квадрат меняет свою форму не прекращая движения?"-думаю, спросите вы и правильно сделаете, ведь в этом вся фишка превращения объекта в символ а именно Motion Tween можно использовать совместно с Shape Tween для этого нужно зайти в редактируемый объект щелкнув дважды по нему Левой Кнопкой Мыши (ЛКМ) и уже потом изменять форму.... что то мы слишком далеко зашли на словах, переходим к действиям, точнее - к просмотру скриншотов xD
Шаг первый - Motion Tween:
(Рекомендую использовать для рисования инструменты Pencil Tool и/или Line Tool т.к. с ними проще редактировать формы, к примеру, нарисуйте линию затем удерживая [Ctrl]+[ЛКМ] вытяните середину этой линии, так же можно добавлять углы и так же их вытягивать - комбинация [Ctrl]+[Alt]+[ЛКМ])
Кадр первый - начальный: Создаем объект (нарисуем и преобразуем в символ), скопируем этот кадр (создаем копию фрейма на временной шкале - кнопка [F6]) и перетащим его со второго на 10-й кадр, вернемся в первому ключевому кадру, щелкнув по нему ПКМ выберем "Create Motion Tween", появится стрелочка тянущаяся между 1-м и 10-м фреймами:
Примечание: Если у вас вместо стрелочки обрывистая линия, значит что-то не так с первым или конечным кадром.
Теперь, чтобы заставить объект двигаться, вернемся к 10-му фрейму и переместим его в любое другое место в границах белого листа. Если все сделано правильно, то объект будет двигаться согласно конечному пути. (Быстрый просмотр - [ctrl]+[enter])
Закончили с движением, начнем редактирование формы.
Шаг второй - Shape Tween:
Заходим в символ (дважды щелкнув по нему). Теперь взгляните на временную шкалу - она пуста, лишь единственный ключевой кадр присутствует там (ваш нарисованный объект). Для создания анимации формы копируем тот самый кадр щелкнув на 10-й слот и нажав [F6]. Теперь снова вернувшись на 1-й фрейм смотрим ниже на панель "Properties" (пункт 7), выберите тип Tween: Shape, после этого вы заметите как появится стрелочка на таймлайне между 1-м и 10-м кадрами, единственное отличие этой стрелочки от Motion Tween в цвете:
Итак мы получили возможность "оживить" объект, все что остается - щелкнуть по 10-му кадру и немного изменить его форму.
Примечание: Нельзя рисовать сложные объекты в одном слое, к примеру, лицо человека с моргающими глазами - это может привести к искажению формы всего лица:
Уж лучше анимировать глаза покадрово:
Ну и рот тоже :)))
Вот и все) Базовые знания по анимации я изложил.
От себя:Конечно автоматизированные действия в мультфильме упрощают задачу аниматора но, ИМХО, покадровое рисование смотрится намного "живее" что-ли).
----------------------------------------на создание ролика ушло примерно полтора часа, все было сделано кадр за кадром включая "перевертыш пола" =)
Надеюсь мой урок кому-то чему-то научит или уже научил) По вопросам или благодарностям обращайтесь в ЛС или по почте SlayerDUDE@list.ru. Всем спасибо и творческих успехов! ;)