Программное обеспечение и материалы к уроку:
ОС MS Windows,
MS Paint, Браузер, online-сервисы
Файлы с изображением для создания анимации
Задание для практической работы,
Карточка рефлексии.
Ход занятия
Проверка знаний по теме «Растровая графика» (5 мин)
Сначала мы вместе восхитимся нашими глубокими знаниями о графических изображениях. А для этого проведем маленький опрос.
Давайте вспомним, какие виды графических изображений вы уже знаете?
(Растровые и векторные)
Что представляет собой растровое изображение?
(Растровое изображение — изображение, представляющее собой сетку пикселей — цветных точек (обычно прямоугольных) на мониторе, бумаге и других отображающих устройствах)
С помощью какого программного обеспечения редактируют растровую графику?
(Растровую графику редактируют с помощью растровых графических редакторов.)
Какие растровые графические редакторы вы знаете?
(MS Paint, PhotoShop)
Какие форматы растровых графических файлов вы знаете?
(BMP, PNG, JPEG, GIF)
Какой из этих форматов имеет наилучшее качество изображения? Почему?
(BMP) (Используется максимальное количество цветов)
В каком формате обычно сохраняются файлы, полученные на цифровых фотоаппаратах?
(JPEG, jpg)
Почему выбран именно этот формат графических файлов, а не формат BMP?
(Изображение в формате JPEG уменьшается примерно в 8-10 раз за счет сжатия для экономии памяти фотоаппарата)
Какой вы знаете недостаток у формата JPEG?
|
|
|
(Качество изображения при сжатии снижается)
В каком формате не следует сохранять цифровое изображение, полученное с помощью цифрового фотоаппарата?
(GIF – слишком плохое качество, т.к. используется всего 256 цветов)
И все же, если у формата GIF такое плохое качество, где же он тогда используется?
(GIF-анимации небольшого размера)
Сегодня мы познакомимся с GIF-анимацией более подробно и научимся ее создавать.
Объяснение нового материала
Анимация – создание иллюзии движения (не обязательно на экране монитора). Эффект анимации является результатом быстрой смены изображений немного отличающихся друг от друга.
В технологии анимации используется быстрая смена кадров, которую глаз человека воспринимает как непрерывное движение. Увеличение скорости смены кадров приводит к более полной иллюзии движения. Количество кадров за 1 секунду должно быть не меньше 24.
GIF-анимация – это последовательность растровых графических изображений (кадров). Весь набор кадров хранится в одном растровом графическом файле в формате GIF.
Какое же программное обеспечение необходимо для создания анимации?
Используется 2 вида программного обеспечения.
1. Создание набора кадров можно выполнять в любом растровом редакторе, например, MS Paint, который входит в стандартный пакет ОС MS Windows. Можно использовать и векторный графический редактор.
|
|
|
2. Преобразование этого набора кадров в GIF-анимацию – в специальном графическом редакторе Конструкторе анимаций:
· GIMP — бесплатная
· Pivot Stickfigure Animator — бесплатная (https://pivotanimator.net/ )
· Stykz — бесплатная (http://www.stykz.net/ )
· Synfig — бесплатная (http://synfig.org )
Чтобы не устанавливать на компьютер программу – Конструктор анимаций, можно использовать online-сервисы, расположенные в сети Интернет:
| · https://gifius.ru/ · http://gifovina.ru/ · https://ru.toolson.net/ | Эти сервисы бесплатны и не требуют регистрации. |
Практическая работа№6: Создание GIF-анимации
Варианты сценария для анимации из 4 кадров см. в Приложении 1.
Цель работы:
научиться создавать кадры для анимации с помощью программы MS Paint
научиться создавать GIF-анимацию из последовательности кадров с помощью online-сервиса Гиффовина.
Ход работы:
1. Создайте личную папку Анимация.
2. С помощью Главного меню (Кнопка Пуск на Панели задач) запустите программу MS Paint.
3. Установите размеры рисунка 150×150 точек.
4. Нарисуйте первый кадр анимации и сохраните файл в папке Анимация в формате PNG под именем Кадр1.
|
|
|
5. Создайте копию этого файла и внесите изменения в изображение. Сохраните второй кадр под именем Кадр2.png.
6. Создайте таким же образом еще 2 файла: Кадр3.png и Кадр4.png.
7. Закройте программу MS Paint.
8. Запустите программу веб-браузер через Главное меню или с помощью ярлыка на Рабочем столе или на Панели задач.
9. Для запуска online-сервиса введите в адресной строке браузера адрес http://gifovina.ru/ и нажмите клавишу Enter.
| 10. Нажмите кнопку Добавить кадры с компьютера (в левом верхнем углу окна). | 
|
11. Найдите свою папку Анимация и выберите (укажите) все созданные вами кадры для анимации (Кадр1.png, Кадр2.png, Кадр3.png, Кадр4.png). Кадры можно добавлять по одному или сразу всей группой.
| 12. Установите размер анимации 150×150. | 
|
13. Установите длительность кадров 0,3 сек (перемещением бегунка или написать).
14. Эффекты не добавляем! Нажмите кнопку Готово.
15. В окне Результат можно увидеть полученную анимацию. Если результат вас устраивает, то нажмите кнопку Скачать и сохраните полученный файл в свою папку Анимация. Для редактирования анимации закройте окно Результат и измените те параметры, которые вам не понравились: скорость (длительность кадров), размер, количество кадров.
|
|
|
16. Откройте полученный файл с помощью браузера.
17. Закройте окна всех программ и папку.
Результат работы в online-сервисе http://gifovina.ru/ см. Приложение 2.
Рефлексия
вопросы:
Что мы умели до сегодняшнего урока?
Рисовать (создавать изображения) в графическом редакторе MS Paint.
Сохранять файлы в формате (по умолчанию) bmp и в других графических форматах.
Что мы сегодня на уроке узнали и чему научились?
Мы узнали, что такое анимация и GIF-анимация и как можно самостоятельно создать компьютерную анимацию.
Ученики заполняют карточки рефлексии. (см. Приложение 3)
Учитель проверяет анимации учеников .
Домашнее задание
Повторить информацию о кодировании. Создать анимацию из 4-8 кадров с помощью online-сервиса https://ru.toolson.net/ (работает без регистрации).
Прислать прямую ссылку на анимацию или письмо с вложенным файлом анимации на почту учителя.
Всем спасибо за прекрасные анимации!
С нетерпением жду ваши новые работы!
Приложение 1
Вариант сценария Смайлик
| 
| 
| 
|
| Кадр1.png | Кадр2.png | Кадр3.png | Кадр4.png |
Для Смайлика рекомендуется установить конечные параметры:
Размер 50×50. Длительность кадров 0 сек
Вариант сценария Котик
Базовый набор кадров:
| 
| 
| 
|
| Кадр1.png | Кадр2.png | Кадр3.png | Кадр4.png |
Полный сценарий:
|
|
|
|
|
| Кадр1.png | Кадр2.png | Кадр3.png | Кадр4.png |
|
|
|
|
|
| Кадр5.png | Кадр6.png | Кадр7.png | Кадр8.png |
Приложение 2
|
|
Приложение 2
| Карточка рефлексии | |
| Вопросы | Ответы ученика |
| Всё ли тебе было понятно на уроке? | Да Нет, я не понял… |
| Было ли тебе интересно на уроке? | Да Нет, потому что… |
| Будешь ли ты использовать полученные знания? | Да Нет |
| Карточка рефлексии | |
| Вопросы | Ответы ученика |
| Всё ли тебе было понятно на уроке? | Да Нет, я не понял… |
| Было ли тебе интересно на уроке? | Да Нет, потому что… |
| Будешь ли ты использовать полученные знания? | Да Нет |
| Карточка рефлексии | |
| Вопросы | Ответы ученика |
| Всё ли тебе было понятно на уроке? | Да Нет, я не понял… |
| Было ли тебе интересно на уроке? | Да Нет, потому что… |
| Будешь ли ты использовать полученные знания? | Да Нет |
Дата добавления: 2020-12-12; просмотров: 76; Мы поможем в написании вашей работы! |
Мы поможем в написании ваших работ!