• Авторизация


Использование анимированной маски в Adobe Flash.Урок 15-11-2016 21:32 к комментариям - к полной версии - понравилось!

Это цитата сообщения jzayka Оригинальное сообщение



Рассмотрим как сделать вот такой эффект.



Спасибо Наташе -DiZa-74 за фотографию

Как сделать подобный эффект в программе SWFQuicker можно посмотреть Здесь


Работать будем в программе Adobe Flash CS6.

1.Файл-Создать-ActionScript3.0
Размеры сцены выставляем по размеру картинки,
которую будем использовать.Назовем"Анимация картинки"

2.Подготовим необходимый материал.
Нам потребуется :
картинка,которУю будем анимировать
и
анимированная маска,которОй будем анимировать.

Что такое анимированная маска и как ее сделать , рассматривать не будем.
Подробности можно узнать в этом Уроке.

Мы будем использовать готовую.
3.Исходник маски скачаем из вложения к посту.
Скачали, распакуем .
Следующим шагом нам нужно ее загрузить в программу.

4.Через Файл-Отрыть-указываем путь к файлу.
У вас он находится там,куда вы его сохранили.

[показать]
Открылся .fla файл "анимированная маска".
Так это выглядит на рабочей сцене
[показать]
Сtrl+Enter-смотрим что это такое..
Это и есть та самая анимированная маска,
которую мы будем использовать для анимации картинки..

Перенесем ее в библиотеку основного документа.



Заходим в библиотеку документа "маска анимированная".
Делаем как показано на скрине.
[показать]
5.Открываем документ "Анимация картинки".Идем в Библиотеку.
[показать]
В Библиотеке мы видим скопированные файлы маски.
Маска состоит из графического символа и фрагмента ролика(мувиклипа).

[показать]

6.Импортируем в библиотеку картинку(Файл-Импорт-Импортировать в библиотеку).

[показать]


Подготовительная работа закончена..
****
Приступаем к анимации.
Создадим символ и назовем его "анимация маской".
[показать]
7.Создадаим здесь 3 слоя.
[показать]
На первом слое у нас будет картинка со значениями координат x=0;y=0;
[показать]
На втором слое расположим эту же картику cо значениями х=0; y=-1;
Перетаскиваем на соответствующие слои картинки.
В Свойствах проставляем нужные значения
[показать]
3-ий слой для маски.

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

Основная часть маски должна находиться над картинкой.
[показать]
Если размер маски меньше картинки,
увеличиваем при помощи инструмента Преобразование.

[показать]
8.Встаем на слой "маска"Кликаем првой кнопкой мыши.
Жмем -Маска
[показать]
Так теперь выглядят слои и область редактрования символа
[показать]
9.Переключаемся на рабочую сцену
[показать]
Перетаскиваем из библиотеки символ"анимация маской"
[показать]
10.Выравниваем в пределах рабочей области
[показать]
Смотрим ,что получилось..CTRL+Enter



Вот и все.Анимация готова!


Маской можно анимировать картинки в формате PNG.



А так же анимировать не всю картинку ,а какую-то часть.
Вот здесь я анимировала воду и парео ..





Серия сообщений "**Мои уроки":

Часть 1 - Цветочный шлейф за курсором
Часть 2 - Слайд-шоу в Aleo Flash Intro Banner Maker встроенным эффектом..)
...
Часть 13 - Делаем в Adobe Flash 3D Эффект переворота(3D вертелка).
Часть 14 - Как создать и наложить маску определенной формы на видео в Adobe Flash.Урок.
Часть 15 - Использование анимированной маски в Adobe Flash.Урок
Часть 16 - Текст за курсором в Adobe Flash(AS3).Урок.
Часть 17 - Урок.Эффект "Ripple" (волна)в Adobe Flash(AS3).
...
Часть 22 - Анимация частей картинки с помощью маски.Урок для Adobe Flash.
Часть 23 - Урок. Картинка из кусочков в Adobe Flash CS6
Часть 24 - Урок.Эффект полосок на картинке в Adobe Flash.


вверх^ к полной версии понравилось! в evernote


Вы сейчас не можете прокомментировать это сообщение.

Дневник Использование анимированной маски в Adobe Flash.Урок | iesmiralda - Дневник Esmeralda | Лента друзей iesmiralda / Полная версия Добавить в друзья Страницы: раньше»