Создание простых Flash-эффектов
Эффекты для текста / Преобразование формы, решение проблемы неудачного морфинга  

пример 1

пример 2

Эффект преобразования формы применяется не только для текста, но и для других объектов. Важно, чтобы объект был векторным. Часто этот Flash-эффект называют морфингом фигур.

В основе эффекта лежит использование анимации Shape Tween.

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

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

Создание эффекта

Создайте новый документ нужного размера, задайте фон.
(в примере размер был выбран 350px X 100px, цвет #FFFFFF).

Создайте количество слоев равное количеству букв. В каждый из слоев на свое место поместите объекты, которые будут преобразовываться (сердечки).

Рассмотрим применение эффекта для первой буквы.

При помощи клавиши F6 создайте ключевые кадры в 20-м и 30-м кадре.
(в промежуток времени между 1-м и 20-м кадрами будет видно сердечко).

Создайте анимацию Shape Tween в промежутке между 20-м и 30-м кадрами. Для этого выберите инструмент Selection Tool и поместите указатель мыши в 20-ый ключевой кадр. На панели Properties выберите в окне Tween анимацию Shape.
(Будьте внимательны: анимацияShape Tween доступна не для всех объектов! В нашем случае сердечки векторные, а поэтому для них этот эффект досупен).

При этом кадры будут окрашены в зеленый цвет, и между 20-м и 30-м кадрами появится стрелка.

Создайте временный слой, который вы потом удалите. На нем напишите букву "Л". Совместите на сцене сердечко и эту букву.

Выделите букву при помощи инструмента Selection Tool . Нажмите <Ctrl>+<B>, чтобы работать с буквой, как с отдельным объектом, а не как с текстом. При этом буква станет выделена как объект:

Воспользовавшись инструментом Selection Tool , скопируйте объект-букву.

Перейдите на слой, с которым вы работаете. Инструментом Selection Tool выделите 30-ый кадр анимации (в нем располагается ключевой кадр, и на этом кадре заканчивается анимация Shape Tween). Выделите на сцене сердечко и удалите его при помощи клавиши. Вставьте объект-букву. Для того, чтобы буква оказалась в нужном месте необходимо вставку осуществить следующим образом: в меню File выбрать Paste in Place.

У вас должно получиться следующее: с 1-го по 20-ый кадр видно сердечко, а затем с 20-го по 30-ый кадр сердечко преобразуется в букву "Л" .

При помощи клавиши F6 продлите видимость на сцене буквы "Л" до 100-го кадра.

Создайте еще один ключевой кадр в 110-м кадре. Создайте анимацию Shape Tween между 100-м и 110-м кадрами.
(Между этими кадрами буква будет преобразовываться в сердечко).

Аналогичным образом удалите из 110-го кадра букву "Л" и вставьте сердечко.

На линии времени для этого слоя у вас должна получиться следующая картина:

Для данного слоя работа окончена. Повторите эти операции для других слоев и букв.

В примере рассмотрен случай, когда сердечки преобразуются в буквы по почереди, а буквы в сердечки одновременно:

Нажмите клавишу Ок. Эффект готов.

 

Решение проблемы некорректного морфинга фигур, имеющих внутренние области

Подправим уже созданный нами файл.

Суть эффекта следующая: для того, чтобы Macromedia Flash корректно работала с внутренними областями, программу можно... обмануть. И "лишить" буквы внутренних областей (с точки зрения Macromedia Flash, конечно).

Откройте созданный файл. Букву "Л" изменять не будем. Рассмотрим буквую "Ю". Она имеет одну внутреннюю область.

Превращение сердечка в букву "Ю" начинается в 30-м кадре, а заканчивается в 40-м. Создайте в 41-м кадре еще один ключевой кадр.

Тогда, начиная с 41-го кадра у нас на сцене будет видна нормальная буква "Ю" в течение всего остального времени.

Теперь следует изменить букву "Ю" в 40-м кадре и лишить ее внутренней области. Для этого "прорежем" внутреннюю область буквы тонкой линией. Для глаза эта линия будет не видна, тем более, что с 41-го кадра у нас опять будет "нормальная" буква. А вот с 30-го по 40-ой кадр морфинг будет проходить совсем по-другому, так ак для программы в букве "Ю" уже не будет содержаться внутренних областей.

 

В зависимости от места "разреза" морфинг будет проходить по-разному. Обратите внимание на пример 2 и на то, каким путем происходит преобразование сердечка в букву "Ю".

Для достижения нужного вам эффекта можно подобный "разрез" сделать в разных местах, в нескольких местах. Мало того, этот разрез может иметь любую форму. И тогда морфинг будет проходить достаточно причудливым образом.

Для того, чтобы обратное превращение буквы в сердечко также проходило корректно, проделайте такую-же операцию и в конце анимации. Перед анимацией формы, в предыдущем кадре создайте новый ключевой кадр. А в первом ключевом кадре замените "нормальную" букву на букву с прорезью. Для точного расположения буквы пользуйтесь Paste in Place (см. выше, в описании эффекта).
(для букву "Ю" создайте новый ключевой кадр в 99-м кадре, а в 100-м кадре замените букву).

Проделайте аналогичные действия для всех букв с внутренними областями. Тогда линия времени будет принимать такой вид:

Эффект готов.

 

 

 
Итоговая работа Булка Светланы Константиновны, sbulka@yandex.ru
Хостинг от uCoz