ЗАДАНИЕ 1 ЦЕЛЬ УРОКА освоить методы анимации и основные возможности программы Macromedia Flash; создать мультфильм, в котором на весенней яблоне распускаются цветы, по небу перемещается солнышко, а по сложной траектории летит пчела
ОСНОВНЫЕ ПОНЯТИЯ:
ЛИНЕЙКА ВРЕМЕНИ задает последовательность кадров мультфильма
КАДР ПРОСТОЙ (<F5>) и КАДР КЛЮЧЕВОЙ(<F6>, здесь задаются опорные изображения);
СЛОЙ – служит для обеспечения одновременного развития разных событий;
КЛИП (символ, ролик) – хранящийся в библиотеке шаблон объекта, по которому можно создавать в сцене множество подобных экземпляров;
АНИМАЦИЯ ФОРМЫ – изменение формы или свойств объекта (не клипа!)
АНИМАЦИЯ ДВИЖЕНИЯ – изменение свойств экземпляров клипа, чаще всего – изменение положения клипа на сцене (движение)
ПОКАДРОВАЯ АНИМАЦИЯ-изображение меняется в каждом кадре (каждый кадр – ключевой)
ДВИЖЕНИЕ ПО ТРАЕКТОРИИ - клип двигается по заданной траектории (направляющей движения)
ВЫЗВАТЬ ФАЙЛ, содержащий пример выполнения заданий 1 и 2 C:\Kurs_M_Flash\Wesna.fla (файл имеет красную пиктограмму)
ПРОИГРАТЬ СЦЕНУ (+). После выполнения 2-х заданий, у вас будет подобный мультфильм. Щелчком по крестику (нижнему) закончить проигрывание и вернуться в редактор. Закрыть пример, открыть новый документ (МЕНЮ\Файл\Создать…)
НАСТРОИТЬ ИНТЕРФЕЙС ПРОГРАММЫ MACROMEDIA FLASH МX как на Рис 1(см. ОБЩИЕ ЗАМЕЧАНИЯ, п. 4).
ЗАДАТЬ ХАРАКТЕРИСТИКИ будущего мультфильма (МЕНЮ\Изменить\Документ…):
Ширина — 800 px (пикселей), Высота — 600 px
Фоновый цвет – голубой.
Частота кадров – 12 fps (За 1 сек на экране сменится 12 кадров)
Ok
УСТАНОВИТЬ МАСШТАБ КАДРА Показать кадр(см Рис 1 ОБЩИЕ ЗАМЕЧАНИЯ)
ПЕРЕИМЕНОВАТЬ СЛОЙ 1 в Дерево (Двойной щелчок по Слой 1 на линейке времени…)
НАРИСОВАТЬ ДЕРЕВО:(Только ствол и крупные ветви) Для этого:
Выбрать Карандаш, затем внизу, в разделе Опции щелкнуть по маленькому треугольнику (справа внизу) и выбрать Чернила (карандаш точно будет следовать за движением мыши), затем Цвет штриха - коричневый
Нарисовать ствол и крупные ветви дерева. Внизу линия дерева должна быть замкнута!!! (при неудачах можно отменять команды клавишами +)
Залить (Ведро краски) дерево коричневой краской (Цвет заливки). Если заливки не произошло, значит в контуре разрыв. Можно уменьшить влияние разрывов, включив Опции\Закрыть большие промежутки
СОЗДАТЬ СИМВОЛ (клип, ролик), изображающий маленькую веточку яблони, с листочками, но без цветов, (эту веточку мы будем многократно наносить на дерево). Для этого:
Вызвать МЕНЮ\Вставить\Новый символ…
Дать символу имя Ветка
Установить Поведение - Ролик
Ok
Нарисовать тонкой кистью веточку с 5-6 отростками и маленькими листиками (выбрать Кисть и коричневый Цвет заливки, выбрать самый маленький размер кисти (Опции\Размер кисти), изобразить веточку и листики (мазками зеленой кисти подходящего размера) и щелчком перейти к Сцене 1 (см Рис 2) Символ Ветка теперь хранится в Библиотеке
Рис 2. Имя сцены и имя символа
ДОБАВИТЬ МАЛЕНЬКИЕ ВЕТОЧКИ НА ДЕРЕВО(добавить символ (клип, ролик) в сцену): Для этого:
В Библиотеке выбрать символ Ветка и перетащить копию (экземпляр) ветки на сцену. Выбрав Указатель, мышью переместить ветку в нужное место.
Перетащить еще одну копию (экземпляр) ветки на сцену.
Изменить наклон ветки, выбрав инструмент Свободная трансформация, щелкнуть по ветке и, наведя курсор на угловой узелок (курсор изменит форму), повернуть ветку.
Покрыть дерево веточками, разворачивая ветки инструментом Свободная трансформация
Удалить лишние экземпляры ветки ( Щелкнуть при выделенном Указателе и нажать <Delete>)
СОЗДАТЬ СИМВОЛ (клип, ролик) для распускающегося цветка яблони.(Символ будет содержать уже не просто рисунок, но анимацию, в которой мы задаем начало и конец процесса распускания цветка, а для промежуточных кадров задаем А Н И М А Ц И Ю Ф О Р М Ы (SHAPE). Эти промежуточные кадры будут создаваться самой программой Macromedia Flash). Для этого:
Вызвать МЕНЮ\Вставить\Новый символ…
Дать символу имя Цветок
Установить Поведение - Ролик
Ok
Задать начало анимации. Для этого:
Выделить Ключевой кадр 1(он всегда присутствует на ЛИНЕЙКЕ ВРЕМЕНИ), щелкнув по нему мышью. Кадр на линейке станет черным
Нарисовать розовым Карандашом и залить градиентной заливкой бутон. Для этого:
нарисовать контур бутона(Карандаш\Опция\Размыть-линии будут сглажены), можно увеличить масштаб кадра
на панели Цветовой микшер установить градиентную заливку (Стиль заливки \Radial-см Рис 1), установить цвета градиента (щелкать по бегункам (см рис 3), а затем — выбирать цвет),
Рис 3 Радиальная заливка
залить бутон( Ведро краски).
Задать конец анимации. Для этого:
Выделить на ЛИНЕЙКЕ ВРЕМЕНИ кадр 30 (он станет черным) и установить Ключевой кадр 2()
В кадре 30 стереть (Ластик) бутон и нарисовать НА ТОМ ЖЕ МЕСТЕ конец анимации: простой цветок с 5 лепестками ( аналогично тому, как рисовался бутон, используя градиентную заливку). При проблемах с заливкой – Опции\Закрыть большие промежутки
.Задать А Н И М А Ц И Ю Ф О Р М Ы для промежуточных кадров. Для этого:
щелкнуть по любому простому кадру между двумя ключевыми кадрами
На панели Свойства ( находится ниже сцены, при необходимости раскрыть панель щелчком по треугольнику в углу панели) установить Пара\Shape .( Если все сделано правильно, то между первым и последним кадром должна появится непрерывная стрелка и зеленоватый фон).
Продлить «время жизни» распустившегося цветка, вставляя Простые кадры с 31 по 50-й (установить курсор в 31 кадре, нажимать 20 раз <F5>. При необходимости убрать Простой кадр - <Ctrl>+<F5>)
Перейти к Сцена 1. Клип(символ) Цветок готов и теперь хранится в Библиотеке
ДОБАВИТЬ ЦВЕТЫ НА ДЕРЕВО: (добавить символ (клип, ролик) в сцену):
В Библиотеке выбрать символ Цветок и мышью перетащить экземпляр цветка на дерево. Повторить многократно. При необходимости скорректировать цветок в библиотеке(щелкнув по клипу и в 30-м кадре изменив размер цветка) .Можно поворачивать бутоны при включенном инструменте Свободная трансформация
ПРОДЛИТЬ ЖИЗНЬ ЦВЕТУЩЕМУ ДЕРЕВУ, установив в слое Дерево в 50 кадре ключевой кадр(<F6>).
ПРОИГРАТЬ СЦЕНУ +. По умолчанию включен режим циклического проигрывания. Щелчком по крестику закончить проигрывание и вернуться в редактор.
СОЗДАТЬ СИМВОЛ (создать символ(клип, ролик)) солнце, перемещающееся на сцене слева направо(использовать А Н И М А Ц И Ю Д В И Ж Е Н И Я (MOTION)). Для этого:
Вставить в сцену новый слой (Вставить\Слой) – появится Слой 2
Переименовать Слой 2 в Ход солнца
Создать символ Солнце(аналогично созданию веточки яблони из п. 10)
Перейти к Сцена 1, выделить в слое Ход солнца (!!!) первый Ключевой кадр, перетащить из Библиотеки символ Солнце на левый край кадра.
Выделить в слое Ход солнца 50-й кадр и сделать его ключевым (<F6>) – солнце будет присутствовать на сцене 50/12 fps 4 сек
Выбрать инструмент Указатель и, ухватившись за Солнце, перетащить его на другой край кадра
Щелкнуть мыщью где-нибудь между 1 и 50 кадром в слое Солнце , внизу, на панели Свойства, установить Пара\Motion. Анимация движения готова, если между 1 и 2-м ключевым кадром появится непрерывная стрелка и сиреневый фон.
ПРОИГРАТЬ СЦЕНУ +>.
ИЗОБРАЗИТЬ ЛЕТЯЩУЮ ПЧЕЛУ.( Использовать П О К А Д Р О В У Ю А Н И М А Ц И Ю и Д В И Ж Е Н И Е П О Т Р А Е К Т О Р И И)
Вставить слой Полет пчелы;
Создать символ Пчела из двух кадров(увеличьте масштаб). В 1 Ключевом кадре крылья у пчелы опущены, а во втором ключевом кадре – подняты. Это П О К А Д Р О В А Я А Н И М А Ц И Я (серия нескольких подряд идущих ключевых кадров)
Вернуться в Сцена1, и, аналогично алгоритму движения солнца ,выделить первый ключевой кадр, вставить символ Пчела из библиотеки, сделать 50-кадр ключевым, перенести туда пчелу, щелкнуть между двумя кадрами, задать анимацию движения(ПАРА(MOTION))
Вернуться в Сцена1 и создать Д В И Ж Е Н И Е ПО Т Р А Е К Т О Р И И в слое Полет пчелы для символа Пчела. Для этого:
Выделить первый ключевой кадр в слое Полет пчелы (!!!)
Вставить Направляющую движения (МЕНЮ\Вставка\Направляющая движения) – появится слой Направляющая Полет пчелы, выделить в этом слое первый ключевой кадр(!!!), в котором Карандашом(сглаженным) нарисовать траекторию движения пчелы (при воспроизведении ролика этой линии не видно))
В слое Направляющая Полет пчелы выделить Ключевые кадр1(!!!). Увеличить масштаб. Переместить пчелу на начало направляющей(центр клипа – на направляющей). 50 кадр слоя Направляющая Полет пчелы сделать ключевым. Переместить пчелу на направляющую. Теперь пчела будет осуществлять Д В И Ж Е Н И Е ПО Т Р А Е К Т О Р И И
СОХРАНИТЬ АНИМАЦИЮ в файле на диске C:\Kurs_M_Flash\Wesna_ваша_фамилия.fla
Приложение 4
ЗАДАНИЕ 2
ЦЕЛЬ УРОКА закрепить материал задания 1, дополнить созданный мультфильм лужайкой, где в траве распускаются цветы, по траве бежит ежик.
ВЫЗВАТЬ ФАЙЛ с названием C:\Kurs_M_Flash\Wesna_ваша_фамилия.fla
НАРИСОВАТЬ ТРАВУ. Для этого:
вставить новый слой Трава
в слое Трава выбрать 1 Ключевой кадр, нарисовать траву, в 50-м кадре создать 2 Ключевой кадр
СОЗДАТЬ И ВСТАВИТЬ В СЦЕНУ РАСПУСКАЮЩИЕСЯ ЦВЕТЫ НА ТРАВЕ.
создать клип Цветок1 аналогично тому, как был создан цветок яблони
вставить экземпляры клипа в различные кадры слоя Цветы (предварительно делая их ключевыми(!!!))
ИЗОБРАЗИТЬ БЕГУЩЕГО ЕЖИКА
вставить слой Ежик
создать клип Еж , где еж находится на одном месте, но ноги у него – шевелятся. Для этого
В клипе Еж нарисовать только туловище ежа, а в новом клипе Ноги в 1 м ключевом кадре нарисовать 2 ножки ежика стоящие рядом, создать второй ключевой кадр , где поправить рисунок так, чтобы ножки сделали шаг ( покадровая анимация). Выйдя из клипа Ноги, следует добавить в клип Еж 2 экземпляра клипа Ноги
Теперь в слое Ежик заставить ежа перемещаться (анимация движения, аналогично перемещению солнца или пчелы)
можно поместить ежика ЗА траву, если на линейке времени мышью перетащит слой Ежик ниже слоя Трава
Приложение 5
|