Использование временной шкалы

Временная шкала отображает общую структуру документа Flash и позволяет управлять контентом. Она содержит слои, кадры и сцены, из которых состоит документ Flash. Слои указываются в левой части окна временной шкалы, а кадры каждого слоя размещаются в ряду, расположенном справа от соответствующего слоя. Над рядами кадров отображаются номера кадров. В нижней части временной шкалы находится строка состояния, содержащая индикаторы текущего кадра, текущей частоты кадров и общего времени, прошедшего с начала ролика до текущего кадра. Вы можете изменить размеры ячеек кадров или отображать кадры в виде окрашенных ячеек. Кроме того, вы можете просматривать в ячейке кадра уменьшенное изображение его содержимого, что бывает удобным при просмотре анимации.

Задание 1.

Выберите на панели инструментов (Tools) инструмент Линия (line tool) или нажмите на клавишу N.

В левом нижнем углу, начертите произвольную линию.

Подведите указатель мыши непосредственно к линии, кликните правой кнопкой. В выпадающем меню выберите пункт Граница (Envelope). Или в главном меню выберите Изменить – Трансформировать – Граница (Modify > Transform > Envelope).

Теперь вы можете изгибать линию и получить любую форму этой фигуры.

Для преобразований линий, из которых состоит фигура, и свободных линий используйте инструмент Subselection (Подвыделение). Быстрая клавиша A. Необходимо один раз кликнуть по линии. Теперь, передвигая узелки и меняя угол наклона осевых линий, вы сможете как угодно исказить линию.

После манипуляций с линией получилась вот такая фигура.

Первый кадр готов, для того, чтобы продолжить создание анимации нам необходимо добавить ещё кадры. Кликните по временной панели, следующий кадр станет синего цвета. Кликните по правой кнопке мыши и в выпадающем меню выберите Convert to Keyframes (Преобразовать в клавиатуры или ключевой кадр). После данных операций 2 кадр, также как и первый будет обозначаться чёрным кругом.

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

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

Подведите указатель мыши непосредственно к линии, кликните правой кнопкой. В выпадающем меню выберите пункт Free Transform(Свободная трансформация). Теперь вы можете изгибать линию и получить любую форму этой фигуры.

Пошагово нарисуйте дерево постепенно добавляя ключевые кадры

Для изготовления тучки на небе, мы будем использовать инструмент Rectangle Tool (Прямоугольник). ¶ Flash MX 2004 предоставляет возможность рисования прямоугольника с закруглёнными краями, для этого нужно дважды кликнуть по прямоугольнику, на панели Tools. В диалоговом окне Rectangle Settings нужно указать радиус окружности, которая будет сглаживать края прямоугольника.

¶¶

После выполнения всех действий, в правом углу холста начертите прямоугольник, прямоугольник получится залитым. Так как нам не нужна эта заливка, то нужно её удалить.
Для удаления цветной области нам необходимо выбрать инструмент Selection Tool (Выделение) и кликнуть по области заливки. Далее кликнуть правой кнопкой и в выпадающем меню выбрать Cut (Вырезать), либо после выделения щёлкнуть по клавише Delete.
Для преобразования прямоугольника в тучку нам необходимо каждую из 4 сторон прямоугольника исказить отдельно. Для этого используйте следующую инструкцию:
Подведите указатель мыши непосредственно к линии, кликните правой кнопкой. В выпадающем меню выберите пункт Граница.

Солнышко и лучики сделать гораздо проще, поэтому для самопроверки я предлагаю вам сделать это самим.

¶¶

Для наложения цветного есть инструмент Brush Tool (кисть), на панели инструментов Tools. После выбора инструмента ниже панели инструментов появляется раздел Options. В выпадающих списках можно выбрать размер и тип линии. В первом выпадающем списке мы выбираем размер линии, а во втором соответственно тип линии. Далее на каждом кадре добавляем по одному движению кисти, чтобы создать эффект постепенной прорисовки картинки. ¶   ¶ ¶¶  
Несколько произвольных штрихов нанесём и на тучку, но чтобы закрасить всю поверхность данной фигуры неудобно использовать кисть. Для этого мы будем использовать заливку. Во Flash есть инструмент Paint Bucket tool (Заливка) на панели инструментов Tools. После выбора данного инструмента необходимо кликнуть по области заливки.
       

Теперь нам необходимо сделать зелёным цветом крону дерева. Сделать заливку, как облако, у нас не получится, так как оно было сформировано из замкнутой фигуры. А крону дерева ограничивает несколько линий. Возможно закрасить кистью, но это будет не очень удобно.

Flash MX 2004 предоставляет возможность создания нескольких слоев. Поэтому на задний план добавим новый слой и закрасим его в области кроны дерева.

Для создания нового слоя выполните следующие действия:

1. Выделите тот слой сцены документа, непосредственно перед которым должен находиться новый слой.

2. Если создаётся слой обычного типа, выполните одно из следующих действий:

- щёлкните на кнопке Insert Layer (Вставить слой), первой слева внизу диспетчера слоёв;

- выполните команду Insert =>Timeline => Layer (Вставить =>Временная диаграмма =>Слой) основного меню;

- выполните команду Insert Layer контекстного меню выделенного слоя.

Для перетаскивания слоя мышью выполните следующие действия:

1. Поместите указатель в свободное место строки перемещаемого слоя и нажмите кнопку мыши.

2. Перетащите указатель в то место диспетчера слоёв, где должен находиться данный слой (между другими слоями документа или в некоторую папку слоёв). Это место индицируется двойной разделительной линией, появляющейся между слоями, или затемнением значка папки в строке папки слоёв. Как только такая линия или затенение папки появится в нужном месте диспетчера, отпустите кнопку мыши. Если отображалась двойная линия, то выбранный слой будет вставлен в место её расположения, а если произошло затенение папки, то слой переместится в данную папку и разместится в самом её верху.

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

 

На каждом последующем пикселе свободно трансформируем рамку. В конце можно сделать медленное движение рамки. Для этого Flash MX 2004 и придумано - для облегчения создания анимации.

Создаём ключевой кадр. Далее, нажав клавишу Alt, левой кнопкой мыши перетаскиваем ключевой кадр на 10 кадров и отпускаем. При переносе к значку курсора будет прибавлен небольшой знак +. Далее модифицируем перенесённый кадр.

Для создания эффекта анимации, удерживая клавишу Ctrl, обводим область между двумя кадрами, где и будет происходить анимация, эти два кадра тоже обводятся. После обводки времени анимации, нажимаем на правую кнопку мыши и в выпадающем меню выбираем действие. Create Motion Tween (Создать промежуточное движение).

Теперь между двумя кадрами автоматически просчитаются промежуточные изменения картинки.

Осталось просмотреть. Для этого зайдите в меню Управление – Проиграть.

Задание 2

Создание плывущего корабля.

Для прорисовки прямых линий необходимо использовать инструмент line tool (Линия). Линиями мы прорисовываем корпус и мачту, на которой будет расположен парус.

Чтобы создать парус, можно использовать инструмент Oval Tool (Овал). После создания овала необходимой нам формы, нужно изогнуть левую сторону овала в ту же сторону, что и правую. Для создания силуэта паруса выберите инструмент Selection Tool (Выделение) и подведите его к левой стороне овала. Курсор мыши - стрелка с овальной линией, теперь вы можете придать левой линии необходимый изгиб. Эту же манипуляцию можно произвести, воспользовавшись командой Граница в дополнительном меню.

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

Раскрасьте корабль.

Для движения корабля по волнам можно сделать 5 ключевых кадров на каждом 10 кадре, т.е 10, 20, 30, 40, 50 (ПКМ – Вставить ключевой кадр). Теперь можно между этими кадрами создавать ещё ключевые кадры и изменять положение всего корабля. Передвигать корабль то вверх, то вниз. Для эффекта плывущего корабля не рекомендую менять 1, 10, 20, 30, 40, 50 кадры. После создания всех ключевых кадров выделите все кадры с 1 по 50 .

Для создания волн, неба и солнца, необходимо создавать новые слои. И в каждом слое располагать отдельный элемент, такой приём облегчает создание анимации, например, возможен просмотр анимации без конкретного слоя, достаточно его выключить. На данной иллюстрации выключен слой Layer 6.

Солнце и небо создаётся из простых геометрических фигур, границу фигуры я рекомендую удалить. Слой с небом не имеет анимации, а вот для анимации солнца создаём два ключевых кадра 1 и 50. В 50-м кадре немного изменяем расположение солнца и создаём анимацию.

Для создания волн искажаем верхнюю грань прямоугольника, границу прямоугольника необходимо удалить. Создаём ключевые кадры постепенно, так как волна полностью передвигается, и нам не нужно, что бы она вернулась в первоначальное положение. Я создал лишь несколько ключевых кадров: обязательный первый, промежуточный кадр или 2 промежуточных, и конечный кадр - 50.

Запустите просмотр меню Управление – Проиграть



4.php">23
  • 24
  • 25
  • 26
  • Далее ⇒