Здравствуйте, гость ( Вход | Регистрация )

Свернуть

Новости

Форум Лучшее из галереи Уроки и статьи
07.12.2015 Выставочный зал: кошарик - персональная выставка
31.08.2015 Интересные ссылки для рисовальщиков
21.01.2015 Выставочный зал 2: Игрушки Олеси Гавриленко

27.12.2014 Выставочный зал: кошарик - персональная выставка
17.11.2014 Дуэль "Рыбки" - победитель Лисичка
05.11.2014 Конкурс иллюстраций "Снежная королева", до 31 января
30.10.2014 Дуэль "Рыбки" до 16 ноября
14.07.2014 Мастер-класс Мини-мишка в технике фелтинга
26.05.2013 Ау! Мы ищем таланты! – приглашаем модераторов!
«Фееричное боке»
tn_gallery_3_3_25828.jpg
«Фееричное боке»
© Valkyrie
06.01.2016 Виртуальный Музей: Русский живописец Василий Дмитриевич Поленов
28.12.2015 Виртуальный Музей: Нидерландский живописец Квентин Массейс
16.12.2015 Виртуальный Музей: Итальянский живописец Франче́ско Айец
17.11.2015 Виртуальный Музей: Луи Анкетен (Louis Anquetin)
11.11.2015 Виртуальный Музей: Русский живописец Алексей Иванович Корзухин
Файловый архив
06.09.2013 Прочее: Файлы к уроку "Чайная церемония"
05.09.2013 Журнал Art Tower: ArtTower Magazine #8
16.05.2013 Adobe Photoshop: Кисти: Reid Southen brush
16.05.2013 Adobe Photoshop: Кисти: Goro Fujita brush
16.05.2013 Adobe Photoshop: Кисти: Кисти для рисования в Photoshop
Блоги Новости в цифровом мире и мире дизайна
02.12.2014 Дама с каменьями: Вести с крыши 2
08.11.2014 Timenews: Вассерман: прежняя модель мировой экономики исчерпала себя
06.11.2014 Дама с каменьями: Приятные вести с крыши))) от Гаргула)
02.11.2014 Spell: Книги Дж. Кэмерон
22.10.2014 Vjaz: от ФУ до МА
25.11.2015 Комментарий от Foxx в Costa Rica Adventure Divers, Логотип для компании и рисунок на майку (maria_mer)
18.11.2015 Комментарий от maria_mer в Spellforce - майка, для фанов игры (maria_mer)
18.11.2015 Комментарий от maria_mer в Белая книга. Целитель - любительский прект (maria_mer)
09.04.2015 Комментарий от Romana в Книги Дж. Кэмерон (Spell)
08.04.2015 Комментарий от Romana в Я решил вернуться... (Элбирет)
16.03.2015 ФОТОФОРУМ-2015
01.01.2015 ARQUTE.com и ArtTalk.ru закрываются
19.01.2017 Конкурс дизайна логотипов
26.12.2016 ру/Ководство: О творческом развитии
14.10.2016 ру/Ководство: Разнообразие

 
Добавить ответ в эту темуОткрыть тему
> Из пушки по ... Часть 2, Урок по непрограммной флеш анимации
V
flashcinema
сообщение 24.01.2012 - 12:37
Сообщение #1


Постоялец
**


Группа: Жители
Сообщений: 78
Регистрация: 15.01.2012
Из: Россия, Москва
Пользователь №: 19009



Симпатии:  9  


Часть 2


Шаг 1. Продолжаем "дышать" и переходим на слой "Ствол 2", где создадим еще одно коротенькое расширение ствола. Выделите и преобразуйте 88 и 91 кадры в ключевые кадры (F6). В рабочем окне сцены, в ключевом кадре 88, слегка растяните ствол по горизонтали и уменьшите по высоте пропорционально тому, что показано на эскизе ниже. На 88 ключевой кадр назначьте анимацию типа Motion Tween (для Flash CS 3) и Classic Tween (для Flash CS 4/ CS 5). Выделите 92 кадр и стащите его на слой ниже (там образуется новый ключевой кадр с символьным объектом). В верхнем же слое "Ствол 2" 92 кадр преобразуйте в пустой ключевой кадр (F7).

Прикрепленное изображение

