Flash animation

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

на самом деле для этого не нужно никаких специальных плагинов или сложных настроек, всё предельно просто.

Read the rest of this entry »

зная о моей большой любви к плагинам и расширениям для flash, мне скинули ссылку на очень занятный ресурс jumpeyecomponents.com, на котором представлены все возможные flash компоненты для работы с текстом, ui, flash меню, аудио, видео и визуальными эффектами. естественно всё это поставлено на коммерческую основу и за каждый набор компонентов нужно выложить кругленькую сумму, но на сайте так же представлены триальные версии для ознакомления и урезанные free версии.

лично меня из всех компонент больше всего заинтересовала TXeff для работы с текстом. разработчики не поленились сделать для этой компоненты целый сайт, где в разделе редактирования можно посмотреть что из себя представляет эта компонента и поиграться с настройками.

с установкой компоненты идёт мануал, но имхо заурядному аниматору с ним просто так не разобраться. лично мне пришлось по некоторым вопросом консультироваться с as-программистом. но в целом если хорошо вникнуть в суть вопроса TXeff будет отличным инструментом для тех, кто в больших объёмах делает flash презентации. например вот что получилось у меня:

хотя сразу выплыл на поверхность баг – в нестандартных шрифтах иногда не до конца отрисоовываются буквы, как в моём примере, можете пронаблюдать, но со стандартными такого бага не наблюдалось.

да, компоненты хорошие, хоть и немного замудрённые, но сама идея отличная! если и не покупать, то можно просто поиграться с настройками текста на сайте, добиться нужного эффекта, а потом по примеру сделать всю анимацию ручками

зы: исходник примера можно скачать тут. но не факт, что он у вас будет работать без установленной компоненты.

думаю, что эта новость уже облетела интернет, но всё же не могу о ней не написать.
вышла в свет книга фёдора хитрука «профессия – аниматор» (в двух томах).

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

кто ещё, как не великий создатель «вини пуха», может так хорошо нам рассказать обо всех этапах создания мультфильма, от рождения идеи до монтажа?
обязательно приобрету эту книгу, как только она появится в продаже украинских интернет-магазинов!

источник

вчера мне задали такой вопрос: как можно отредактировать сразу несколько ключевых кадров?
такой вопрос часто задают новички, но и что самое забавное опытные флешеры тоже )

данный метод может быть применён как к последовательности ключевых кадров (например ряд импортированных картинок png), так и к комплексной motion анимации.

1. рассмотрим на примере анимации акулы (да, я знаю акулы плавают по другому! )
2. к примеру нам нужно отрезайзить всю анимацию вместе с рыбкой и положением ключевых кадров в 2 раза. такое случается достаточно часто, например когда нужно делать несколько баннеров с различным разрешением.
на таймлайне есть ряд очень полезных кнопочек. слева-право: onion skin, onion skin outlines, edit multiply frames, modify onion markers
первые 2 зачастую используются аниматорами при покадровой анимации
3. onion skin позволяет одновременно просматривать несколько последовательных кадров сразу. вверху на таймлайне вы можете увидеть маркеры, которые просто регулируются и обозначают количество выделенных кадров до и после текущего. в данном случае я отметила 3 кадра после. результат которые получается вы видите справа.
4. onion skin outlines работает таким же образом, единственное отличие кадры отображаются аутлайнами.
5. modify onion markers позволяет быстро изменить настройки маркеров
6. ну и собственно, то что нас больше всего интересует edit multiply frames — позволяет редактировать сразу несколько ключевых кадров.
замечу сразу, что почему-то у многих возникают трудности при использовании этого режима, поэтому расскажу алгоритм действий, который действует наверняка:

1. выбираем режим edit multiply frames
2. выделяем маркерами нужный промежуток кадров вручную или с помощью команды onion al. картинка будет выглядеть как показано на рисунке: будут отображаться только ключевые кадры анимации.
3.выделяем все кадры промежутка, в нашем случае, т.к мы выбираем все кадры, можно просто кликнуть по слою. все символы при этом должны быть выделены.
4. выбираю инструмент transform нажатием горячей клавиши «Q». всё отображаемые символы должны выделиться группой для трансформации. если выделился только один символ, возможно вы что-то сделали не так, повторите процедуру.
5. скейлим до нужного размера (рис.7)

8. проверяем результат

для shape анимации тоже можно использовать этот метод, но если вы используете shape hints, то с ними будут проблемы, ибо они остаются на прежних местах.

зы: конечно можно конвертировать весь слой в movie clip и отресайзить как хочется, но есть случаи когда этот способ не покатит, тогда вы сможете опробовать данный метод )

ззы: ну и бонусом выкладываю исходник акулы

блог flash-animation.ru потерпел небольшой redesign

наблюдаются небольшие глюки в работе ie и opera. юзайте firefox и будет вам счасье! )

сегодня хочу рассказать о таком приёме анимации, как облака пыли.
этот приём применяется в разнообразных случаях:
- резкое перемещение персонажа
- торможение
- падение объектов на землю
- взрывы
- грубо говоря везде, где что-то хоть как-то может поднять пыль )

рассмотрим на примере хомячка из предыдущей статьи:

1. в моём случае пыль поднимается когда он резко срывается с места и тормозит.
2-8. если пронаблюдать за настоящей пылью, можно заметить, что сначала поднимается густой клуб, увеличивается и постепенно рассеивается. рисовать его одним большим пятном с применением прозрачности – нонсенс, хотя можете попробовать. для реализации этого эффекта лучше использовать несколько облачков поменьше и с каждым шагов увеличивать их количество, уменьшать в размерах и изменять прозрачность.
9. вот собственно результат который получился.
10. когда делается пыль для торможения, её лучше делать не в одном месте, а растягивать вдоль траектории движения.

вот собственно основные принципы анимации. пыль может быть разнообразная, в зависимости от стилистике: с контурными линиями или без, с градиентом, прозрачностью или даже разноцветная. так же, чтобы придать ей реалистичности можно использовать фильтр blur. экспериментируйте, дерзайте!
исходник пыли можно скачать здесь.

итак, период полураспада закончился, в голове уйма идей и приёмов, которыми хочется поделиться! начнём с обещанного. шлейфы.

есть такой хитрый приём, когда что-то очень быстро движется, необходимо дорисовать шлейф, тогда анимация будет казаться более динамичной.
шлейф может быть как в одном кадре анимации, так и в нескольких. лично я использую максимум 5-6 на 25 fps.
важно отметить, что шлейф обычно рисуется градиентом основного или белого цвета движущегося объекта, плавно переходящий в альфу, но могут быть вариации.
рассмотрим на примере теннисного мячика.

1. вот у нас есть обычная motion анимация – мячик ударяется о плоскость, немного сжимается при ударе и летит дальше.
2. теперь ускорим эту анимацию. глаз начинает замечать 5 основных позиций и как такового ощущения быстрого движения нет.
3. а теперь попробуем дорисовать в эту анимацию шлейфы. сразу добавилась динамика. но всё же глаз режет среднее положение мячика.
4. мы оставляем только промежуточное положения мяча в момент удара, всё остальное заменяется на шлейфы. итого получаем очень быструю, динамичную картинку.
5. аналогично можно поступать с персонажами.
6. заметьте, здесь шлейф разноцветный, выделены основные цвета персонажа.
7. кстати, сразу хочу отметить, что при быстром перемещении нужно немного вытягивать персонажа по ходу его движения, тогда анимация будет выгладить более динамично. раскадровка показана на слайде.

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

а вот ещё несколько примеров шлейфов из мультфильмов студии toongu.ru и сергея максимовича