Открытый урок "Растровая и векторная анимация" для 9 класса
план-конспект урока по информатике и икт (9 класс) на тему

УРОК №10 для 9 класса

ТЕМА: Растровая и векторная анимация

Цели: 

Образовательная:

• познакомить с различными видами анимации;
• повторить и закрепить навыки работы с основными инструментами анимации в PowerPoint;
• научить применять различные приемы эффектов для создания анимации по сюжету.

Развивающая:

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

Воспитательная:

• воспитывать интерес к предмету, аккуратность, внимательность, дисциплинированность, умение работать в команде.

Опорные термины:

Анимация, эффекты анимации, GIF-анимация, GIF-файл, Flash-анимация, ключевой кадр.

Технические средства обучения:

ПК учителя и учеников, мультимедиапроектор, экран.

Программное обеспечение и материалы к уроку:

ОС Windows XP/7, Microsoft PowerPoint 2003, программа GIF-аниматор, программа Adobe Flаsh, презентация «Урок №10», карточки.

Тип урока:

изучение и первичное закрепление знаний.

Применяемые технологии:

ИТ, личностно-ориентированный подход, здоровьесберегающая, игровая.

Методы:

объяснительно-иллюстративный, практика, игра.

Методическая литература:

Учебник Информатика и ИКТ для 9 кл./ Н.Д. Угринович - М: БИНОМ, 2012.

Ход урока

1. Организационный момент (3 мин)

2. Проверка знаний по теме «Редактирование изображений и рисунков» (5 мин)

3. Постановка цели урока (2 мин)

4. Объяснение нового материала (12 мин)

5. Закрепление и рефлексия (20 мин)

6. Домашнее задание (3 мин)

1. Организационный момент

Ученики сидят за партами. ПК на рабочих местах уже включены для экономии времени.

Приветствие учащихся. Проверка наличия отсутствующих в классе. Раздача карточек рефлексии.

2. Проверка знаний по теме «Техника безопасности в кабинете информатики».

Давайте вспомним, что представляет собой растровое изображение? Что представляет собой векторное изображение?

Чем различаются рисунки, созданные в векторном и в растровом редакторах? (Опрос «по цепочке»).

3. Постановка цели урока

Приступим к изучению нового материала. Тему урока запишите в тетрадь. (Сл. 1)

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

4. Объяснение нового материала

Так как изображения растровые и векторные, то и анимация бывает растровой и векторной. (Презентация сл. 1)

Анимация – создание иллюзии движения на экране монитора. Компьютерная анимация использует быструю смену кадров, которую глаз человека воспринимает как непрерывное движение. Чем больше кадров меняется за одну минуту, тем более полная иллюзия движения возникает у человека, кстати, кадров должно быть не меньше, чем 24.

Анимацию в презентации можно выполнить с помощью эффектов, реализованных в процессе перехода слайдов. Для создания компьютерной анимации, показывающей движение Земли вокруг Солнца, необходимо создать последовательность кадров, на которых нарисованы разные положения Земли на орбите. (Учитель показывает презентацию в обычном режиме). Для создания иллюзии движения требуется осуществить их быстрый последовательный вывод на экран монитора (учитель демонстрирует анимацию, реализованную с помощью смены слайдов – презентация «Движение Земли вокруг солнца»). (сл. 2-47 в режиме Показ слайдов)

Почему мы видим перемещение Земли (скачки)? И что надо сделать, чтобы создавалась полная иллюзия движения на экране монитора?

Ученики: Для того, чтобы мы не видели скачков, нужно сделать больше слайдов. Количество кадров секунду должно быть не менее 24.

Анимацию в презентациях можно создавать также с помощью анимационных эффектов для каждого объекта на слайде. (сл. 48)

Другой способ анимации – gif-анимация – последовательность растровых графических изображений (кадров), которые хранятся в одном растровом графическом файле в формате gif. Для создания последовательности растровых изображений можно использовать обычный растровый редактор, а для их превращения в gif-анимацию – специальный редактор. (Учитель нажимает на ссылку, переводящую в программу GIF-аниматор сл. 49)