Шаг 2. Пришло время несколько удлинить последовательность кадров всех имеющихся слоев до 150-го кадра. Этого времени хватит для сокрушительного залпа, отката пушки и перехода ее в состояние покоя (выделите 150 кадр временной диаграммы всех слоев и нажмите F5).
    Вновь возвращаемся на нижний слой "Ствол" в 92 ключевой кадр. На панели свойств, для выделенного в сцене ствола пушки измените цифровое значение в окошке First: с 2 на 3. Преобразуйте 102 кадр в ключевой кадр и разверните символьный объект против часовой стрелки примерно на 15°. Условная ось ствола при этом может немного опуститься относительно углубления на лафете. Скорректируйте положение символьного объекта "Ствол" по вертикали. В ключевом кадре 92 растяните ствол пушки по горизонтали и уменьшите по высоте так, чтобы его форма стала максимально похожа на форму этого символьного объекта в 91 ключевом кадре слоя "Ствол 2". На 92 ключевой кадр назначьте анимацию типа Motion Tween (для Flash CS 3) и Classic Tween (для Flash CS 4/ CS 5). После чего откройте окно настройки кривой скорости Custom Ease In/Ease Out и задайте постепенное замедление движения к 102 ключевому кадру.

Прикрепленное изображение



Шаг 3. Следующее действие самое простое, но необходимое по законам жанра. Это – статика. В нашем случае совсем короткая, но дающая противнику, прочувствовать в полной мере всю ужасающую раздутость и неотвратимость залпа нашего орудия. Выделите 105 кадр временной диаграммы в слое "Ствол" и преобразуйте его в пустой ключевой кадр (F7). После этого последовательность кадров двух слоев, отведенных под анимацию ствола пушки, должна выглядеть так же, как показано на эскизе ниже.

Прикрепленное изображение


Шаг 4. Чтобы не потеряться в пылу атаки, обозначьте ориентиры положения лафета и колеса пушки. Установите основную горизонтальную направляющую под заднюю опору лафета и дополнительно вертикальную направляющую по центру оси колеса. А дальше должно произойти то, что и сама пушка от себя явно не ожидает. Энергия заряда оказалась настолько мощной, что в первое мгновение залпа, пушка вздыбилась, выталкивая тяжелое ядро. (Воробьям сразу стало не до смеха).
Преобразуйте 105 кадр временной диаграммы в слоях "Колесо", "Лафет", "Ствол 2", "Дым", "Пламя", "Ядро" и "Тень" в ключевые кадры и поднимите пушку на дыбы (насколько высоко решите сами, ориентируясь на эскиз ниже). С помощью инструмента свободной трансформации Free Transform Tool (Q) выполните вращение против часовой стрелки символьного объекта "Лафет" относительно левой оконечности задней опоры. Объект "Тень" наоборот слегка разверните по часовой стрелке относительно левого верхнего угла габаритного контейнера. Копию ключевого кадра 92 в слое "Ствол 2" поместите в 105 пустой ключевой кадр. Сам объект "Ствол" также поднимите до нужной высоты, сохраняя его горизонтальное положение. На панели свойств для выделенного в сцене ствола пушки измените цифровое значение в окошке First: с 3 на 4. Символьные объекты "Дым" (если таковой уже имеется), "Пламя" и "Ядро", впервые появившиеся в нашей сцене в 105 ключевом кадре, расположите в сцене так же, как показано на эскизе ниже.

Прикрепленное изображение


Шаг 5. С этого момента начинается самая сложная процедура в работе над нашей сценой. Сразу несколько объектов пришло в движение и каждый из них имеет свои физические свойства, а некоторые еще и взаимодействуют друг с другом. Но давайте хладнокровно и последовательно решим все задачки. Первым делом избавимся от всего, что вылетело из пушки, так как нахождение этих предметов в клипе самое непродолжительное и быстротечное.
Переходим на слой "Ядро" где 109 кадр преобразуем в ключевой кадр (F6). Сам же символьный объект "Ядро" в этом кадре горизонтально перемещаем за пределы рабочего окна сцены. На 105 ключевой кадр слоя "Ядро" назначаем анимацию типа Motion Tween (для Flash CS 3) и Classic Tween (для Flash CsS 4/ CS 5). Разумеется, чем дальше пушка от края сцены, за который должно вылететь ядро, тем больше времени понадобится ядру для прохождения этого расстояния.

Прикрепленное изображение


Шаг 6. У пламени продолжительность жизни тоже невелика и оно исчезает практически одновременно с ядром, но не достигая края сцены. Преобразуйте 109 кадр в слое "Пламя" в ключевой кадр (F6). Символьный объект в рабочем окне сцены переместите вправо примерно на 2/3 всего расстояния от этого объекта в 105 ключевом кадре до правого края окна сцены. С помощью инструмента свободной трансформации Free Transform Tool (Q) в 109 ключевом кадре немного уменьшите этот объект по горизонтали и растяните симметрично по вертикали. В группе Color уровень непрозрачности Alpha понизьте до 10%. Настройки фильтра Blur (Размытие) измените Х = 45, Y = 15. На 105 ключевой кадр назначьте анимацию типа Motion Tween (для Flash CS 3) и Classic Tween (для Flash CS 4/ CS 5). 110 кадр преобразуйте в пустой ключевой кадр (F7), а слой "Дым" вообще пока сделаем невидимым и переведем в разряд Guide (Направляющий).

