Уроки

Новости

Статьи

Анимация

Анимация вращения блестящих предметов III

Анимация вращения блестящих предметов II

Анимация вращения блестящих предметов I

Создание анкерного колеса.

1 международный благотворительный фестиваль мультфильмов

2015-01

2014-12

2013-08

2013-03

2012-12

2012-11

2012-09

м/с "Пилот"

Аниматор.ру

От мульта

flash-animated.com

Клуб аниматоров рунета

Уроков: 19
Статей: 4
Комментариев: 68
Человек на сайте: 3

 

Яндекс цитирования   Jokerom Stock Images

Иллюзия вращения

Автор: Игорь Романов

Дата: 2012-03-07

     Предположим, что у Вас возникла необходимость создать анимацию быстро вращающегося вокруг своей оси симметричного предмета. Это может быть какой-то маховик или крутящийся волчок, или отскочившее колесо врезавшегося в дерево автомобиля, которое катится прямо на зрителя… Ситуации могут быть разными. Но при этом Вам не придется создавать многочисленные компоновки с изменяющимися ракурсами вращающегося объекта. Посмотрите предлагаемый вариант и давайте разберемся на примере юлы, как обойтись малой кровью для достижения такого результата.



* Чтобы корректно отображались все всплывающие окна, на которые ссылаются такие кнопки,
пожалуйста, закрывайте после просмотра уже открытые окна,
иначе они будут перекрываться Вашим браузером с просматриваемой темой!


Шаг 1. Создайте новый документ шириной 500 px. и высотой 350 px.. Частоту смены кадров, как обычно, установите 25 fps., документ сохраните в удобной для Вас директории на локальном диске под названием "Юла". В первом слое создайте фоновый прямоугольник с линейным градиентом. С помощью инструмента трансформации градиента Gradient Transform Tool (F) разверните его на 90°, а маркеры и оттенки настройте примерно так, как показано на эскизе ниже. Если хотите, можете выбрать другие оттенки градиента или вообще оставить фоновую заливку гладкой, а то и вовсе обойтись без фона. Если фон все-таки решили сделать, назовите его "Фон" и заблокируйте.


Шаг 2. В новом слое над слоем "Фон" с помощью инструментов построения векторных форм создайте половинку будущей юлы приблизительно такую же, как показано на эскизе ниже (1). При построении формы используйте волосяную линию обводки. Получившийся объект преобразуйте в символ (F8) типа Graphic (Графика) и сохраните его в рабочей библиотеке под названием "Юла". После этого перейдите на уровень редактирования подобъектов символа "Юла", дважды кликнув над ним левой кнопкой мыши, выделите и сгруппируйте полученную ранее форму, если вы не создавали ее в режиме Object Drawing (2). Создайте копию этой формы (Ctrl+C => Ctrl+Shift+V) и отразите по горизонтали контурную копию половинки юлы. Расположите и совместите оба сгруппированных объекта относительно вертикальной оси, чтобы они образовали симметричную фигуру аналогично показанной на эскизе ниже (3). Объекты разгруппируйте и получившуюся фигуру с замкнутым контуром залейте каким-нибудь темным оттенком #330000 (4).


Шаг 3. Продолжая работу на уровне редактирования подобъектов, добавьте еще один слой над слоем с темным силуэтом и сформируйте в нем отдельные объекты - блики, которые подчеркнут объем нашей юлы. Приблизительные формы этих бликов показаны на эскизе ниже. Блики не должны иметь контуров, а заливать их лучше двухцветным градиентом с одинаковыми цветами маркеров, но непрозрачность одного из этих маркеров должна быть минимальной (Alpha=0). Значение альфа канала для маркеров с более плотным насыщением цвета варьируются от 35% до 85% в зависимости от расположения блика. Рефлексы — блики, обращенные к низу, темнее и имеют более прозрачные маркеры.


Шаг 4. Как только закончите настройку градиентов и юла приобретет желаемый объем, возвращайтесь к основной сцене, где можно попробовать зкрутить ее. При выделенном в сцене символьном объекте "Юла" нажмите F8 и, в появившемся диалоговом окне Convert to Symbol (Преобразовать в символ) выберите тип Movie clip (Видеоклип), точку регистрации установите в нижнее центральное положение, символ назовите "Юла_м". И теперь уже внутри этого символьного объекта мы создадим анимацию вращения юлы. Как я и обещал в самом начале, этот анимационный трек состоит всего из двух кадров временной диаграммы. Выделите первый ключевой кадр и, нажав клавишу F6, создайте еще один такой же ключевой кадр. Во втором ключевом кадре с помощью инструмента свободной трансформации Free Transform Tool (Q) разверните выделенный символьный объект "Юла" относительно точки регистрации по часовой стрелке (можно и по минутной) буквально на 1°. Дополнительно, чтобы сделать вращение еще более явным, тем же инструментом придайте крошечный скос не больше, чем на пару пикселей по горизонтальной оси.
     Если прямо сейчас запустить тестовую анимацию (Ctrl + Enter), то Вы сможете, скорей всего, испытать гордость за создание персонального "вечного двигателя". Ваш результат на данный момент не должен сильно отличается от моего, в противном случае еще раз внимательно проверьте, где была допущена неточность и добейтесь максимальной схожести.






Шаг 5. Так как наша юла не является каким-то там НЛО, висящим в пространстве, предлагаю поместить ее на некую условную поверхность, добавив в сцену тень. Над слоем с фоном создайте новый слой. В нем с помощью инструмента для построения окружностей Oval Tool (O) сформируйте горизонтально вытянутый эллипс такой же ширины, как и ширина "юбки" юлы. Контур удалите, а градиент радиальной заливки настройте так, как показано на эскизе ниже.
     В том варианте видеоклипа, который продемонстрирован в начале урока, тень была анимирована, а для этого, как Вы могли уже догадаться, ее тоже следует преобразовать в графический символ и анимировать отдельно. Также можно вращающийся объект и его тень пустить по какой-то траектории, назначив эту траекторию в управляющем слое Moution Guide.



Подведение итогов:

   В этом уроке мы освоили, практически, самый простой способ создания иллюзии вращения вокруг своей оси симметричных объектов. Такое вращение можно и замедлять, если между двумя ключевыми кадрами, которые задействованы в анимации вращения объекта, вставить небольшую последовательность кадров с анимцией типа Motion Tween (Анимация движения). Надеюсь, Вам пригодится и этот опыт, чтобы "раскрутить" нечто похожее на тарелочку, маховик или колесо.


   Если у Вас возникнут какие-либо затруднения в процессе выполнения этого урока, можете задавать свои вопросы непосредственно в комментариях к этой теме. Желающие поделиться своими результатами, направляйте свои анимационные миниатюры на admin@flashcinema.ru




Данный урок подготовлен для Вас командой сайта www.flashcinema.ru
Правила перепечатки материалов сайта

Просмотров: 8202

Ваша оценка: 1 2 3 4 5


Пожалуйста, оставьте свой комментарий.
Спасибо!


Введите результат вычислений:

Поисковый запрос не должен
быть менее 4-х символов!