Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > Flash > Флеш-анимация


Автор: Caramel 17.2.2008, 17:47
Подготовка.


Где рисовать?

По своему опыту могу сказать, что самый короткий путь – это делать основу для анимации сразу во флеше. Иллюстратор и флеш в одной связке работают очень… странно. Возможно я просто слишком люблю пользоваться особенностями обеих программ при рисовании, но если исходник сделан во флеше, то в иллюстратор он перекидывается с порезанными заливками. В тоже время перенести из иллюстратора цветные рисунки и (о боже, ни в коем случае не делайте) меши – лучше застрелиться сразу. Поэтому – открываем флеш и работаем там, если не хотите лишиться массы нервных клеток.


Что рисовать?
 То, о чем я здесь напишу, скорей всего вам уже известно. Большей частью.  На начальном этапе нужно четко представлять, что бы хотим иметь на выходе. Анимация – трудоемкая вещь. Тактическая ошибка в начале может аукнуться рутинной правкой  уже сделанной работы, поэтому 

спешим медленно smile



Есть персонаж – кошка. 
Анимация -  кошак стоит, двигает хвостом, водит глазами, покачивает головой. Словом делает разные мелкие движения не меняя позы.
Значит на этом моменте нам нужны:

1.    Передние лапы (2 графических объекта)
2.    Задние лапы (2)
3.    Тушка (1)
4.    Голова  (1)
5.    Глаза(2)  
6.      Нос(1)

Каждая часть тела – графический объект, с логичным названием. Все требуемые нам объекты расположены в отдельном слое. Слои называются так же, как объекты в них лежащие – это сильно облегчает жизнь.  Постарайтесь группировать слои по двое. К примеру ноги (или лапы) идут друг за другом, так же как и руки, глаза (у нас это зрачки). 

Что бы быстро и легко раскидать элементы по слоям, и дать им имена – собираем кошку в одном слое, делаем ее мувиком. Заходим внутрь, выделяем  все – правой кнопкой вызываем меню – Distribute to Layers.


В библиотеке графику тела складываю в отдельную папку, мувики – в другую. Это тоже важно. Сейчас файл маленький, но если не побеспокоиться о порядке сейчас, то к концу проекта он может разрастись до невообразимых объемов где черт ногу сломит.
Устанавливаем ключевые точки вокруг которых будут двигаться объекты.  

http://imageshack.us


Отступаем на 50 и проставляем ряд ключевых кадров.
Для анимации все готово.

http://imageshack.us



Почувствуйте себя волшебником.

Когда я только осваивала флеш, мне казалось нереальным определить сразу  сколько кадров нужно отступить, что бы движение получилось достаточно быстрым и в тоже время не слишком резким. С опытом оно, конечно, приходит само, но при постоянной практике вырабатывается достаточно быстро. Несколько правил которых придерживаюсь:

1.    Движение всегда начинается с ключевого кадра и заканчивается ключевым кадром.  Даже если движение начинается сразу как только запускается мувик – отступить один кадр и начинайте со второго.

2.    Если анимация движения в итоге возвращается в исходну точку – сначала проставьте ключевые кадры, а потом смещайте объекты.

3.    Сначала делается большое движение (например головы со всеми элементами), а потом дополнительные мелкие анимации (к примеру моргание глаз). На практике это выглядит так – провожу по кадрам линию пока не выделю все нужные объекты, ставлю ключи. Потом второй раз так же. Не сбрасывая выделение поворачиваю голову  как мне нужно, ставлю motion tween. А вот теперь можно и глаза кошаку прищурить.

http://imageshack.us


4.    Иногда, что бы добавить живость анимации стоить слегка сплющивать элементы имитируя воздействие силы тяжести.  Например если бы кот внезапно задрав лапки шелпнулся на зад, то анимация содержала бы не только начало и конец движения, но и то, как его чуть придавило к земле, т.е. тело как бы спружинило.

Ну а дальше усидчивость, усидчивость и еще раз усидчивость.

В анимации подобную систему называют перекладной, но к классической рисованной она отношения не имеет. Конечно во флеше есть такая замечательная функция, которая может автоматически создать промежуточные шаги между двумя слегка измененными линиями, но стоит взять что-то чуть-чуть посложнее и флеш уже путается.

----------------------------------------------------------------------------

Пока писала поняла, что в общем-то тема анимации неохватная. 
Было бы здорово если бы этот урок навел вас на какие-то конкретные вопросы "как сделать", я с удовольствием попробую на них ответить (самой интересно!)

Автор: Antarn 17.2.2008, 19:20
Спасибо за статью  smile 

Основное затруднение - это определить сначала где и сколько нужно "промежуточных" ключей. Есть ли какие-либо правила/рекомендации ?

Автор: Caramel 17.2.2008, 20:11
Antarn, во флеше есть такая "засада" как fps - количество кадров в секунду. Поэтому все, что я скажу - относительно.

для 12 fps

резко - 1 к 1 (моргание), т.е. вообще без промежуточных кадров.

средне - 3-4 кадра (разные движени рук-ног-лап)

медленно - 5-6 кадров 


Очень здорово, что создатели флеша сделали такую возможность как выделение нескольких кадров и их перетаскивание. Можно растащить слишком быструю последовательность или наоборот уменьшить слишком медленную. Главное стараться выделять так, что бы на концы выделения попадали ключевые кадры.

Ну и еще создав новую анимацию, я сразу же запускаю ее прямо в рабочем файле ентером. Достаточно проиграть маленький кусочек, что бы оценить скорость.

Автор: nikolayabc 23.4.2008, 19:46
Спасибо за урок,если знаете,напишите как санимашить ето:сканируем 2 фото и в Flash8Pro. голова с 1го фото(смотрящая прямо) переходит во 2е фото(смотрит в сторону)на оба фото тот же человек,тоесть он в анимации поворачивает головой.Ставил етот вопрос в разделах Flash,ActionScript, пока никто точный ответ недал.

Автор: Caramel 23.4.2008, 22:22
nikolayabc, просто используйте видеокамеру, а не фотоаппаратsmile

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)