Програмный пакет
Macromedia Flash (в дальнейшем просто Flash) - мощый инструмент, облегчающий
создание анимированных WEB-страничек. Модель графики в Flash представляет
собой комбинацию растровой и векторной графики, соединяя в себе положительные
стороны обоих графических представлений.
Основной элемент,
с помощью которого создается анимация - временная линейка (Time Line).
В отличие от мультипликации, при которой приходится рисовать все кадры,
отражающие процесс зменения или длижения, Flash позволяет рисовать только
ключевые кадры (Keyframe), а изображение в кадрах, находящихся между ключевыми,
выполняется программно, что, естественно, облегчает работу.
Анимация во Flash
представлена двумя видами: анимация типа Shape и анимация типа Motion.
Принципиальное отличие между этими типами анимации состоит в том, что
первый тип работает с графикой как с набором графических примитивов (линий,
дуг, окружностей, прямоугольников, заливок и т.д.), а второй тип работает
только со сгруппированными объектами, "символами".
На этой страничке
я хочу разместить несколько простейших примеров создания Flash - анимации
с описанием выполняемых действий. Мне кажется, что выполнение простейших
упражнений с описаниями действий эффективнее, чем штудирование учебника
или самоучителя. Конечно, в дальнейшем, для более подробного изучения
Flash вам придется воспользоваться специальной литературой. Единственное,
хотелось бы отметить, что для того, чтобы выполнить эти задания, вам необходимо
иметь элементарные навыки работы в векторных и растровых графических редакторах.
Изменение
формы и цвета объекта
1. Нарисовать
квадрат. Это будет начальное изображение анимации.
2. При желании
его можно выделить
и использовать любой другой цвет заливки .
3.
Щелкнуть левой кнопкой мыши, например, на 25-ом кадре временной
диаграммы.
4.
Вставить ключевой кадр Insert - keyframe или нажать F6
5.
Вы находитесь во втором ключевом кадре .
Удалите прямоугольник (выделить его и нажать Delet).
6.
Нарисуйте круг другого цвета. Это будет конечное изображение анимации.
7.
Чтобы обеспечить плавное превращение квадрата в круг и смену цветов,
правой кнопкой мыши щелкните по серой полосе временной диаграммы
между первым и вторым ключевым кадром. Появится контекстное меню,
в котором надо выбрать пункт Properties....
8.
В появившемся окне выбрать закладку Tweening, а затем в раскрывающемся
списке пункт Snape.
9.
Для просмотра анимации нажмите клавишу Enter (для просмотра в полноэкранном
режиме ctrl+Enter.
1. Из библиотеки
Labries выбрать Movie clips. Из появившейся библиотечки изображений
выбирайте понравившееся. Не отпуская левую кнопку мыши, перетащить
его на рабочее поле. Вы также можете вставить и любое другой свой
рисунок.
2. Добавить
второй ключевой кадр (п. 3 и 4 предыдущего задания).
3. Создать
второй слой с траекторией, нажав на кнопку ,
расположенную под названиями слоев. Появился второй слой c траекторией
Guide: Layer1.
4. Нажать левой
клавишей мышки на первый кадр этого слоя.
5. Карандашом
нарисовать траекторию, по которой будет двигаться объект.
6. Выбрать
и нажать
на объект. Объект за крестик в первом кадре перетащить на начало
траектории (при перетаскивании крестик на объекте трансформируется
в кружок), а во втором ключевом кадре на конец траектории.
7. Задать анимацию:
правой кнопкой мыши щелкнуть в первом слое между 1 и 2 ключевыми
кадрами. Выбрать пункт меню Properties,,, , вкладку Tweening и в
раскрывающемся списке выбрать анимацию Motion. Поставить галочку
напротив пункта orient to path direction.
8. Для просмотра
анимации нажмите клавишу Enter (для просмотра в полноэкранном режиме
ctrl+Enter.
Если вы хотите,
чтобы изображение перемещалось на фоне чего-либо, то можно создать
новые слои, воспользовавшись кнопкой ,
расположенной под названиями слоев. Так, например, в слое Layer3
я рисую водоросли, и располагаю его (перетаскиваю левой кнопкой
мыши) выше слоя Layer1, содержащего изображение рыбки. Это делается
для того, чтобы рыбка "плавала" за водорослями в аквариуме.
А слой Layer4 - я делаю самым нижним, и рисую в нем голубой квадрат
2.Добавить
второй ключевой кадр (п. 3 и 4 первого задания).
3. Во втором
ключевом кадре удалить "1" и вместо нее написать "2".
4. Выделить
"2" и выполнить команду меню Modify / Break Apart (разбить
на части).
5. Зайти в
первый ключевой кадр (щелкнуть по нему левой кнопкой мыши на временной
диаграмме) и выполнить такую же команду для "1".
6. Задать анимацию:
правой кнопкой мыши щелкнуть на временной диаграмме между 1 и 2
ключевыми кадрами. Выбрать пункт меню Properties,,, , вкладку Tweening
и в раскрывающемся списке выбрать анимацию Shape.
7. Для полноэкранного
просмотра нажмите ctrl + Enter.
Если
вас не устраивает получившаяся анимация в предыдущем задании, то
выполните следующие действия: Modify / Transform / Add Shape Hint.
Этим вы добавляете узловые точки, вокруг которых и будет происходить
анимация, в нашем случае, изменение формы цифры.
В
результате выполнения команды появляется красная точка с буквой
А. Повторите команду. Вы получили 2 узловые точки. Теперь расположите
их на цифре, например так:
Повторите
эти действия для "2", перейдя во второй ключевой кадр.
Просмотрите
получившуюся анимацию. Обратите внимание, вокруг каких точек происходит
изменение формы.
2. Добавить
второй ключевой кадр (п. 3 и 4 первого задания).
3. Выбрать
цвет заливки.
4. Залить градиентной
заливкой фигуру. Причем в первом ключевом кадре фигуру заливаем
градиентом с одной стороны (например, с права на лево), а во втором
ключевом кадре с другой стороны (например, с лева на право).
5. Задать анимацию:
правой кнопкой мыши щелкнуть на временной диаграмме между 1 и 2
ключевыми кадрами. Выбрать пункт меню Properties,,, , вкладку Tweening
и в раскрывающемся списке выбрать анимацию Shape.
6. Вместе с
изменением градиентной заливки можно изменять и положение (координаты
объекта), а также его форму и размер:
и использовать любой другой цвет заливки 
.
.
,
расположенную под названиями слоев. Появился второй слой c траекторией
Guide: Layer1.
,
расположенной под названиями слоев. Так, например, в слое Layer3
я рисую водоросли, и располагаю его (перетаскиваю левой кнопкой
мыши) выше слоя Layer1, содержащего изображение рыбки. Это делается
для того, чтобы рыбка "плавала" за водорослями в аквариуме.
А слой Layer4 - я делаю самым нижним, и рисую в нем голубой квадрат
.
