-Цитатник

Найди кота! или Как правильно спрятаться? - (5)

Ну очень улыбнуло!!!

Анимация формы во Flash(морфинг). - (5)

Анимация формы во Flash(морфинг) Морфинг отличается от предыдущих типов анимации тем,что работает...

Урок для Фотошоп " Закрываем глазки". - (11)

От меня добавка - Кисти для фотошоп "Ресницы" Вложение: 4167720_eyelashes.rar Смотреть зде...

Анимация частей картинки с помощью маски.Урок для Adobe Flash. - (2)

В комментариях к посту Использование анимированной маски в Adobe Flash.Урок ...

Текстовый скроллинг средствами флеш. - (0)

Текстовый скроллинг. Прокрутка текста средствами флеш. (Часть п...

 -Рубрики

 -Поиск по дневнику

Поиск сообщений в novprospekt

 -Подписка по e-mail

 

 -Статистика

Статистика LiveInternet.ru: показано количество хитов и посетителей
Создан: 02.09.2010
Записей: 709
Комментариев: 11273
Написано: 13505


Использование панели «Редактор движения» в Adobe Flash CS6.

Вторник, 17 Марта 2015 г. 08:44 + в цитатник
Редактор движения - это специальная панель, с помощью которой возможно корректировать и создавать эффекты для анимации движения.

Вот в этом ролике, например, вся анимация сделана с помощью Редактора движения.




И анимация картинок, и текста сделаны по одному принципу. Изменяются только свойства анимации.

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

Создаём новый документ AS3

16-03-2015 18-21-45 (700x434, 174Kb)

На основном рабочем поле (Монтажный кадр 1), на Временной шкале, встаём на Слой 1 и продлеваем Временную шкалу до 70 кадра.
Для этого щелкаем правой кнопкой мышки в 70 кадре и в открывшемся контекстном меню выбираем "Добавить кадр"

16-03-2015 20-08-39 (700x395, 180Kb)

Шкала продлена до 70 кадра.





16-03-2015 20-11-09 (700x470, 131Kb)

Снова щелкаем правой кнопкой мыши в первом кадре и на Рабочем поле инструментом "Текст" создаем нужный текст.
Я пишу - "С Днём Рожденья!"

16-03-2015 20-18-29 (700x495, 197Kb)

Переключаемся на инструмент выделения "Стрелка", щелкнув по нему в панели Инструментов.
Теперь наш текст будет выделен.

16-03-2015 20-22-18 (700x537, 179Kb)

Не снимая выделения с текста, модифицируем его во Фрагмент ролика

Модификация - Преобразовать в символ

16-03-2015 20-30-24 (610x577, 196Kb)

16-03-2015 20-32-52 (700x506, 201Kb)

После того как текст модифицирован во фрагмент ролика, дважды щелкаем по нему и входим в поле редактирования символа "Текст"

16-03-2015 21-01-13 (700x562, 234Kb)

Щелкаем по тексту правой кнопкой мыши и в открывшемся контекстном меню выбираем "Разделить"

16-03-2015 21-06-28 (700x552, 266Kb)

16-03-2015 21-08-31 (700x528, 219Kb)

После этого возвращаемся на основную Сцену (Монтажный кадр 1), щелкнув по этой вкладке.

На основной Сцене (Монтажный кадр 1), на Временной шкале щелкаем в первом кадре и в открывшемся контекстном меню выбираем
"Создать анимацию движения"

16-03-2015 21-12-59 (694x633, 312Kb)

Теперь Временная шкала выглядит так

16-03-2015 21-14-43 (700x582, 202Kb)

Открываем вкладку меню "Редактор движения"

16-03-2015 21-44-18 (601x336, 125Kb)

Если у вас этой вкладки нет, то зайдите в меню - Окно и в выпадающем списке щелкните по пункту "Редактор движения"

16-03-2015 21-47-05 (700x481, 237Kb)

Вот так выглядит вкладка "Редактор движения".

16-03-2015 23-21-35 (700x482, 212Kb)

Прокручиваем справа слайдер и находим свойство "Масштабирование по оси X" и "Масштабирование по оси Y"
Эти свойства нашей анимации движения мы и будем редактировать.

16-03-2015 23-25-23 (700x469, 213Kb)

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

16-03-2015 23-28-42 (700x397, 196Kb)

В Редакторе движения также имеется Временная шкала. Для свойств "Масштабирование по оси X" и "Масштабирование по оси Y" есть первый ключевой кадр.
Встаём на линию "Масштабирование по оси X" и щелкаем по этому первому ключевому кадру. В графе числовых значений, щелкнув по цифре 100, вводим новое значение, например, 240. Тем самым мы увеличиваем размер текста по оси X.
И, поскольку цепочки для масштабов у нас связаны, то для масштаба по Y числовое значение должно автоматически увеличиться на такое же значение.
Мы изменили размер текста по оси X и Y.

17-03-2015 7-31-04 (700x552, 294Kb)

17-03-2015 7-35-55 (700x599, 316Kb)

Прокручиваем горизонтальный слайдер в самый конец Временной шкалы Редактора движения и щелкаем правой кнопкой мыши на линии "Масштаб по оси X". Нажимаем на появившеюся кнопку "Добавить ключевой кадр". Этим самым мы добавляем конечный ключевой кадр. Тоже само проделываем на линии "Масштаб по оси Y".

17-03-2015 7-43-26 (700x514, 321Kb)

Конечные ключевые кадры добавлены.

17-03-2015 7-51-56 (700x552, 272Kb)

Вводим для этих ключевых кадров новые значения для масштабов по осям X и Y. Например, 80. То есть уменьшаем размер текста.

17-03-2015 7-55-55 (700x564, 295Kb)

На данном этапе мы создали анимацию движения с масштабированием текста.
Теперь зададим движению анимации свойство по которому это движение и будет происходить.
Для этого прокручиваем вертикальный слайдер вниз и находим раздел "Замедления". Щелкаем по значку "плюсик", который находится вверху справа и, в раскрывающемся списке, выбираем "Пружина".

17-03-2015 8-00-44 (700x598, 303Kb)

В окне ввода числового значения печатаем число 5. Число это обозначает количество колебаний "Пружины". Чем больше это значение, тем резче будет двигаться наша анимация.

17-03-2015 8-39-50 (700x601, 245Kb)

Снова прокручиваем вертикальный слайдер вверх и возвращаемся к свойствам анимации " "Масштабирование по оси X" и "Масштабирование по оси Y". В графе "Замедление" щелкаем по кнопке раскрывающегося списка и выбираем пункт "Пружина".
Проделываем это для обоих масштабов и по X, и по Y.

17-03-2015 11-15-48 (700x599, 243Kb)

17-03-2015 11-23-34 (700x600, 306Kb)

Можете проиграть анимацию и посмотреть, что она двигается по принципу "Пружина".

17-03-2015 11-26-42 (700x564, 292Kb)

Если всё устраивает, то возвращаемся на Временную шкалу основной Сцены (Монтажный кадр 1) и сохраняем наш проект

Файл - Сохранить как

Экспортируем готовый флеш ролик

Файл - Экспорт - Экспортировать ролик.

17-03-2015 11-31-29 (700x582, 306Kb)






Серия сообщений "Уроки Flash":
уроки в разных флешпрограммах, авторские уроки flash
Часть 1 - Делаем элементарные часики.Начинаем учиться созданию flash.
Часть 2 - Как правильно записать код флешки или видео в рамочку для кодов.
...
Часть 47 - Рисуем кнопку в Adobe Flash.
Часть 48 - Анимация частей картинки с помощью маски.Урок для Adobe Flash.
Часть 49 - Использование панели «Редактор движения» в Adobe Flash CS6.
Часть 50 - Анимация формы во Flash(морфинг).

Метки:  

Процитировано 49 раз
Понравилось: 39 пользователям

Irina-snez   обратиться по имени Вторник, 17 Марта 2015 г. 09:01 (ссылка)
Классно, Мариночка! Мечта, а не урок. Давно пыталась разобраться в редакторе движения методом тыка... но не очень-то получалось... Огромное спасибо!
Ответить С цитатой В цитатник
Перейти к дневнику

Вторник, 17 Марта 2015 г. 09:09ссылка
Пожалуйста Ириш. Я давно этот урок хотела написать, да всё как то не складывалось. А тут по последнему уроку Лены были вопросы по этому редактору и я решила этот урок всё - таки добить.
Кстати, в новом Adobe Flash CC этого редактора уже нет.
Перейти к дневнику

Вторник, 17 Марта 2015 г. 09:14ссылка
Мариночка, ты умница, молодец и трудяга! Я только дизайном балуюсь. До серьезной работы во флеш не доберусь... Я только год назад Cs6 поставила. И переходить на СС пока нет ни времени, ни желания. Там что-нибудь существенно новое и полезное? Конечно, в комменте не рассказать, Надо бы релиз смотреть... Но если и ставить не хочется... Но любопытно...
alina1980   обратиться по имени Вторник, 17 Марта 2015 г. 09:10 (ссылка)
Мариночка доброе утро! Спасибо за урок! Только вот беда, не работает у меня эта программа на восьмерке, пришлось распрощаться с ней...
Ответить С цитатой В цитатник
Перейти к дневнику

Вторник, 17 Марта 2015 г. 09:13ссылка
Алиночка, на 8 надо установить новую версию. Adobe Flash CC
У Леночки (jzayka) по - моему она была. Обратись к ней.
Перейти к дневнику

Вторник, 17 Марта 2015 г. 09:15ссылка
Спасибо Мариночка, попробую, может она поможет!
Перейти к дневнику
Перейти к дневнику

Вторник, 17 Марта 2015 г. 11:54ссылка
Спасибо Вам огромное, забираю, буду пробовать!
LiSu   обратиться по имени Вторник, 17 Марта 2015 г. 09:19 (ссылка)
Интересный эффект! Классный урок, спасибо, Мариночка!
Ответить С цитатой В цитатник
Перейти к дневнику

Вторник, 17 Марта 2015 г. 09:21ссылка
Пожалуйста Лиличка. Рада, что заинтересовала.
таила   обратиться по имени Вторник, 17 Марта 2015 г. 09:25 (ссылка)
Красивая работа, Мариночка! Удачи в творчестве!
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:17ссылка
Спасибо большое.
Elena_Gati   обратиться по имени Вторник, 17 Марта 2015 г. 11:09 (ссылка)
Маринка, спасибо за прекрасный урок! Надо как-то попробовать эту программу... Установила, сама пробовала методом тыка, но ничего не поняла. А по твоему уроку попробую обязательно. С удовольствием забираю в свою копилочку.
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:16ссылка
Программа очень интересная. Уроков интересных даже здесь на Лиру очень много. Так что осваивай в удовольствие.
MissKcu   обратиться по имени Вторник, 17 Марта 2015 г. 11:32 (ссылка)
Ой...пасиб...видела подобный эффект....утащу...но когда сделаю-незнаю...но мне нра...
ПАСИБКИ!
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:15ссылка
Пожалуйста Ксюш. Сделаешь как будет время или идея какая - нибудь с этим эффектом в голову придёт. Самое главное это вдохновение, ну и время свободное, конечно
jzayka   обратиться по имени Вторник, 17 Марта 2015 г. 11:47 (ссылка)
Спасибо,Мариночка.Я редактор движения не знаю вообще.
Помнится,ты мне советовала..Но потыкала,ничего не поняла..
А теперь по уроку обязательно попробую разобраться..
Хотя бы понять как в нем работать..
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:13ссылка
Пожалуйста Леночка.
Jorjorych   обратиться по имени Вторник, 17 Марта 2015 г. 11:48 (ссылка)
Спасибо!
1_1 (100x120, 22Kb)
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:13ссылка
Пожалуйста Георгий.
jzayka   обратиться по имени Вторник, 17 Марта 2015 г. 12:10 (ссылка)
Марина,вот что пишут о версии СС 2014(сборка monkrusА)
------------
Преимущества Adobe Flash Professional CC 2014:

- Экспорт файлов SVG
- Обводки переменной ширины
- Переходы для обводок переменной ширины
- Новый редактор движения
- WebGL для создания анимации
- Отмена операций на уровне объектов
- Поддержка средства просмотра Flash
- Поддержка расширения HTML5
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:12ссылка
Вот видишь, новый редактор движения. А я прочитала в одной аннотации, что его вообще нет. Интересно, конечно.
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:25ссылка
вот здесь можно почитать как вызвать в СС редактор
https://helpx.adobe.com/ru/flash/using/editing-motion-tween-using-motion.html#Вызов панели «Редактор движения»
Татьяна_Волкова_Литвинова   обратиться по имени Вторник, 17 Марта 2015 г. 13:04 (ссылка)
Марина, спасибо за урок! Для меня это сложно, но по твоим урокам у меня получается. Буду надеяться, что и этот получится. Спасибо за труд!
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:11ссылка
Танюш, конечно, всё получится. Ты человек упорный и настойчивый. Удачи.
LARINA_KARA   обратиться по имени Вторник, 17 Марта 2015 г. 13:09 (ссылка)
спасибо Марина ! мне очень нравятся ваши уроки!
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:10ссылка
Пожалуйста. Очень рада, что уроки нравятся. Стараюсь писать как можно подробнее. И сама потом не раз возвращаюсь к ним, когда какие-то новые идеи приходят.
Так что пользуйтесь в удовольствие.
koreckolga   обратиться по имени Вторник, 17 Марта 2015 г. 13:35 (ссылка)
Добрый день, Мариночка! Очень нравится! Спасибо большое тебе!
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:08ссылка
Пожалуйста Оленька.
ВАТ   обратиться по имени Вторник, 17 Марта 2015 г. 15:57 (ссылка)
Интересная анимация! Спасибо за урок! Цитирую, попробую разобраться. Кнопку для плеера нарисовала, так быстро всё получилось, что я опешила от неожиданности, думала, что урок большой и вдруг уже закончился. Это от того, что урок очень интересный и понятный. Ещё раз спасибо и за тот и за этот урок.
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:07ссылка
Пожалуйста Верочка.
Рисовать особо не умею и вот когда такие простые формы позволяют, что - то изобразить дельное, то тоже радуюсь как ребёнок.
Нина_Гуревич   обратиться по имени Вторник, 17 Марта 2015 г. 17:32 (ссылка)
Спасибо, очень интересно!!!!!!
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:05ссылка
Пожалуйста Ниночка.
Татьяна_НК   обратиться по имени Вторник, 17 Марта 2015 г. 19:16 (ссылка)
Мариночка!!! ОГРОМНОЕ СПАСИБО!! ЗА УРОК ПО РЕДАКТОРУ ДВИЖЕНИЯ!!!
Это Я Леночку просила!!! Я ВАМ ОЧЕНЬ БЛАГОДАРНА!!!!
Урок! Прекрасный!
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 09:05ссылка
Танюш, пожалуйста. Я видела твою просьбу Леночке. Я ей как то рассказывала об этом редакторе, но руки у неё до него ещё не дошли, а у меня урок этот давно в черновиках в наметках ждал своей участи. Раз есть интерес у кого - то к этой теме, то решила - надо его доделать и поделиться.
Татьяна_НК   обратиться по имени Вторник, 17 Марта 2015 г. 19:25 (ссылка)
МАРИНА!! А можно попросить исходник твоего ролика, то что С днём рождения.
Когда смотришь, на исходник, то получается работа в два раза быстрее))
С Уважением Татьяна!
Ответить С цитатой В цитатник
Перейти к дневнику
Перейти к дневнику