Прикрепленное изображение


Шаг 7. Теперь давайте попытаемся представить, в каком положении окажется наше орудие через несколько мгновений, а конкретно в том же 109 кадре. Колесо, лафет и тень вновь вернутся в привычное положение, но из-за сильной отдачи будут смещены влево, приблизительно на пол радиуса колеса. В слоях "Колесо", "Лафет" и "Тень" выделите 104 кадры временной диаграммы и поместите их копии в 109 кадры соответствующих слоев. Затем все эти одновременно выделенные в сцене объекты переместите влево не меньше, чем на пол радиуса колеса относительно вертикальной направляющей линии.
В слое "Ствол" создайте пустой ключевой кадр и поместите туда копию любого кадра из начала временной диаграммы этого слоя (цифровое значение в окне First: для графического символа "Ствол" – 1). Ось ствола, как и в предыдущих ключевых кадрах, должна находиться в соответствующем углублении на лафете. С помощью инструмента свободной трансформации Free Transform Tool (Q) в рабочем пространстве сцены объект "Ствол" разверните по часовой стрелке примерно на 30°.

Прикрепленное изображение


Шаг 8. Теперь, когда мы выяснили, как пушка будет выглядеть после приземления, надо организовать переход от момента залпа к данному положению. На эскизе выше зеленовато-голубым контуром изображен ствол пушки, застывший в верхнем слое "Ствол 2". Как и в предыдущих переходах между слоями, нам надо подогнать размер и форму символьного объекта в верхнем слое к состоянию этого же объекта в нижнем слое "Ствол". Преобразуйте 109 кадр в слое "Ствол 2" в ключевой (F6) и с помощью инструмента свободной трансформации Free Transform Tool (Q) придайте размер и положение символьному объекту, находящемуся в этом слое, максимально приближенные к параметрам объекта в нижнем слое.

Прикрепленное изображение


Шаг 9. Вернитесь в 105 ключевой кадр слоя "Ствол 2" и назначьте на него анимацию движения типа Motion Tween (для Flash CsS 3) и Classic Tween (для Flash CS 4/ CS 5). Преобразуйте 108 кадр в ключевой кадр и немного сместите символьный объект так, чтобы ось ствола вновь оказалась прижатой к углублению на лафете. Ключевой кадр 109 этого слоя замените пустым ключевым кадром. В слоях "Колесо", "Лафет" и "Тень" также на 105 ключевой кадр назначьте анимацию того же типа. Таким образом, у нас появился относительно плавный переход от момента залпа с вытянутым стволом пушки к моменту с наклоненным, но нормальным стволом перед началом отката пушки назад.

Прикрепленное изображение


Шаг 10. После мощного залпа, как Вы понимаете, следует откат орудия. Это движение является затухающим и постепенно приводит к полной остановке пушки, для чего нам потребуется снова использовать настройки формы "кривой скорости". Опытным путем я определил, что для отката и полной остановки нашей пушке понадобится примерно 21 кадр (чуть меньше секунды, что вполне может соответствовать реалистичному движению при выбранном масштабе сцены и подобной конструкции пушки). Это и поворот колеса всего на четверть вокруг своей оси подчеркнет тяжеловесность орудия. Итак, отправляемся в 130 кадр временной диаграммы и в слоях "Колесо", "Лафет", "Ствол", "Тень" преобразуем его в ключевые кадры. Символьный объект "Колесо" в 130 ключевом кадре поверните против часовой стрелки на 90°, а ствол вновь верните в горизонтальное положение. Выделив одновременно в сцене все четыре объекта, сместите их влево так, чтобы правый край ствола оказался точно под вертикальной направляющей линией, как это показано на эскизе ниже.
    Ну, и чтобы не откладывать на потом, давайте сразу настроим кривую скорости от начала отката пушки до ее полной остановки. Одновременно выделите 109 ключевые кадры в слоях "Колесо", "Лафет", "Ствол", "Тень" и назначьте на них анимацию типа Motion Tween (для Flash CS 3) и Classic Tween (для Flash CS 4/ CS 5). Не снимая выделения с этих кадров, откройте окно Custom Ease In/Ease Out и настройте форму кривой скорости аналогично форме показанной на эскизе.



Шаг 11. Еще я хотел бы Вам посоветовать привести ствол пушки в горизонтальное положение практически в самом начале отката. Преобразуйте 112 кадр в слое "Ствол" в ключевой кадр и с помощью инструмента свободной трансформации Free Transform Tool (Q) разверните в сцене одноименный символьный объект, как мы это уже делали в 130 ключевом кадре того же слоя. А также хочу предложить Вам самостоятельно анимировать длину тени, на том этапе нашей миниатюры, где пушка активно "вздыхает", готовясь произвести выстрел. Это еще больше оживит сцену, как и в демонстрационном видеоклипе.

