1039379
столько раз учителя, ученики и родители
посетили сайт «Инфоурок»
за прошедшие 24 часа
Добавить материал и получить бесплатное
свидетельство о публикации
в СМИ №ФС77-60625 от 20.01.2015
ИнфоурокИнформатикаКонспектыВидеоурок + конспект по информатике по теме «Покадровая анимация в Macromedia Flash»

Видеоурок + конспект по информатике по теме «Покадровая анимация в Macromedia Flash»

Выберите документ из архива для просмотра:

Выбранный для просмотра документ План урока.doc

библиотека
материалов

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

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


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


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

План урока:


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

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

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

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

  5. Домашнее задание. Подведение итогов.


Ход урока:

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Ответ: Gimp, Photoshop


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

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

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

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

hello_html_2781e970.jpg

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

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

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

  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 - уроки hello_html_30fa36ae.png

Выбранный для просмотра документ Практическая работа 1. Покадровая анимация Титры.doc

библиотека
материалов

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

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

hello_html_5ef6776a.png

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

hello_html_m347f3f9a.png

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

hello_html_m16de7dad.png

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

hello_html_2a2e2d9c.png

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

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

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

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

Выбранный для просмотра документ Практическая работа 2. Покадровая анимация шарик.doc

библиотека
материалов

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

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

hello_html_57125a22.png

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

hello_html_17793fc9.png

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

hello_html_a3e7ed5.png

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

hello_html_m7103eb5f.png

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

hello_html_63ff79ea.png



аhello_html_m4caea6c9.gifктивируйте кнопку Скин hello_html_4999bb1d.png

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

hello_html_6b8bddb7.png

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

hello_html_m1f4047ca.png

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

hello_html_m46572acf.png

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

hello_html_5a536ba3.png

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



hello_html_5ef597c0.png

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



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

"Описание материала:

В представленном материале учеников знакомят с основами работы в векторном графическом редакторе Macromedia 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.Теперь можно добавить титры к вашему анимационному ролику, используя премы, которыми вы овладели на предыдущем уроке «см. Практический урок «Анимация текста»

Общая информация

Вам будут интересны эти курсы:

Курс повышения квалификации «Информационные технологии в деятельности учителя физики»
Курс повышения квалификации «Методика преподавания информатики в начальных классах»
Курс профессиональной переподготовки «Информатика: теория и методика преподавания в образовательной организации»
Курс повышения квалификации «Сетевые и дистанционные (электронные) формы обучения в условиях реализации ФГОС по ТОП-50»
Курс профессиональной переподготовки «Информационные технологии в профессиональной деятельности: теория и методика преподавания в образовательной организации»
Курс повышения квалификации «Специфика преподавания информатики в начальных классах с учетом ФГОС НОО»
Курс повышения квалификации «Введение в программирование на языке С (СИ)»
Курс профессиональной переподготовки «Управление в сфере информационных технологий в образовательной организации»
Курс повышения квалификации «Современные тенденции цифровизации образования»
Курс повышения квалификации «Современные языки программирования интегрированной оболочки Microsoft Visual Studio C# NET., C++. NET, VB.NET. с использованием структурного и объектно-ориентированного методов разработки корпоративных систем»
Курс повышения квалификации «Применение интерактивных образовательных платформ на примере платформы Moodle»
Оставьте свой комментарий
Авторизуйтесь, чтобы задавать вопросы.
Включите уведомления прямо сейчас и мы сразу сообщим Вам о важных новостях. Не волнуйтесь, мы будем отправлять только самое главное.