Как сделать летающую бабочку.
В этом уроке вы узнаете, как сделать анимацию бабочки. Бабочка будет анимированная, и с вида сверху (как-будто вы сверху на нее смотрите) и с боку как-будто она просто пархает и садится на понравившейся ей цветок.
Для этого урока я использовал программу Macromedia Flash 8.
Для начала вам нужно подготовить изображение бабочки. Изображение бабочки, следует поместить на прозрачный фон и сделать из него 2 отдельных изображения (одно из крыльев и тельце). Можете скачать картинки, использованные в данном уроке.
1 Часть: Вид сверху
1 Создаем новый документ с нужными параметрами.
2 Импортируем в библиотеку программы свои изображения бабочки (крыло и тельце).
3 Создаем 3 слоя и называем их: (1 Telo, 2 Left Wing и 3 Right Wing).
4 Находясь на слое (Telo) перетаскиваем из библиотеки на сцену программы изображение тельца бабочки.
5 Переходим на слой (Left Wing), перетаскиваем из библиотеки изображение крыла и помещаем его вплотную слева от тельца бабочки (для более точного расположения крыла относительно тельца можно увеличить сцену в несколько раз).
6 Так как крылья у бабочки симметричны, сделаем из левого крыла и правое, для этого пока крыло выбранно, нажимаем комбинацию кнопок "Ctrl+C", чтобы копировать его, затем переходим на слой (Right Wing) и нажимаем комбинацию кнопок "Ctrl+Shift+V", чтобы вставить скопированное изображение крыла, это будет второе крыло, потом идем в меню "Modify-->Transform-->Flip Horizontal", чтобы отразить его по горизонтали и помещаем его вплотную справа от тельца бабочки.
8 Создаем ключевые кадры на 10 и 20 кадре слоя (Right Wing), Кликаем правой кнопкой мыши между 1-10 и 10-20 кадрами этого слоя и из выпадающего списка выбираем "Create Motion Tween", (Создать анимацию движения).
9 Переходим на 1 кадр слоя (Right Wing), выбираем инструмент "Free Transform Tool (Q)", зажимаем центр изображения и перемещаем его влево (смещаем центр), тоже самое делаем на 10 и 20 кадрах.
10 Переходим на 10 кадр и все темже инструментом "Free Transform Tool (Q)" сужаем наше изображение крыла в 4 раза, так как мы сместили центр к левому краю оно будет сужаться только справа, а левый край останется неподвижным (ВАЖНО! Сначала сделайте анимацию между ключевыми кадрами, а уже потом сужайте крыло).
Аналогично делаем и с левым крылом, только центр изображения смещаем вправо.
11 В завершении анимации бабочки создаем пустой ключевой кадр на 20 кадре слоя (Telo), чтобы тельце бабочки все время отображалось.
Можно протестировать, что у нас получилось "Control-->Test Movie".
2 Часть: Вид сбоку
Теперь сделаем анимацию бабочки вида сбоку (на одной плоскости).
1 Создаем новый документ.
2 Как только вы создали новый документ идем в меню "Insert-->New Symbol...", чтобы создать новый клип, называем его "Babochka_mc", жмем "Ok" и вы сразу попадаете в созданный мувик.
3 Импортируем в библиотеку программы все тоже изображение крыла, а тельце бабочки теперь необходимо вида сбоку.
4 Находясь в созданном мувике перетаскиваем из библиотеки на сцену крыло бабочки.
7 Кликаем инструментом "Selection Tool (V)" по крылу, чтобы выбрать его, затем нажмите комбинацию кнопок "Ctrl+C", чтобы скопировать его, затем создайте новый слой и находясь на нем нажмите комбинацию кнопок "Ctrl+Shift+V", чтобы вставить скопированное изображение.
8 Создаем новый слой, называем его (Telo), помещаем его между двумя слоями (между крыльями) и находясь на этом слое помещаем на сцену программы изображение тельца. Подгоняем это тельце под наши крылья инструментом "Free Transform Tool (Q)".
9 Выбираем слой (Layer 1), можно переименовать его в (Right Wing), чтобы было видно, что это правое крыло и находясь на этом слое создаем ключевые кадры на 10 и 20 кадре, нажимая кнопку "F6" и сразу создаем анимацию движения между этими кадрами.
10 Находясь на 1 кадре выбираем инструмент "Free Transform Tool (Q)" и смещаем центр изображения крыла в сторону тельца бабочки, как мы это делали в 1 флэшке 9 пункте, так проделываем еще на 10 и 20 кадре. После этого переходим на 10 кадр и темже инструментом сужаем наше крыло в 4 раза и немного растягиваем (смещаем вправо, а левое крыло влево) суженное крыло, это придаст объемности взмахам крыльев.
Аналогично поступаем и со вторым, левым крылом.
11 Возвращаемся на главную сцену, нажимая на ссылку.
12 Находясь на главной сцене перетаскиваем из библиотеки мувик "Babochka_mc", в котором мы работали и инструментом "Free Transform Tool(Q)" поворачиваем нашу бабочку так, как нам надо.
Можно протестировать, что у нас получилось "Control-->Test Movie".
Часть 3: Анимация пархания / полета бабочки
Теперь, когда мы научились анимировать бабочку, если наблюдать за ней с любого ракурса, можно приступить к анимации полета бабочки.
1 Создаем новый документ с нужными параметрами.
2 Импортируем в библиотеку программы все необходимые изображения, в том числе и изображение фона.
3 Создаем 3 слоя: ( Fon, Butterfly_1 и Butterfly_2).
4 Выбираем слой (Fon) и помещаем по центру сцены изображение, которое будет служить фоном, переходим на 150 кадр и создаем пустой кадр, нажимая кнопку "F5" для того, чтобы фон был на всех кадрах.
5 Переходим на слой (Butterfly_1) и создаем новый клип, для этого идем в меню "Insert-->New Symbol...", называем клип "Butterfly_1_mc" и нажимаем кнопку "Ok", одновременно попадая внутрь этого клипа.
6 Находясь внутри созданного клипа создаем и анимируем первую бабочку (вид сверху).
7 Возвращаемся на главную сцену.
8 Переходим на слой (Butterfly_2) и создаем новый клип, для этого идем в меню "Insert-->New Symbol...", называем клип "Butterfly_2_mc" и нажимаем кнопку "Ok", одновременно попадая внутрь этого клипа.
9 Находясь внутри созданного клипа создаем и анимируем вторую бабочку (вид сбоку).
10 Возвращаемся на главную сцену.
11 Переходим на слой (Butterfly_1) и перетаскиваем из библиотеки на сцену мувик первой бабочки "Butterfly_1_mc".
12 Теперь создаем направляющую для полета первой бабочки, для этого кликаем правой кнопкой мыши по слою (Butterfly_1) и из выпадающего списка выбираем "Add Motion Guide" и образуется новый слой (Guide:Butterfly_1).
13 Находясь на слое (Guide:Butterfly_1), выбираем инструмент "Pen Tool (P)", создаем им первую точку (где должна начинаться анимация полета бабочки), затем ставим вторую точку и образуется прямая линия, так ставим точки несколько раз, создавая ломанную линию, когда все точки расставлены и линии между ними проложены выбираем наш мувик бабочки и перемещаем его по центру первой точки начала движения, чтобы привязать его к направляющей.
14 Далее перемещаем мувик бабочки по направляющей линии (если необходимо поворачиваем бабочку инструментом "Free Transform Tool (Q)"), создавая при этом каждый раз новые ключевые кадры на слое (Butterfly_1) при перемещении. Главное, чтобы полет начинался и заканчивался за пределами сцены, это будет смотреться более интересно. Создаем ключевые кадры на 45, 50, 80, 100, 101, 120, 121, 125 и 150 кадре. В промежутках с 45-50, 80-100 и 120-125 кадра можно не создавать анимацию, на этих участках бабочка остается на месте.
15 Находясь на 101 и 120 кадре выбираем нашу бабочку и удаляем ее, нажимая кнопку "Delete", на этом промежутке будет виден второй мувик, где бабочка будет садиться на цветок. Когда все кадры расставлены, бабочка перемещена в конечный пункт (полет бабочки завершен) создаем анимацию движения между 1-45, 50-80 и 125-150.
16 Переходим на слой (Butterfly_2), на 101 кадр и создаем на нем ключевой кадр, нажимая на кнопку "F6". Находясь на этом кадре перетаскиваем из библиотеки на сцену второй мувик бабочки (Butterfly_2_mc) и выставляем его на то место сцены, где мы удалили первый мувик бабочки.
17 Создаем ключевой кадр на 105 кадре тогоже слоя и находясь на нем перемещаем бабочку чуть ниже (как будто она садится на цветок). Создаем 115 ключевой кадр и оставляем бабочку в нижнем положении (бабочка сидит на цветке). Создаем ключевой кадр на 120 кадре и перемещаем нашу бабочку наверх (в исходное положение). После этого создаем аниммацию движения между 100-105 и 115-120 кадрами этого слоя.
Все, мы завершили анимацию полета / пархания бабочки, теперь можно протестировать, что у нас получилось "Control-->Test Movie".
Похожие уроки:
