Учебный курс Flash

Учебный курс
Примеры выполненных заданий
Подписка на рассылку
Форум
Чат
Скачать
Ресурсы, ссылки
Flash на практике
Translate into
RB2 Network

RB2 Network






выпуск 9

основы рисования и анимации часть-2


    Продолжим знакомство с приемами рисования и в конце выпуска нарисуем маленький мультфильм.

    Использование заливки имеет свои маленькие хитрости: впрочем, как все во Flash. Наверняка Вам знакома ситуация когда, рисуя что-либо в другом графическом редакторе, Вы решили закрасить, как Вам казалось, замкнутую область и вдруг закраска залила все вокруг? Да, критические дни бывают у всех :-) Не стоит отчаиваться! Если в других редакторах помогала только отмена предыдущего действия, то во Flash этого можно избежать, задав величину зазора Gap Size (см. пред. выпуски).
    Если Вы решили применить градиентную заливку, то можно несколько ускорить этот процесс. Как правило, после заливки, градиент требует дополнительной трансформации (изменения размера, положения и угла наклона). Если во время заливки, щелкнуть внутри замкнутой фигуры и провести диагональную черту, то градиент будет расположен под углом этой линии. При использовании радиальным градиентом, его центр будет там, где мы щелкнем мышкой.
    Но и это еще не все! А, что если в качестве заливки применить не цвет или градиент, а фотографию или рисунок? Нет ничего невозможного!
  • Достаточно импортировать изображение во Flash - File / Import [Ctrl+R],
  • а затем его разбить Modify / Break Apart [Ctrl+B].
  • Теперь "скопируем" изображение пипеткой (Dropper), и оно станет текущей заливкой, которой можно закрасить необходимую нам фигуру, а текущим инструментом автоматически станет Paint Bucket.
    Причем, заливка обладает всеми свойствами градиентов, т.е. мы можем изменять положение центра заливки, размер и наклон. Маркеры трансформации имеют разную форму. Квадратики служат для изменения размера, а кружочки для поворотов или диагональной трансформации.

    Вы конечно, обратили внимание на то, что любое изображение созданное во Flash выглядит очень четко (я не имею в виду крутость картинки :-) ). Как бы Вы не изменяли размеры и трансформацию, картинка будет нарисована строгими линиями. Но очень часто, при создании Web-дизайна необходимо добиться размытия контуров (надо же напустить тумана в глаза
заказчика :-) ).

    Размытие очень популярный в дизайне прием, дающий возможность придать большую глубину и позволяющий добиться профессионального вида Вашим работам. Данный эффект можно получить используя соответствующую градиентную заливку, но это не всегда возможно на практике, особенно есть фигура требующая "затуманивания" имеет сложные очертания. Гораздо эффективнее использовать встроенную команду размывки во Flash.
  • Выделим необходимую фигуру.
  • Откроем окно параметров размытия Modify / Curves / Soften Edges.
  • Указываем необходимые параметры: в поле Distance (расстояние) вводим расстояние размытия от границы фигуры, в поле Steps (шаги) мы задаем плавность размытия (не рекомендуется указывать число более 10), Direction (направление) выбираем одно из двух значений; Expand - наружу, Inset - внутрь.
    Поэкспериментируйте с разными значениями всех пунктов, но помните, Flash хранит не сам рисунок, а его математическое представление и на медленных компьютерах возможно торможение фильма при сложных расчетах.

    Если Вы внимательно читаете рассылку и выполнили последнее задание прошлого выпуска, то Вы уже знаете, как можно добавить новый слой в Timeline. Для тех, кто не понял, как это делается, подскажу Insert / Layer. Есть еще один способ создания слоя. Посмотрите внимательнее на два значка под названиями слоев: оба значка похожи на листик бумаги с загнутым уголком, на первом нарисован плюс (добавление нового слоя), на втором - волна с маленьким плюсиком (добавление направляющего слоя).
    Использование слоев дает большие возможности при создании фильма. Кроме того, что объекты, помещенные на разные слои можно накладывать или скрывать, что создает имитацию объема сцены, правильное применение слоев может заметно уменьшить размер готового файла. Любой объект, который предстоит анимировать нужно, помещать на собственный слой, так Вы значительно быстрее добьетесь нужных Вам эффектов и сократите загрузку процессора.
    Для каждого слоя старайтесь придумать соответствующее название. Для изменения имени слоя, щелкните дважды левой кнопкой мыши на названии слоя и введите новое.
    Слои можно перемещать относительно друг друга, выводя на первый план их содержимое, или наоборот скрывая его. Достаточно перетащить мышкой выбранный слой выше или ниже в списке слоев на Timeline.
    При выделении объектов, будет автоматически активизироваться слой, на котором расположен данный объект.
    Когда содержимое слоя доведено до совершенства и больше не требует редактирования, заблокируйте слой, щелкнув на точке соответствующей выбранному слою под изображением замка.
    А, если содержимое слоя мешает в работе - отключите его, щелкнув на этот раз под изображением глаза на выбранном слое.
    Но это все было быстрое задание параметров. Если же Вы хотите почувствовать полную власть над слоем, тогда добро пожаловать Layer Properties - щелкнем правой кнопкой мыши и выберем Properties, или другой способ (для любителей бродить по меню) Modify / Layer.
Значения пунктов Layer Properties:
Слой
Name - имя слоя,
Show - показывать слой,
Lock - блокировка.
Тип
Normal - обычный слой,
Guide - направляющий. Должен содержать траекторию движения объекта,
Guided - направляемый. Напрямую связан с предыдущим слоем и должен содержать те самые объекты, которые необходимо переместить.
Mask - маска. - "Да, я шут я циркач! Так, что же? Пусть меня так зовут вельможи. Всегда быть в маске - судьба моя…" :-) Ой! Я снова отвлекся. Прошу прощения, но Вы читаете рассылку безнадежного почитателя оперетты. Если серьезно, то данный пункт задает режим маскирования объектов расположенных на подчиненных ему слоях.
Masked - маскированный слой.
Следует заметить, что подчиненные слои должны находится, непосредственно под управляющими слоями.
Outline Color - цвет контура объектов слоя (для идентификации объектов на разных слоях).
Layer Height - задает высоту слоя (возможные значения - 100%, 200%, 300%).
    Как пользоваться всеми видами слоев Вы узнаете, получая выпуски рассылки, а сейчас продолжим изучение основ анимации начатое в прошлый раз.
    Мы с Вами уже умеем двигать объект по прямой, но этого явно недостаточно для настоящей анимации. Давайте, нарисуем маленький мультик, используя все знания полученные сегодня.
    Пусть это будет не просто мультик, а настоящий боевик! :-) Дадим ему условное название - "Выстрел из Царь-пушки".
  • На одном слое нарисуем пушку,
  • выберем любой кадр на Timeline (например 20)
  • и создадим ключевой кадр (см. прошлый выпуск), задав тем самым длительность фильма.
  • Вернемся на первый кадр, щелкнув на соответствующий прямоугольник или передвинув полоску на шкале кадров.
  • Добавим новый слой, на котором нарисуем снаряд.
  • Выделим снаряд и перетащим его на изображение пушки. Перемещать объекты во Flash можно не только мышкой, но и стрелками клавиатуры. Причем, за одно нажатие клавиши выделенный объект переместится на один пиксель, а если при нажатии на клавишу удерживать Shift, то сразу на восемь. Как позиционировать объект с точность до пикселя, читайте в предыдущем выпуске.
    Конечно то, что мы видим на экране неправильно. Ведь снаряд должен располагаться в самой пушке.
  • Поменяйте расположение слоев, и все встанет на свои места.
  • Что бы изображение пушки не мешало при анимации, отключите режим отображения слоя.
  • Проверьте, что текущим является слой со снарядом, а сам снаряд выделен.
  • Выделите первый кадр данного слоя на Timeline.
  • Включите режим анимации Insert / Create Motion Tween.
  • Теперь выделите заключительный кадр фильма (например 20) на данном слое.
  • И вставьте ключевой кадр Insert / Keyframe [F6].
  • Переместите снаряд в то место, куда он должен упасть.
  • Осталось, только указать по какой траектории будет лететь наш снаряд.
  • Вставим управляющий слой Insert / Motion Guide или просто щелкните на соответствующем значке на панели слоев.
  • Появится новый слой, который и является управляющим.
  • Возьмем карандаш и нарисуем в нем траекторию движения снаряда.
  • Обратите внимание, что линия траектории будет видна, только пока мы работаем над фильмом.
  • При необходимости совместим начало и конец траектории с положением снаряда в первом и последнем кадрах.
  • Если все сделано правильно, то можно посмотреть готовый фильм Control / Test Movie, не забыв включить режим отображения слоя с пушкой.
    Попробуйте усовершенствовать фильм, добавив взрыв снаряда при падении. Небольшая подсказка - используйте новые ключевые кадры и слои.


Павел Г.Лапин
E-mail: murmik@mail.ru
Россия Мурманск



Всплыть