adobe flash cs6 обучение
LiveInternetLiveInternet
—Музыка
—Рубрики
—Приложения
—Метки
—Всегда под рукой
—Поиск по дневнику
—Подписка по e-mail
—Друзья
—Постоянные читатели
—Сообщества
—Статистика
Выбрана рубрика Уроки Adobe Flash Professional CS6.
Украшение работ»рандомным»эффектом в Adobe Flash.
Украшение работ»рандомным»эффектом в Adobe Flash.
Давайте рассмотрим как украсить свою работу или текст используя рандомные(случайно создаваемые) объекты.
Примеры сделаланы на основе этого урока
(жмите мышкой)
В урок я внесла некоторые свои»добавки» и пояснения.
Работать будем в программе Adobe Flash CS6,используя AS3.
Делаем эффект «Боке» в Adobe Flash.
Делаем эффект «Боке» в Adobe Flash.
Урок
Будем делать вот такой эффект.
2.Создадим документ АS3.(Файл-Создать-AS 3.0)
Сохраним в созданную папку»боке» (!Обязательное условие!)
под любым названием,например»эффект боке».
3.Содадим два слоя.
На слой 1 поместим фон,слой 2 для скрипта.
Для фона можно импортировать картинку,например,ваш красивый коллаж.Размеры рабочей области по размару картинки.
Я взяла коллаж размером 700/424.
Меняем размеры рабочей области.
4.Выравниваем инструментом Выравнивание.
5.Встаем на слой2.Окрываем панель Действия(F9)
Вставляем код.
======================
import Classes.Lights;
var light:Lights = new Lights();
/* Первая цифра—>Размер документа по ширине; Вторая цифра—>Размер по высоте—>Третья цифра—>Количество пузырьков; Четвертая цифра—>Размер пузырьков; 0х#FFFFFF—>Цвет пузырьков (здесь белый) */
light.init(600, 300, 40, 60, 0xFFFFFF, 0.3, 3, 3, «up», 2);
addChild(light);
=======================
6.Меняем в коде аккуратно размеры на свои..и по желанию размер,количество и цвет пузырьков(см скрин).
Я поменяла все.
7.Смотрим что у нас получилось(Сtrl+Enter)
8.Сохраняем работу(Файл-Сохранить)
9.Экпортируем ролик.(Файл-Экспорт-Экпортировать ролик)
LiveInternetLiveInternet
—Музыка
—Рубрики
—Приложения
—Метки
—Всегда под рукой
—Поиск по дневнику
—Подписка по e-mail
—Друзья
—Постоянные читатели
—Сообщества
—Статистика
Выбрана рубрика Уроки Adobe Flash Professional CS6.
Как создать и наложить маску определенной формы на видео в Adobe Flash.Урок.
Как создать и наложить маску определенной формы на видео в Adobe Flash.Урок.
Обещенный урок о том,как загрузить видео в Adobe Flash,
наложить на него маску и получить вот такие эффекты.
Очень подробные уроки по работе с масками в программе Sothink SWF Quicker можно посмотреть у Марины (novprospekt)
здесь | и | здесь |
В Adobe Flash все аналогично.
Я подробно останавливаться не буду.
Важно знать,что маской может быть графический объект
в виде различных фигур и текст..
При помощи скринов и комменариев к ним мы рассмотрим
как создать маску опеределенной формы.
И Как загрузить видео в программу,
наложить на него созданную маску для получения эффекта.
Начнем с подготовки формы для маски.
читаем далее
Использование анимированной маски в Adobe Flash.Урок
Использование анимированной маски в Adobe Flash.Урок
Рассмотрим как сделать вот такой эффект.
Работать будем в программе Adobe Flash CS6.
1.Файл-Создать-ActionScript3.0
Размеры сцены выставляем по размеру картинки,
которую будем использовать.Назовем»Анимация картинки»
Анимация дождя в Adobe Flash. Урок первый.
Анимация дождя в Adobe Flash. Урок первый.
В следующем уроке расскажу как редактировать и использовать
Во вложении найдёте FLA.
Вы можете создавать свои варианты «дождевой сетки»,
с более длинными или короткими штрихами и т. д.
Не бойтесь экспериментировать!
Как я делала урок «Самопишущийся текст» (мои пояснения)
Как я делала урок «Самопишущийся текст» (мои пояснения)
1. Создайте новый документ с нужными размерами. Установите частоту кадров = 34 и нажмите ОК.
Урок для Adobe Flash CS5/6 Наложение и движение маски по картинке.
Урок для Adobe Flash CS5/6 Наложение и движение маски по картинке.
Урок для Adobe Flash CS5/6 Наложение и движение маски по картинке.
Как я делала урок «Самопишущийся текст» (мои пояснения)
Как я делала урок «Самопишущийся текст» (мои пояснения)
1. Создайте новый документ с нужными размерами. Установите частоту кадров = 34 и нажмите ОК.
Флеш эффект движения картинок. Флеш галерея «Photo Stack Gallery»
Флеш эффект движения картинок. Флеш галерея «Photo Stack Gallery».
В этой Рождественской музыкальной флеш открытке использован эффект движения картинок «Photo Stack Gallery».
Сделать такой эффект достаточно просто.
Для этого создаём папку для нашего проекта и называем её, например «Gallery».
В эту папку поместите картинки, которые хотите разместить в галереи. Картинки должны быть приблизительно одинакового размера по ширине, высоте и расположению. Картинки также должны быть размером примерно 300 x 400 пикселей.
Картинок может быть сколько угодно.
Я взяла 4 картинки.
Теперь, внутри папки «Gallery» создайте папку непосредственно для флеш галереи. Назовите её например «gall» В эту папку мы должны поместить библиотеку greensock для AS3, которая потребуется для создания эффекта.
Если у вас этой библиотеки нет, то можете скачать её по ссылке.
greensock-as3.zip
Архив с библиотекой скачайте в папку проекта «Gallery». Распечатайте его. В распечатанной папке «greensock-as3» нас интересует папка «com». Поэтому откройте папку «greensock-as3» и скопируйте в ней папку «com». Скопированную папку «com» вставьте в папку флеш галереи «gall», которая у вас также создана в папке «Gallery».
Далее открываем программу Adobe Flash CS6 и создаём новый ActionScript 3.0 с параметрами как на картинке
уроки в разных флешпрограммах, авторские уроки flash
SamPawno
Adobe Flash CS6 видео уроки
— полноэкранный режим
Как работает анимация?
Прежде, чем рассказать, как создавать сайт на флэш, нужно сначала освоить и понять принципы работы в программе Adobe® Flash® CS4. Сначала рассмотрим принципы создания анимации во флэш, затем рассмотрим ActionScript® 3.0, а уж потом рассмотрим создание простого Flash сайта.
Чтобы понять, как работает анимация, нужно понять, как работает временная шкала, которая содержит слои. Эти слои можно создавать, удалять, объединять в группы и перемещать их относительно друг друга. Также Вы видите, что линия времени состоит из последовательности кадров, по которым можно перемещаться, передвигая маленький вертикальный прямоугольник красного цвета, расположенный над слоями.
Данный прямоугольник является воспроизводящей головкой, перемещая которую, Вы можете перемещаться по своей анимации. Временная шкала – это последовательность пронумерованных кадров. У каждого кадра есть порядковый номер, который проставлен над каждым пятым кадром.
Если воспроизводящая головка находится на непронумерованном кадре и нужно узнать номер текущего кадра, то можно, либо просчитать его самостоятельно по отрезкам временной шкалы, либо проверить текущий кадр в нижней части временной шкалы. Здесь же можно быстро перейти к нужному кадру, изменив значение на искомый номер кадра.
Просмотреть результат созданной анимации можно при нажатии горячих клавиш CTRL + ENTER или, воспользовавшись верхним меню – управление – тестировать ролик.
В появившемся окне вы видите результат своей созданной анимации, воспроизведение которой повторяется снова и снова.
Анимация – это набор статических кадров, в каждом из которых объект занимает другое положение. И когда Вы перемещаете воспроизводящую головку с, достаточно большой скоростью, Вы получаете иллюзию анимации, хотя на самом же деле, анимации никакой нет. Следует отметить еще и скорость перемещения воспроизводящей головки по кадрам. По умолчанию, данная скорость равна 24-рём кадрам в секунду. Скорость показывается в нижней части временной шкалы. Текущую скорость можно в любой момент изменить, достаточно лишь ввести нужное значение в ячейку.
Данная скорость означает, сколько кадров показывается за одну секунду времени. Чуть правее от значения скорости в нижней части временной шкалы отображается текущий промежуток времени. В нижней части линии времени расположены и другие иконки, облегчающие работу с анимацией, но о них расскажем в следующих уроках. 2. Кадры и ключевые кадры 1 часть | 3:11
— полноэкранный режим
Создание простой Флеш анимации
В этом уроке Вы узнаете о кадрах и ключевых кадрах, а также научитесь создавать анимацию мигающего квадрата на сцене.
Ключевой кадр – это разновидность кадра, в котором происходит что-то новое, например, сейчас Вы видите нарисованный на сцене квадрат. Квадрат, как уже заметили, нарисован в первом кадре, который является ключевым. Об этом свидетельствует черный кружок, находящийся внутри данного кадра. Если сцена данного кадра пуста, то кружок будет отображаться белым с черной обводкой.
Теперь, создадим простую анимацию – мигание нарисованного квадрата. Для создания такой анимации, вы должны сначала задать себе вопрос «сколько данная анимация будет длиться по времени». Например, Вы хотите, чтобы данный квадрат оставался на сцене одну секунду, а затем исчезал. Одна секунда – это 24 кадра.
Это можно узнать из скорости перемещения воспроизводящей головки по временной шкале. В результате, нужно сделать так, чтобы квадрат оставался на сцене 24 кадра, а затем пропадал. Для этого, выделите 25-й кадр, в котором квадрат должен исчезнуть. О выделении свидетельствует, окрашенный в голубой цвет, прямоугольник.
В результате, 24-кадра, то есть одну секунду, квадрат находится на сцене, а 25-тый кадр становится пустым, т.к. квадрат в текущий момент удален.
Например, вы хотите, чтобы квадрата не было на сцене ровно одну минуту, для этого нужно расширить 25-й кадр на одну секунду, то есть до 48-го кадра. Выделите 48-й кадр, затем в верхнем меню выберите: вставка – временная шкала – кадр. В данном кадре ничего нового не происходит, а повторяется все, то же, что было в предыдущих кадрах.
В результате тестирования анимации видно как, квадрат одну секунду находится на сцене, затем исчезает ровно на одну секунду. 3. Кадры и ключевые кадры 2 часть | 2:01
— полноэкранный режим
Как сделать Флеш анимацию?
Теперь попробуем сделать анимацию посложнее. Например, нужно сделать так, чтобы квадрат, сначала находился в левой части сцены, потом в правой, а затем исчез. Сначала определите, какое количество времени квадрат должен находиться в левой части сцены. Например, полсекунды. Полсекунды – это 12 кадров, следовательно, нужно выделить 12й кадр, а затем вставить ключевой кадр. «Меню»-«вставка»-«временная шкала»-«ключевой кадр». После чего переместите квадрат в правую часть сцены. Затем выделите первый ключевой кадр и переместите квадрат в левую часть сцены.
В результате, полсекунды квадрат сначала располагается в левой части сцены, затем полсекунды – в правой части сцены, а потом целую секунду, отсутствует.
Если вдруг необходимо изменить положение квадрата на другое, то нужно поставить воспроизводящую головку между ключевыми кадрами, а затем поменять положение объекта. Поясним, что за первое положение квадрата, отвечает первый ключевой кадр, следовательно, чтобы изменить положение квадрата, нужно поставить воспроизводящую головку между первым и 12-тым кадром. Для изменения второго положения квадрата, воспроизводящую головку нужно поставить между 12-тым и 24-тым кадром.
При тестировании ролика, вы видите другую анимацию, поскольку положения квадрата поменяли. 4. Как сделать покадровую анимацию в Adobe Flash CS6 | 3:24
— полноэкранный режим
Как создать покадровую анимацию?
Бывают случаи, когда необходимо сделать анимацию движения губ персонажа или движения каких-либо объектов на сцене и для этого иногда удобно пользоваться покадровой анимацией, то есть объект анимировать покадрово. Например, стоит такая задача, как сделать покадровую анимацию объекта, взлетающего вверх и падающего вниз.
Пусть это будет, некий мяч, поэтому выберите инструмент «Овал» и нарисуйте на сцене мячик, удерживая клавишу «Шифт».
Итак, сначала удалим созданные кадры, для этого выделите все кадры кроме первого и нажмите комбинацию горячих клавиш «Шифт + ЭФ5». Затем заблокируем первый слой, создадим второй слой и нарисуем на сцене прямую линию с помощью инструмента «линия».
После чего выберите инструмент «выделение» и искривите линию вверх. Удерживая клавишу ALT, создадим две дополнительные точки и опустим их вниз. В результате должна получиться направляющая линия будущей анимации.
Теперь второй слой заблокируем, а первый разблокируем. Обратите внимание, чтобы привязка к объектам была включена. Чтобы привязать объект к направляющей линии, достаточно выделить его и центр объекта переместить на линию, тем самым центр объекта автоматически будет присоединяться к линии.
Затем выберите первый кадр и нажмите F6, после чего измените положение объекта, привязывая его к линии. Затем снова нажимаем F6 и снова меняем положение, и так до тех пор, пока объект не пройдет весь заданный путь. В результате получится более естественная анимация объекта. 5. Режим многослойной структуры | 3:36
— полноэкранный режим
Как анимировать объект в режиме многослойные структуры?
В этом уроке рассмотрим создание покадровой анимации в режиме многослойной структуры. Для этого сначала нужно нарисовать объект, который будете анимировать.
Пусть это будет тот же мячик или шарик, например. Задача такая, чтобы данный объект, взлетел, затем упал вниз.
Нарисовав объект, создадим второй слой, на котором нарисуем направляющую линию и искривим ее. После чего, второй слой заблокируем. Затем нужно определить, сколько кадров будет длиться анимация, например – 10 кадров. Значит, выделим 10-тый кадр на втором слое и нажмем F5. Тем самым продлили длительность направляющей линии.
Теперь, выделим 10-ый кадр на первом слое и вставим ключевой кадр, нажав F6. В результате получится два кадра. Начало и конец анимации. Находясь на 10-том кадре, с помощью инструмента привязки, переместим объект в конечную точку и привяжем объект к линии.
Теперь, выделив первый кадр, включите режим многослойной структуры, нажав на одноименную иконку внизу временной шкалы. Где расположена воспроизводящая головка, появились квадратные скобки, которые можно растянуть на всю линию времени.
Как видно, на сцене появилось два объекта с разной прозрачностью. Многослойная структура показывает предыдущее положение, текущее положение и последующие положения вашего объекта.
Итак, выберите пятый кадр и вставьте ключевой кадр, и в этом ключевом кадре поменяйте положение объекта, например, переместив его на середину пути. В результате, видим визуальную подсказку, где объект находился в предыдущем кадре, где находится сейчас, и где он будет находиться в следующем кадре. Данный режим облегчает создание покадровой анимации, потому что вы видите и представляете всю создаваемую анимацию.
Теперь проделайте ту же процедуру, которую уже сделали. Выберите средний кадр, между пятым и 10-тым, нажмите F6, чтобы вставить ключевой кадр, затем разместите объект между предыдущим и следующим объектом. Повторяйте данную процедуру многократно до тех пор, пока не создадите требуемую анимацию.
Также стоит отметить, что у данного режима есть его разновидность, которая активируется по соответствующей иконке внизу временной шкалы. «Контуры многослойной структуры» – в данном режиме показывается не прозрачная заливка размещаемых элементов, а их контуры. 6. Редактирование нескольких кадров | 1:07
— полноэкранный режим
Настройки анимации – редактирование нескольких кадров
В этом уроке рассмотрим настройку анимации – режим редактирования нескольких кадров. Продолжая создавать анимацию, допустим, стоит такая задача, чтобы переместить анимацию к нижнему краю сцены.
Обратите внимание, что, прежде всего, слой с направляющей линией должен быть удален, а режим многослойной структуры должен быть отключен. Затем включите режим редактирования нескольких кадров.
В результате, на сцене должны появиться все объекты. После чего, выделим все созданные кадры и отредактируем положение всех объектов на сцене, переместив их чуть ниже.
После редактирования положения объектов, обязательно отключите данный режим, иначе можно нарушить всю структуру созданной анимации.
В итоге, анимация объектов смещена к нижнему краю сцены. 7. Анимация движения | 1:52
— полноэкранный режим
Создание анимации движения
Поскольку, создание покадровой анимации является, достаточно, долгим процессом, в этом уроке рассмотрим создание анимации движения с помощью встроенных методов во Flash.
Сначала нарисуем на сцене объект, например звезду, с помощью инструмента «многоугольник». Затем выделим данный объект и, нажав правую кнопку мыши, выберем действие «создать анимацию движения».
Поскольку, можно анимировать только символы, программа спросит разрешение о том, чтобы нарисованный объект превратить в символ. Ответив утвердительно, анимация кадра автоматически расширится на 24 кадра, то есть на одну секунду. При этом воспроизводящая головка будет находиться на 24-том кадре. Теперь нужно указать конечное положение объекта, переместив его в нужную область на сцене.
Тем самым, автоматически будет создан вспомогательный путь движения, на котором отмечены точки положения объекта в определенном кадре.
Также стоит отметить, что при желании, Вы можете изменить траекторию движения объекта либо с помощью инструмента «выделение», либо с помощью инструмента «частичное выделение». Выбрав любой из инструментов, Вы сможете, как угодно, изменить траекторию движения объекта.
В результате тестирования ролика, видна только анимация движения объекта, а вспомогательный путь движения виден только при редактировании анимации. 8. Сглаживание анимации | 0:57
— полноэкранный режим
Затем выделим слой, на котором анимируется объект и раскроем панель «свойства». На данной панели присутствует такая опция, как « замедление ». Если значение выставить на «минус сто», то движение объекта будет плавно ускоряться. Если же в значении выставить цифру «сто», то движение объекта будет плавно замедляться.
Чтобы визуально просмотреть анимацию объекта, протестируем ролик, нажав клавиши CTRL + Enter 9. Создание собственного анимационного пути | 2:06
— полноэкранный режим
Как создать анимацию движения?
Теперь нарисуйте форму, которую будете анимировать. Затем, выделив полученную форму, нажмите правую кнопку мыши и выберите, уже знакомое действие, «создать анимацию движения».
Чтобы создать анимацию движения по тому контуру, который скопировали в буфер обмена, нужно переместить воспроизводящую головку между первым и конечным кадром, а затем нажать сочетание клавиш «CTRL + V».
В результате, анимация движения будет повторять тот контур, который Вы нарисовали. Если одной секунды для данной анимации Вам мало, то увеличьте ее. Для этого, наведите курсор мыши на последний кадр, затем нажав и удерживая левую кнопку мыши, переместите курсор вправо. Тем самым, расширив длительность анимации. Для просмотра итогового результата, протестируйте ролик. 10. Ориентация объекта по анимационному пути | 2:10
— полноэкранный режим
Анимация по траектории движения
В этом уроке рассмотрим создание анимации таким образом, чтобы ориентация объекта изменялась по анимационному пути.
Сначала нарисуем контур будущей траектории, а затем сглаживаем, копируем его в буфер обмена и удаляем со сцены. Подробно данные действия описывать не будем, поскольку, их рассматривали в предыдущих уроках.
Для этого, отобразим панель свойств. После чего выделим первый кадр, затем выберем инструмент свободного преобразования и выделим объект. Теперь нужно повернуть стрелку так, чтобы ее кончик смотрел в след своего движения. Потом нужно выделить последний кадр и повернуть стрелку в конец своего движения. А на панели свойств, отметить галочкой опцию «ориентировать по траектории».
В результате, программа автоматически создаст ключевые кадры, которые показывают новое положение объекта с учетом его вращения по траектории. 11. Анимация формы | 1:41
— полноэкранный режим
Создание анимация формы
Создать анимацию формы можно и другим способом. Для этого, нарисовав фигуру, выделите ее и нажмите правую кнопку мыши, а затем, выберите действие « создать анимацию формы ». В результате, ничего не изменится. Но стоит выбрать другой кадр, нажать клавишу «F6 или F7 и вставить новую форму или трансформировать существующую, то объект будет анимироваться, превращаясь из треугольника в новую форму. Данную операцию можно проделывать многократно, тем самым, добиваясь желаемых результатов. 12. Подсказки формы | 3:34
— полноэкранный режим
После чего, выделяем объект, нажимаем правую кнопку мыши и выбираем «разделить», чтобы превратить объект, в простую форму. Далее, выбираем 24-й кадр и нажимаем «F7». В пустом кадре, аналогичным образом, напишем латинскую букву «T». Для удобства, включим режим многослойной структуры, чтобы видеть то, что происходит на сцене.
Далее, кликаем правой кнопкой мыши между двумя ключевыми кадрами, выбираем «Создать анимацию формы». Чтобы увидеть, как происходит трансформация одного объекта в другой, расширим квадратные скобки режима многослойной структуры. Затем, данный режим можно отключить.
В результате, анимация происходит не совсем так, как хотелось бы, поэтому с помощью подсказок формы нужно дать программе понять, какой результат вам нужен.
Проделаем аналогичные действия и с правой частью букв.
В результате, видим именно тот результат, который нужно было достичь. 13. Анимация маски | 1:52
— полноэкранный режим
Как анимировать маску?
Для этого, создайте новый слой, и переименуйте его на слой «mask». Предыдущий слой переименуйте на слой «text» и временно заблокируйте. На слое «mask», нарисуйте яркую полоску с помощью инструмента «прямоугольник». Затем выделите полоску с помощью инструмента выделения и, нажав правую кнопку мыши, выберите «создать анимацию движения».
После чего, выберите инструмент свободного преобразования и увеличьте ширину полоски так, чтобы она закрыла собой текст. Потом выделите последний кадр на слое с текстом и нажмите F5, чтобы расшить последний кадр.
Для завершения создания анимации маски, выделите слой «mask», и, нажав правую кнопку мыши, выберите «Маска».
В результате, Вы видите, как текст, плавно появляется. Таким образом, Вы научились создавать анимацию маски.