Среда, 18 Марта 2015 г. 14:19ссылка
Мариночка СПАСИБО ОГРОМНОЕ!!!
Ну Теперь наглядно ВСЁ видно!!!
Что ЗА Редактор Движения!!!
Будем трудиться!!!
alina1980   обратиться по имени Среда, 18 Марта 2015 г. 00:26 (ссылка)
Мариночка, скачала программку у Лены Резвых, у меня встала и работает! Посмотри мое художество...

http://www.liveinternet.ru/users/alina1980/post356670405/
И спасибо ещё раз за урок!
Ответить С цитатой В цитатник
Перейти к дневнику

Среда, 18 Марта 2015 г. 08:52ссылка
Алиночка посмотрела. Всё отлично получилось. Молодец, быстро освоилась.
LiSu   обратиться по имени Среда, 18 Марта 2015 г. 19:27 (ссылка)
Мариночка, сегодня села за этот урок, с текстом никаких проблем, все получилось. Но хотела навертеть с персонажами и пошла свистопляска... Вобщем, будет желание, напиши пожалуйста урок по персонажам, не пойму, где остановить анимацию, выдает ошибки.
Ответить С цитатой В цитатник
Перейти к дневнику

Четверг, 19 Марта 2015 г. 09:49ссылка
Лиличка посмотри пока мои исходники. Может разберёшься сама
https://cloud.mail.ru/public/a224f162e21e/ishodnik.rar
Перейти к дневнику