Следующий способ создания анимации – это flash-анимация, которая базируется на использовании векторной графики и представляет собой последовательность векторных рисунков (кадров). Кадр строится с использованием набора векторных графических объектов, для каждого из которых можно задать размер, цвет линий и заливки и другие параметры. Достоинством flash-анимации является то, что нет необходимости прорисовывать каждый кадр. Достаточно нарисовать ключевые кадры и задать тип переходов между ними (сл. 50). Редактор flash-анимации автоматически построит промежуточные кадры. Если промежуточных кадров много, то анимация получается плавной, а если мало, то быстрой. Учитель демонстрирует тему 7 Проекта по лицею 1548 из сборника работ Конкурса Flash-проектов 2012 года, организованного МГУ им. М.В. Ломоносова (или преобразование синего квадрата сначала в зеленый треугольник, а затем в красный круг. (Гиперссылка) Для просмотра flash-анимации на компьютере должен быть установлены Flash Playr.

4. Закрепление и рефлексия.

Ученики пересаживаются на рабочие места. Учитель рассаживает обучающихся по принципу: сильный ученик – слабый ученик за соседние ПК.

Практическая работа «Анимация в презентации» (10-15 минут). Для тех, кто закончит работу раньше, чем через 10 мин, дополнительное задание: Самостоятельно нарисовать и анимировать движение Луны вокруг Земли.

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

Создание анимации изображения в презентации Microsoft PowerPoint 2003

Аппаратное и программное обеспечение. Компьютеры с операционной системой Windows, программа разработки презентаций Microsoft PowerPoint 2003, входящая в интегрированное офисное приложение Microsoft Office 2003.

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

Задание. Применить к статическому изображению, внедренному в презентацию, эффекты анимации для создания иллюзии движения объекта.

             Создание анимации изображения на слайде

1. Запустить редактор презентаций Microsoft PowerPoint 2003  командой [Пуск – Все программы – Microsoft Office 2003 – Microsoft PowerPoint 2003]. Выберите Пустая презентация.
2. Для удобства выполнения работы замените титульный слайд презентации на пустой слайд. Для этого щелкните правой кнопкой мыши по титульному слайду и в контекстном меню в разделе Макет выберите Пустой слайд.

Создадим анимационное движение Земли вокруг Солнца.

3. Подготовьте изображения Земли и Солнца, перейдя на ленту меню Вставка и щелкнув по кнопке Изображения из файла. В появившемся окне выбрать Документы, выделить рисунки Земля.gif и Солнце.gif., щелкнуть по кнопке Вставить.
4. Выделите объект «Земля» и перейдите вменю на вкладку Анимация для выбора эффектов. Выполните команду [Добавить анимацию → Другие пути перемещения].
5. Откроется диалоговое окно Добавление пути перемещения.  Укажите путь перемещения Круг и щелкните OK.
6. Переместите Солнце таким образом, чтобы оно оказалось в центре отобразившегося пунктирного круга (т. е. в центре траектории движения Земли).                

При необходимости увеличьте путь перемещения Круг с помощью специальных маркеров (квадратиков).

7. Снова выделите объект «Земля», щелкните по кнопке Добавить анимацию и выполните команду [Выделение – Вращение].

Настроим анимационные эффекты.

8. Вызовите область задач, на вкладке Анимация.
9. В отобразившейся справа области выделите первый добавленный анимационный эффект (путь перемещения Круг) и, щелкнув на выделенном правой кнопкой мыши, в появившемся меню выберите пункт Параметры эффектов….
10. В появившемся диалоговом окне Круг на вкладке Эффект передвиньте ползунки параметров Плавное начало и Плавное окончание на 0 сек.:

11. Переключитесь на вкладку Время и измените параметры следующим образом:

12. Щелкните по кнопке OK.
13. В Области анимации выделите второй анимационный эффект Вращение и в Параметрах эффектов… примените к нему следующие настройки:

14. Для предварительного просмотра запустите презентацию на выполнение клавишей F5.
15. Выделите объект «Солнце» и добавьте к нему анимацию Изменение размера. Для этого выполните следующие действия:

1. выделите Солнце;
2. на вкладке Анимация щелкните по кнопке Добавить анимацию  и выберите Дополнительные эффекты выделения;
3. в группе Общие выберите эффект Изменение размера и щелкните кнопку OK.

16. Для настройки параметров эффекта Изменение размера в Области анимации (в окне программы – справа) щелкните по добавленному эффекту правой кнопкой мыши и выберите Параметры эффектов….
17. На вкладке Эффект установите следующие настройки:

(Для настройки размера эффекта щелкните по кнопке раскрывающегося списка и в поле Другой: вручную введите 95%. Чтобы принять этот размер, после ввода числа нажмите на клавишу ).

18. На вкладке Время установите следующие параметры:

19. Сохраните изменения, нажав на кнопку OK.
20. Просмотрите результат работы, нажав на клавишу  или щелкнув по кнопке Показ слайдов  на информационной панели (внизу окна программы).
21. Сохраните работу в собственной папке под именем Вращение.
22. Дополнительное задание. Открыть презентацию Вращение», самостоятельно нарисовать и анимировать движение Луны вокруг Земли. Сохранить изменения.

Коллективная игра «Кто быстрее» (3-5 минут). Две команды: один ученик за компьютером – оператор – по выбору ребят, остальные сидят сзади и вместе обсуждают действия, оператор принимает окончательное решение и работает на компьютере. По инструкции команды должны создать анимацию в PowerPoint: двух петушков, расходящихся в разные стороны. Побеждает команда, выполнившая задание быстрее и без ошибок.

Итак: ПК № 1-4 – команда №1 сядет за ПК №1, ПК № 5-8 – команда №2 сядет за ПК №4. Выберите оператора. (Выбор обучающихся.) Займите места у компьютеров №1 и №4.

Учитель раздает 4 инструкции (по 2 на команду, игроки сами решают, как их использовать)

Игра «Кто быстрее»

Применение анимационных эффектов

к изображениям в Microsoft PowerPoint

Используя анимационное изображение Петушок.gif из папки [Документы → 9класс → Заготовки], создайте анимацию в презентации PowerPoint. Попробуйте сделать так, чтобы петушок «пробежал» по экрану сначала в одну, затем в другую сторону (в обратном направлении).

(При выполнении этой работы используйте две копии изображения, одну из которых отразите слева направо, используя инструмент Повернуть в меню Формат, которое появляется при выделении объекта изображения.)

1. Откройте программу Microsoft PowerPoint.
2. Установите макет Пустой слайд.
3. Вставьте изображение Петушок.gif из папки [Документы → 9класс → Заготовки].
4. Откройте закладку Эффекты анимации «Пути перемещения», нарисуйте путь петушка в любую сторону, установите.
5. Сделайте копию изображения петушка, бегущего в другую сторону.
6.  Аналогично п. 4 нарисуйте путь петушка в другую сторону.
7. Продемонстрируйте анимацию.

Учитель: Победила команда №___ . Поздравляем победителей!

Вывод учителя: Мы знали, что есть графика растровая и векторная. Растровые рисунки создаются в растровом графическом редакторе, векторные – в векторном. А сегодня мы узнали, что есть еще и анимация – растровая и векторная, в основе которых лежит соответственно растровая и векторная графика.

Учитель выставляет оценки. Ученики заполняют карточки рефлексии.

5. Домашнее задание: § 1.4, создать анимационную презентацию, используя Clipard, по сюжету: человек выходит из дома – подходит к дороге – пропускает машину – переходит через дорогу – уходит. Как всегда, материалы к уроку размещены на сайте tamau.ucoz.ru.