Урок в векторном графическом редакторе «Macromedia Flash»

Тема: Практическая работа: «Покадровая анимация ».

Цель: знакомство с программой Macromedia Flash, создание простейшего анимационного ролика; применение знаний полученных при работе с растровым графическим редактором в изучении векторного редактора.

Оборудование к уроку: конспект урока, компьютерный класс с установленной программой Macromedia Flash, практические задания.

План урока:

1. Новый материал.
2. Повторение
3. Новый материал.
4. Практическая  работа.
5. Домашнее задание. Подведение итогов.

Ход урока:

1. Новый материал

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

2. Повторение.

     Как создается изображение в векторной графике?

     Ответ: из объектов, называемых примитивами (точка, линия, окружность, прямоугольник и т.д.)

     Как окрашивается  объект в векторной графике?

Ответ: окрашивается вся фигура целиком

     Как создается изображение в растровой графике?

Ответ: из точек (пикселей) различного цвета

     Как окрашивается объект в растровой графике?

Ответ: Окрашивается каждый пиксель

     Что можно делать в растровом графическом редакторе?

Ответ: Можно изменять цвет каждого пикселя; повышать яркость и контрастность; удалять мелкие дефекты; применять эффекты.

     Что можно делать в векторном графическом редакторе?

Ответ: Можно изменять размеры, цвет, прозрачность графического примитива; перемещать его; накладывать один примитив на другой

     Где применяется растровые графические редакторы?

Ответ: там, где необходимо высокое качество. Например: в цифровой фотографии, полиграфии.

     Где применяется векторные графические редакторы?

Ответ: там, где необходимы четкие линии, чистые цвета. Например: в черчении, картографии.

     Какие векторные редакторы вы знаете?

Ответ: приложение «Живая математика», «Компас»

     Какие растровые  редакторы вы знаете?

Ответ: Gimp, Photoshop

3. Новый материал.

Работая в Gimp мы создавали статичные графические объекты. Сегодня мы попробуем создать анимационный фильм, в котором наши «артисты» будут двигаться и с ними будут происходить удивительные вещи. Мы будем создавать анимацию.

Анимация в Macromedia Flash - это последовательность изображений (кадров), при последовательном просмотре которых возникает иллюзия движения или изменения свойств объекта. Покадровая анимация – это одна из техник анимации, когда прорисовывается каждый кадр. Покадровая анимация во флеше полностью состоит из ключевых кадров, как на рисунке ниже.

При покадровой анимации каждый кадр рисуется заново, и если длительность анимации составляет 1000 кадров, то нужно отрисовать 1000 уникальных рисунков, последовательное проигрывание которых визуализирует  движение. По сути, это та же рисованная анимация, когда каждый кадр рисуют на отдельном листе, а затем фотографируют. Значит нам надо создать все ключевые кадры. В этих кадрах будет что-то происходить. Что бы было более понятно рассмотрим Временную шкалу

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

Алгоритм действий следующий

Создание покадровой анимации

1. Сделайте изображение в первом кадре.
2. Выберите кадр, с которого начнется анимация. Сделайте его ключевым с с помощью клика правой клавишей мыши Создать ключевой кадр.
3. Измените изображение в новом ключевом кадре.
4. Продолжайте добавлять новые ключевые кадры и изменять их содержимое до тех пор, пока анимация не будет готова.
5. Протестируйте Вашу покадровую анимацию, нажав Enter или выбрав в меню Управление/Воспроизвести.

4. Практическая работа.

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

Учитель раздает практические задания каждому ученику и они самостоятельно выполняют задания (Приложение 1, приложение 2)

Домашнее задание.

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

Подведение итогов.

Выставление оценок за работу на уроке.

1.      Угринович п. 7.2.3 стр 316,

2.      записи сделанные на уроке.                                                                                                                                            

Литература:

1. Угринович Н.Д. Информатика и информационные технологии. Учебник для 10-11 классов. – М.:БИНОМ. Лаборатория знаний, 2003.
2. Л. Залогова Практикум по компьютерной графике . – М.:БИНОМ. Лаборатория базовых знаний, 2001.
3. Д. М. Баренбойм  Компьютерная графика для гуманитариев, - Серия обучающих программ «Компьютер для гуманитариев» - «НОВЫЙ ДИСК»
4. Угринович Н.Д., Л. Босова, Н. Михайлов Практикум по информатике и информационным технологиям. Учебник для 10-11 классов. – М.:БИНОМ. Лаборатория знаний, 2004.

Интернет ресурсы:

http://gimpmania.ru/-сайт с уроками в Gimp

http://flash.demiart.ru/book/Flash_MX/ - иллюстрированный учебник по Macromedia Flash

http://www.compress.ru/lesson.aspx - уроки в Macromedia Flash

http://camil-v.narod.ru/osvita/flash  - уроки

Урок в Macromedia Flash «Анимация текста».

1.Создать новый файл с параметрами, как на рисунке.

2.Выбрать инструмент Текст, с параметрами шрифта

3.Выделите текстовое поле за пределами окна фильма (для того, чтобы титры появлялись в окне фильма постепенно) и наберите текст
« Мгновения шарика»
Режиссер ФиО
Киностудия

С помощью инструмента Свободная трансформация уменьшите размеры титров.
4.Создайте 10 ключевой кадр (Выделите 10 кадр и нажмите левую кнопку мыши и выберите Вставить ключевой кадр или нажмите F6)
5. Поместите титры на 10 кадр и с помощью инструмента Свободная Трансформация увеличьте размеры текста
6. Установите курсор на первый кадр, нажмите правую кнопку мыши и выберите из списка Создать движение по пути.

7. Продублируйте этот фрейм 5 раз (для того, чтобы титры были на экране и мы успели бы их прочитать)

8. Создайте 20 ключевой кадр и поместите титры за пределами окна фильма, при этом уменьшите размеры текста с помощью Свободной трансформации.
9.Создайте в 20 кадре движение по пути (см. пункт 6)
10. Проиграйте анимацию текста (Нажмите Enter или Ctrl+Enter).

Можно переходить к созданию покадровой анимации фильма о шарике (Практическая работа 2)

 По окончанию сохраните ролик в своей папке под именем «Мгновения шарика» в формате  .fla

Практическая работа «Покадровая анимация в Macromedia Flash»

1.Откройте программу Macromedia Flash
2.Создайте новый файл (Файл/Создать  550 пк.- 400 пк., для изменения параметров Изменить/Документ)
3.Переменуйте первый слой в слой «Стол»
4.Используя инструмент Прямоугольник нарисуйте стол

5.Преобразуйте 30 кадр в ключевой.

6.Создайте новый слой и переименуйте его в «шар»

7.На этом слое нарисуйте шар (заливка радиальная, без контура)

8.Преобрзуйте 2 кадр в Ключевой

9.Выделите Шар и переместите его по поверхности стола на один радиус шара, для удобства

активируйте кнопку Скин

10. Преобразуя кадры в Ключевые, перемещайте Шар до конца стола.

11.Аналогично поступайте с движением Шара вниз

12.Создайте движение шарика вверх

13.Создайте движение шарика вниз

14.Разбейте шарик. Сохраните файл в своей папке под именем Шарик.fla

15.Теперь можно добавить титры к вашему анимационному ролику, используя премы, которыми вы овладели на предыдущем уроке «см. Практический урок «Анимация текста»