Четверг, 19 Марта 2015 г. 10:13ссылка
Спасибо, Мариночка.может вечером выкрою время...
Перейти к дневнику

Четверг, 19 Марта 2015 г. 18:45ссылка
Маришка, с твоим исходником сразу дошло, спасибище огромное!
Flash_Magic   обратиться по имени Среда, 18 Марта 2015 г. 20:24 (ссылка)
Приветик Мариночка! Как у тебя здорово всё получается, просто супер!!!!!!!
Спасибо тебе большое за уроки и за твои великолепные заготовочки
Самой совсем нет времени делать, а вот твоими часто пользуюсь.
Ты все делаешь очень классно!!!!
Ответить С цитатой В цитатник
Kantemirova_Irina   обратиться по имени Среда, 18 Марта 2015 г. 21:05 (ссылка)
Маришка,ты гений!!! интересные эффекты получаются,спасибо тебе за твой труд!
Ответить С цитатой В цитатник
Любовь_Терехова   обратиться по имени Среда, 18 Марта 2015 г. 22:31 (ссылка)
Мариночка большое спасибо за урок! Обязательно попробую освоить, как появится время. Очень понравилось!
Ответить С цитатой В цитатник
Мила-Милена   обратиться по имени Четверг, 19 Марта 2015 г. 12:42 (ссылка)
Большое спасибо за науку!
Ответить С цитатой В цитатник
Чингиз   обратиться по имени Суббота, 21 Марта 2015 г. 10:27 (ссылка)
Спасибо!
Ответить С цитатой В цитатник
grabor   обратиться по имени Пятница, 27 Марта 2015 г. 00:26 (ссылка)
Спасибо за урок! И... Не могли бы Вы помочь? Неделю перелопачиваю нет и не могу найти. Может у Вас есть такой урок или ссылка? Дело вот в чем. Как пояснение к тексту поста надо (в смысле хотелось бы) вставить покадровую GIF анимацию. Хотелось бы, чтоб кликнув на изображение, анимация включалась и соответственно таким же образом отключалась. Ни где не могу найти нужный код. Спасибо.
Ответить С цитатой В цитатник
Перейти к дневнику