Прикрепленное изображение


Шаг 12. В завершение давайте все-таки заполним ту непродолжительную паузу, возникшую после того, как запальный шнур сгорел. Пустим дымок из запального отверстия и усыпим бдительность условного противника.
    Не будем специально создавать новый слой под маленький эпизод легкого дымка, для этого используем уже существующий, но временно пустующий слой. К примеру, весь трек слоя "Пламя фитиля" после 35 кадра до конца остается пустым. Выделите в этом слое 38 кадр временной диаграммы и преобразуйте в пустой ключевой кадр. В этом кадре в рабочем окне сцены создайте объект без контура приблизительно такой же формы, как показано на эскизе ниже (его размеры при нашей конструкции пушки и масштабе сцены должны составлять 8 рх. - по ширине и 35 рх. - по высоте). Получившийся объект преобразуйте в символ типа Movie Clip (Видеоклип) и назовите его "Дымок". Пребывание этого объекта в сцене будет длиться всего до 75 кадра, после чего он исчезнет. 76 кадр на этом слое можно вновь преобразовать в пустой ключевой кадр. Добавьте в последовательность кадров для символьного объекта "Дымок" еще три ключевых кадра и на первые три назначьте анимацию типа Motion Tween (для Flash CS 3) и Classic Tween (для Flash CS 4/ CS 5). В 55 ключевом кадре используйте замедление с помощью кривой скорости. Также примените все трансформации, свойства непрозрачности Alpha и параметры программного фильтра Blur с качеством размытия Medium (Среднее), указанные для каждого ключевого кадра на эскизе ниже.



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


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

________________________________________________________________________________


!


Урок размещен с разрешения его автора Flashcinema.ru. Оригинал доступен здесь.
Запрещается копирование и публикация урока на других сайтах без письменного согласия автора и размещения ссылок.


The original Flashcinema.ru tutorial is written by Flashcinema.ru.
No part of this tutorial can be copied/pasted on any other website without the author's express written permission.

 


Сообщение отредактировал Viva - 24.01.2012 - 20:19


--------------------
Вернуться в начало страницы
 
+Ответить с цитированием данного сообщения
T-Rex
сообщение 24.01.2012 - 15:08
Сообщение #2


Зажиточный Горожанин
*****

За вклад в развитие ArtTower.ru1 местоЗвезда писателя II степени
Группа: Почетные граждане
Сообщений: 1533
Регистрация: 14.12.2009
Пользователь №: 14921
Галерея Блог


Симпатии:  65  


Выглядит эффектно!


--------------------
Мимо мчатся стальные поезда, а я еду в своем игрушечном локомотиве Чух Чух...Чух Чух
Вернуться в начало страницы
 
+Ответить с цитированием данного сообщения
flashcinema
сообщение 24.01.2012 - 20:07
Сообщение #3


Постоялец
**


Группа: Жители
Сообщений: 78
Регистрация: 15.01.2012
Из: Россия, Москва
Пользователь №: 19009



Симпатии:  9  


T-Rex, спасибо! Вот бы еще у кого-нибудь хватило духу все это повторить от и до и похвастаться)))


--------------------
Вернуться в начало страницы
 
+Ответить с цитированием данного сообщения
Шаманка Такхизис
сообщение 11.05.2012 - 20:13
Сообщение #4


Постоялец
**


Группа: Жители
Сообщений: 69
Регистрация: 9.12.2011
Из: Туманный Альбион)
Пользователь №: 18886
Галерея Блог


Симпатии:  0  


А где можно Фотошоп скачать?


--------------------
Кто к нам с чем зачем, тот оттого и того
Вернуться в начало страницы
 
+Ответить с цитированием данного сообщения
Viva
сообщение 11.05.2012 - 20:41
Сообщение #5


Злая и пушистая. Белая и колючая.
******

1 место1 местоМеткий стрелок2 место2 местоМеткий стрелокЗвезда писателя I степени2 местоЗа вклад в развитие ArtTower.ruЗа вклад в развитие ArtTower.ru

Группа: Старшие советники
Сообщений: 4613
Регистрация: 10.05.2006
Из: Россия, Черноземье, Липецк
Пользователь №: 45
Вне группировок:)
Галерея Блог


Симпатии:  217  


С сайта Adobe.com.
Вопрос совершенно не по теме.


--------------------
Самая главная трудность как всегда не в технике, а в людях...

Нельзя дать всем все, ибо всех много, а всего мало.
Вернуться в начало страницы
 
+Ответить с цитированием данного сообщения

Быстрый ответДобавить ответ в эту темуОткрыть тему
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0

 



- Текстовая версия форума Сейчас: 18.12.2017 - 08:15