Пятница, 27 Марта 2015 г. 04:38ссылка
Можно сделать по типу плеера кнопки, как здесь
http://www.liveinternet.ru/users/novprospekt/post306121062/

Просто в скрипте убрать загрузку музыки и код будет

code:

stop_bt._visible = false;

play_bt.onRelease = function ()

{

play_bt._visible = false;

stop_bt._visible = true;

};

stop_bt.onRelease = function ()

{

play_bt._visible = true;

stop_bt._visible = false;



};




Этот код для AS2

Урок для программы Sothink SWF Quicker, но в Adobe Flash всё аналогично

Создаёте документ AS2,

На Основной Рабочее Сцене - Монтажный кадр 1 создаете 3 слоя Play, Stop и Скрипт

Вставка - Создать символ

Создаёте новый символ - Фрагмент ролика. Называете, например, "Анимашка".

В этот фрагмент ролика "Анимашка" импортируете анимационную картинку, или помещаете туда созданную покадровую анимацию.

Далее делаете две кнопки - Play и Stop.

В кнопку Play помещаете первый кадр анимации и размещаете эту кнопку на слое Play Основной Рабочей Сцене - Монтажный кадр 1. Даете кнопке имя

play_bt


В кнопку Stop помещаете фрагмент ролика Анимашка" и размещаете эту кнопку на слое Stop Основной Рабочей Сцене - Монтажный кадр 1. Даете кнопке имя

stop_bt


На слое Скрипт пишите код.
кнопка (700x563, 217Kb)


grabor   обратиться по имени Пятница, 27 Марта 2015 г. 20:21 (ссылка)
Вот, вот, вот!!! То что нужно!!! Огромное спасибо! Я даж не знаю как мне Вас благодарить! Я Ваш должник!
Ответить С цитатой В цитатник
Mono-Liza   обратиться по имени Пятница, 30 Октября 2015 г. 05:31 (ссылка)
Спасибо большое, Мариночка, программу скачала, а дальше что? А тут такой подарок, попробую разобраться. Если что-нибудь получится, буду пробовать дальше.
Ответить С цитатой В цитатник
vernisazh   обратиться по имени Суббота, 24 Февраля 2018 г. 21:27 (ссылка)
Спасибо, Мариночка.
Ответить С цитатой В цитатник
Комментировать К дневнику Страницы: [1] [Новые]
 

Добавить комментарий:
Текст комментария: смайлики

Проверка орфографии: (найти ошибки)

Прикрепить картинку:

 Переводить URL в ссылку
 Подписаться на комментарии
 Подписать картинку