Муниципальное автономное образовательное учреждение для детей
г. Владимира
«Городской межшкольный учебный комбинат № 2»
Методическая разработка урока
по теме « Создание GIF – анимации средствами графических редакторов »
Разработал
учитель трудового обучения
БИЧУРЕНКО Павел Андреевич
г. Владимир 2014 г.
ПОЯСНИТЕЛЬНАЯ ЗАПИСКА
Данная методическая разработка рассчитана на 2 урока. В ходе занятий осуществляется проверка знаний по теме «растровые и векторные изображения», полученных учащимися на предыдущих уроках. Один урок отводится на выполнение практического задания. Формой проведения данного занятия является урок-практикум.
В содержание данной разработки входит изучение видов анимации, их преимуществ и недостатков и технологии создания анимации. В ходе занятий учащиеся получают умения по созданию изображений и их анимации средствами графических редакторов, а также приобретают умения переводить векторные изображения в растровые. Полученные знания можно будет применить при оформлении интерактивных презентаций и веб-страниц.
УРОК НА ТЕМУ: СОЗДАНИЕ GIF – АНИМАЦИИ СРЕДСТВАМИ ГРАФИЧЕСКИХ РЕДАКТОРОВ
Цель: Сформировать у учащихся умение создавать GIF-анимацию.
Задачи:
Образовательные: Сформировать знания о способах создания анимации и видах анимации. Дать понятие анимации.
Воспитательная: Воспитание информационной культуры учащихся, внимательности, дисциплинированности, усидчивости.
Развивающая: Развитие познавательных интересов, творческих способностей, самостоятельной работы, умения конспектировать.
Личностные:
Проявление познавательного интереса к процессу обучения;
Проявление эмоционально-ценностного отношения к изучаемой теме.
Метапредметные:
Познавательные:
Научится применять полученные знания на практике;
Научиться обобщать полученную информацию;
Давать оценку своим действиям, оценивать результат;
Находить ответы на вопросы, используя свой жизненный опыт и информацию, полученную на уроке.
Регулятивные:
Работать по предложенному учителем плану, при выполнении практических заданий;
Научиться формулировать вопрос, проблему, затруднения, с которыми столкнулись учащиеся.
Коммуникативные:
Научится высказывать свою точку зрения, формулировать высказывание;
Учиться представлять другим ход работы и ее результат, выслушивать мнение других;
Адекватно использовать речевые средства для дискуссии и аргументации своей позиции.
Предметные:
Усвоить технологию создания GIF -анимации;
Получить умение создавать анимацию;
Тип урока: изучение нового материала
По форме организации: Урок-практикум.
Оснащение: персональные компьютеры, проектор, экран, конспект урока, технологические карты, журнал, программное обеспечение (Inkscape , Paint . NET , UnFREEz ).
План урока:
Организационный момент;
Актуализация знаний;
Постановка целей урока;
Работа по теме урока;
Практическая работа «Создание анимации»;
Фронтальный опрос;
Ход урока:
Организационный момент.
- Приветствие учащихся.
Краткий рассказ о том, что будет изучено на уроке.
2. Актуализация знаний.
Какие типы графики существуют? (растровая, векторная, фрактальная, анимация, 3D).
На чем базируется построение растровых и векторных графических изображений? (на пикселях – строках и столбцах; на графических примитивах).
3. Постановка целей урока.
Что такое анимация?
В каких программах она создается?
Сегодня на уроке мы рассмотрим создание анимации с помощью графических редакторов.
4. Работа по теме урока.
С помощью демонстрации «Анимация» показать различные примеры анимации и их создание.
Анимация – это создание иллюзии движения объектов на экране монитора. Компьютерная анимация использует быструю смену кадров на экране монитора. Чем больше кадров меняется за одну секунду, тем более плавно движется объект.
В каких компьютерных программах вы сталкивались с анимационными эффектами? (в компьютерных презентациях).
Какие типы анимации вы использовали? (смену слайдов, размещение объектов на слайдах, анимационные эффекты при появлении текста).
Запишем в тетради определение GIF -анимации.
GIF-анимация – это последовательность растровых графических изображений, хранящихся в одном файле в формате .gif. При создании GIF-анимации можно задать величину задержки каждого кадра; чем она меньше, тем лучше качество анимации. Можно установить количество повторов последовательности кадров. Большое количество кадров ведет к улучшению качества анимации, но при этом увеличивается размер GIF-файла.
Еще один тип анимации – flash -анимация.
Flash-анимация – это последовательность векторных рисунков. Ее огромный плюс в том, что не нужно прорисовывать каждый кадр. Достаточно нарисовать ключевые кадры и задать тип перехода между ними и редактор автоматически построит промежуточные кадры. Если кадров много, то анимация получается плавной, если мало, то быстрой. Поэтому можно задать количество кадров, появляющихся в секунду. Чем их больше, тем качество анимации лучше. Еще один положительный момент в том, что файлы с Flash-анимацией занимают немного места, поэтому широко используются на Web-сайтах в Интернете.
5. Практическая работа «Создание GIF -анимации средствами графических редакторов» (Технологическая карта).
Сначала демонстрирую процесс создания анимации на экране, затем учащиеся садятся за персональные компьютеры, и выполняют задание. Если возникают проблемные моменты, решаем их в индивидуальном порядке.
6. Фронтальный опрос.
Что такое пиксель? Пиксель – минимальный участок изображения, для которого независимым образом задается цвет.
Что такое разрешающая способность растрового изображения? Разрешающая способность растрового изображения определяется количеством точек по горизонтали и вертикали на единицу длины изображения.
Что такое глубина цвета? Количество информации, которое используется для кодирования изображения, называется глубиной цвета.
Назовите 3 палитры цветов в системах цветопередачи? (RGB, CMYK, HSB). Какая цветопередача применяется чаще и где? (RGB – для отображения на мониторе)
Что такое растровое изображение? Растровые изображения формируются из точек различного цвета, которые образуют строки и столбцы.
Что такое векторная графика? Векторные рисунки формируются из базовых графических объектов, для каждого из которых задаются координаты опорных точек, формулы рисования объекта, а также цвет, толщина и стиль линии его контура.
Назовите форматы векторных и растровых изображений. (j peg, gif , png , svg , wmf и т.д.)
Приведите примеры растровых и векторных графических редакторов (Paint . NET , GIMP, Photoshop, Inkscape , Corel Draw и др.).
Назовите три базовых цвета, с помощью которых формируется изображение? (красный, зеленый, синий)
Подведение итогов урока. Рефлексия.
Выставление оценок.
Вопросы рефлексии:
Какие достоинства и недостатки GIF-анимации вы узнали на уроке?
Какие трудности возникли при конвертации векторного изображения в растровое?
Знаете ли вы более простой способ создания анимации? Какой?
Вставка рисунков и графических объектов:
Выбрать команду Вставка / Рисунок. На слайде будет отображаться выбранный рисунок или графический объект.
Для форматирования рисунка (автофигуры) ее необходимо выделить и выбрать команду Формат / Рисунок (автофигура), откроется окно диалога Формат рисунка (автофигуры).
Видеоклипы
Вставка видеоклипов:
Выбрать команду Вставка / Фильмы и звук / Фильмы из коллекции картинок. Далее на панели Коллекция клипов в области задач можно выбрать клип и просмотреть его. Для этого необходимо навести указатель мыши на клип, и щелкнуть на кнопке раскрывающегося списка, из которого надо выбрать команду «Просмотр и свойства». После просмотра клипа щелкните на кнопке Закрыть.
Для добавления выбранного клипа на слайд щелкните на клипе на панели Коллекция клипов мышью, он будет отображаться на слайде.
Вставка звуков
1. Откройте слайд, к которому требуется добавить музыку или звуковые эффекты.
2. В меню Вставка выберите пункт Фильмы и звук, а затем выполните одно из следующих действий:
Вставка звукового файла
Выберите команду Звук из файла, найдите папку, в которой содержится этот файл, и дважды щелкните нужный файл.
Вставка звука из Коллекции картинок
Выберите команду Звук из коллекции, найдите нужный клип и щелкните его для добавления на слайд.
Запись с компакт-диска
Выберите команду Запись с компакт-диска, найдите требуемый файл и дважды щелкните на нем.
Записать звук
Выберите команду Записать звук, откроется окно диалога Звукозапись, в котором надо щелкнуть на кнопке начать запись. Используя микрофон осуществить запись звука. После записи щелкнуть на кнопке "Остановить запись"
Анимация
Анимация - это добавление к тексту или объекту специального видео- или звукового эффекта. Эффекты анимации могут применяться к таким элементам на слайде как: текст, рисунки, графики, диаграммы и других объектов. Эффекты анимации текста, как правило, можно применить к буквам, словам и абзацам.
В PowerPoint для добавления анимации применяются следующие команды: эффекты анимации и настройка анимации. Готовые эффекты анимации могут применяться ко всем элементам выделенных слайдов или всех слайдов презентации. Настройка анимации может применяться к отдельным элементам на слайде.
Эффекты анимации :
Если схему анимации требуется добавить только к определенным слайдам, выберите нужные слайды в области Слайды.
В меню Показ слайдов выберите команду Эффекты анимации.
В области задач Дизайн слайда выберите из списка Применить к выделенным слайдам требуемый эффект анимации.
Если эффект анимации требуется применить ко всем слайдам, нажмите кнопку Применить ко всем слайдам.
Настройка анимации
В обычном режиме откройте слайд, к тексту или объектам которого требуется применить анимацию.
Выберите объект для анимации.
В меню Показ слайдов выберите команду Настройка анимации.
В области задач Настройка анимации нажмите кнопку Добавить эффект и выберите нужный эффект из появившихся разделов: Вход, Выделение, Выход, Пути перемещения.
Диаграммы
Редактор позволяет добавлять на слайды диаграммы различных типов, которые не основаны на электронных таблицах или числовых значениях. Эти диаграммы используются для иллюстрации материалов, изложенных в презентациях. К ним относятся: циклическая, радиальная, пирамидальная диаграммы, диаграмма Венна и целевая диаграмма.
Добавление диаграммы:
Выбрать команду Вставка / Схематическая диаграмма или на панели инструментов Рисование нажать кнопку Добавить диаграмму.
Выделить один из типов диаграмм и нажать кнопку ОК.
Далее с помощью команд панели инструментов «Диаграмма» можно заменить диаграмму, обратить диаграмму, добавить текст в фигуру диаграммы и добавить фигуру в диаграмму и т.д. Кроме того, можно применить готовый стиль к диаграмме, нажав кнопку Автоформат на панели инструментов «Диаграмма» и на определенные участки диаграммы, можно включить анимацию диаграммы.
Методы создания анимации постоянно развиваются, а разработчики игр и киностудии постоянно ищут талантливых и творческих личностей, которые смогут применить эти методы.
Вот основные виды анимации, с помощью которых могут создаваться цифровые персонажи для телевизионных шоу, коммерческих приложений, логотипов компаний, кино, видео или игр.
- Традиционная анимация.
- 2D векторная анимация.
- 3D компьютерная анимация.
- Графика движения.
- Стоп моушен.
Традиционная анимация
Вы когда-нибудь видели изображения, которые появляются, как быстро сменяющиеся кадры, нарисованные на прозрачных листах бумаги цветными маркерами? Этот вид компьютерной анимации называется традиционным. Он используется для предварительных набросков персонажей.
Этот процесс может быть довольно дорогостоящим и продолжительным, так как аниматорам приходится создавать набор различных кадров, исходя из частоты 24 кадра в секунду. Данный метод используется в основном на ПК, а также планшетах с применением специальных компьютерных программ, позволяющих создавать анимацию в стиле старых диснеевских мультфильмов.
2D векторная анимация
Наиболее часто используемый стиль анимации. Ее кадры создаются на относительно плоской поверхности. Кроме этого векторная анимация переняла кое-какие методы традиционной анимации. На самом деле, это та же традиционная анимация, за исключением того, что к кадрам применяется обработка, известная под названием прорисовка и закрашивание.
Во время этого процесса аниматоры размещают тонкие прозрачные листы целлулоида на бумаге, на которой нарисованы анимационные персонажи, после чего перерисовывают их на пленку. В конце кадры с разными персонажами накладываются друг на друга, и из-за высокой прозрачности пленки это позволяет создать композицию из различных элементов и персонажей.
3D компьютерная анимация
3D анимация полностью отличается от других видов анимации в компьютерной графике. Хотя они используют одинаковые принципы композиции и движения, технические методы, применяемые для решения разнообразных задач, существенно разнятся. В 3D анимации аниматору не нужно быть художником-графиком. Это больше похоже на игру с куклами, чем на рисунок.
Это также называется генерируемые компьютером изображения (CGI ). Они возникают, когда компьютерные аниматоры создают поток изображений, которые сводится воедино, чтобы сформировать анимацию. Объединение динамических и статических изображений выполняется с использованием компьютерной графики. Персонажи, созданные в 3D, в цифровом формате отображаются на экране, а затем объединяются с каркасом, что позволяет анимировать каждую модель по-разному.
Анимация формируется путем создания моделей в отдельных ключевых кадрах, после чего компьютер выполняет их «размножение «, интерпретируя анимацию с помощью добавления промежуточных кадров между ключевыми.
Кроме этого много времени уходит на работу с кривыми, представляющими различные части объекта в разные периоды времени. В 3D-анимации должны учитываться все персонажи, даже те которые в определенный момент времени чем-то перекрыты и не видны.
Основное различие между этими видами анимации заключается в том, что в традиционной и 2D анимации художник работает с отдельными кадрами, в то время как в 3D-анимации всегда существует непрерывный поток. Если он останавливается, это воспринимается, как ошибка. Даже когда персонаж остается на месте, всегда существует непрерывный поток кадров, который создает иллюзию реальности.
Графика движения
Вы когда-нибудь задумывались о том, как создаются промо-ролики, анимированные логотипы, вступительные титры фильмов и реклама приложений? Это делается с помощью движущихся графических текстов и элементов, или, как я это называю, графики движения.
Это процесс, в котором используется »размножение » анимируемых кадров для создания плавного движения между кадрами. Программы для «размножения » кадров поддерживают скрипты, которые автоматически изменяют анимацию для создания многочисленных эффектов.
3D-композиции создаются из плоских элементов, перемещающихся друг относительно друга, что создает иллюзию объема. Они также могут сопровождаться звуковыми эффектами или музыкой. Такие объекты часто используются в мультимедийных проектах.
Stop-motion
Стоп моушен вид компьютерной анимации больше похож на традиционную анимацию. Все, что вам нужно сделать, это сфотографировать объект, а при перемещении объекта на относительно небольшое расстояние, вы берете другую фотографию. Данная процедура повторяется неоднократно, и когда изображения воспроизводятся одно за другим, возникает впечатление движения.
Существует много форм стоп моушен анимации, включая Cut-Outs , Claymation and Puppets и другие. Но суть в том, что для создания анимации объекты, которые должны перемещаться, фотографируются последовательно много раз.
Перевод статьи «Types of Animation in Computer Graphics » был подготовлен дружной командой проекта .
Хорошо Плохо
Растровая графика Растровое изображение очень чувствительно к уменьшению и увеличению. При уменьшении растрового изображения несколько соседних точек преобразуются в одну, и поэтому теряется четкость мелких деталей изображения Растровое изображение создается с использованием точек различного цвета (пикселей), которые образуют строки и столбцы. Совокупность точечных строк образуют графическую сетку (растр)
Векторная графика Векторное графическое изображение используется для хранения высокоточных графических объектов (чертежей, схем), для которых имеет значение сохранение четких и ярких контуров. Векторные изображения формируются из элементов – точка, линия, окружность, прямоугольник и др. Для каждого элемента задаются координаты, а также цвет
Фрактальная графика Фрактальная графика- как и векторная - вычисляемая, но отличается от неё тем, что никакие объекты в памяти компьютера не хранятся. Изображение строится по уравнению (или по системе уравнений), поэтому хранятся только формулы. Изменив коэффициенты в уравнении, можно получить другую картину..
Профессиональное образование ВИЗУАЛЬНЫЕ ЭФФЕКТЫ Создание реалистичных или, наоборот, фантастических миров в кино, интересных персонажей, эффектных разрушений, взрывов, смерчей, и других спецэффектов – вот далеко не полный перечень функций специалистов по визуальный эффектам. Эта профессия требует не только умения работы в трехмерных пакетах, но и знаний математики, физики и различных художественных дисциплин.
Композитинг Композитинг одна из самых интересных специальностей в пост-продакшн. Задача композера собрать в единую сцену (шот) съемочный материал и все созданные специалистами по визуальным эффектам слои компьютерной графики, объединить их по цвету и динамике, провести огромный объем коррекций и доработок и выдать финальную композицию. Каждая сцена со спецэффектами, которую зритель видит в кино, это и есть итог работы композера.
Моушн дизайн Моушн-дизайнер одна из самых креативных и востребованных специализаций компьютерной графики. Она включает в себя создание «упаковки» телеканалов, рекламы, видеоклипов, оформление концертных площадок, медиаресурсов, медиа-арт и многое другое. Моушн-дизайнер всегда зажат в узкие временные рамки производственного процесса, но зато обладает достаточной свободой самовыражения.
Компьютерная анимация 30 августа 1877 года запатентован аппарат - праксиноскоп Эмиля Рейно Анимация процесс придания способности двигаться и/или видимости жизни объектам и мёртвым телам. Настоящую революцию в мире анимации произвел УОЛТ ДИСНЕЙ (), американский режиссер, художник и продюсер.
Компьютерная анимация В настоящее время существует различные технологии создания анимации: Классическая (традиционная) анимация; Стоп-кадровая (кукольная) анимация; Спрайтовая анимация; Морфинг; Цветовая анимация; 3D-анимация; Захват движения (Motion Capture).
Компьютерная анимация Захват движения (Motion Capture) – первое направление анимации, которое дает возможность передавать естественные, реалистичные движения в реальном времени. Датчики прикрепляются на живого актера в тех местах, которые будут приведены в соответствие с контрольными точками компьютерной модели для ввода и оцифровки движения. Координаты актера и его ориентация в пространстве передаются графической станции, и анимационные модели оживают.
Профессиональное образование Анимация Аниматор (от лат. anima оживлять) интересная и увлекательная профессия, актуальная не только в мультипликации, но и в кино, рекламе, производстве компьютерных игр, медиасреде. Программа курса направлена на подготовку специалистов для работы в любой области современной индустрии анимации классическом производстве мультипликационного фильма, рекламе, компьютерных играх, кино. Фрагменты мультфильма «Красная шапочка».
Профессиональное образование Архитектурная визуализация Архитектурная визуализация трехмерное графическое отображение объекта или группы объектов в архитектуре, позволяющее максимально точно представить внешние и внутренние характеристики будущего сооружения. Архвиз активно используется при демонстрации конкурсных проектов, создании презентаций в области проектирования и строительства, а также рекламе.
Разработка компьютерных игр Игровая графика Игровая графика одна из самых молодых и востребованных специальностей графического искусства. В обязанности художника игровой индустрии входит создание игровых персонажей, локаций, визуальная разработка игры, дизайн игровых уровней и другие удивительные задачи.
Требования к уровню подготовки выпускников
1. Запись средствами ИКТ информации об объектах и процессах окружающего мира (природных, культурно-исторических, школьной жизни, индивидуальной и семейной истории) - запись изображений и звука с использованием различных устройств (цифровых фотоаппаратов и микроскопов, видеокамер, сканеров, магнитофонов);
Текстов, (в том числе с использованием сканера и программ распознавания, расшифровки устной речи);
Музыки (в том числе с использованием музыкальной клавиатуры);
Уметь:
· пользоваться персональным компьютером и его периферийным оборудованием (принтером, сканером, модемом, мультимедийным проектором, цифровой камерой, цифровым датчиком);
· следовать требованиям техники безопасности, гигиены, эргономики и ресурсосбережения при работе со средствами информационных и коммуникационных технологий;
использовать приобретенные знания и умения в практической деятельности и повседневной жизни длясоздания информационных объектов,в том числе для оформления результатов учебной работы;
1. Рисунки и фотографии.Ввод изображений с помощью инструментов графического редактора, сканера, графического планшета, использование готовых графических объектов. Геометрические и стилевые преобразования. Использование примитивов и шаблонов.
Уметь:
· создавать рисунки, чертежи, графические представления реального объекта, в частности, в процессе проектирования с использованием основных операций графических редакторов, учебных систем автоматизированного проектирования;
создания информационных объектов, в том числе для оформления результатов учебной работы;
2. Звуки и видеоизображения. Композиция и монтаж. Использование простых анимационных графических объектов.
Уметь
· осуществлять простейшую обработку цифровых изображений;
использовать приобретенные знания и умения в практической деятельности и повседневной жизни для:
создания информационных объектов, в том числе для оформления результатов учебной работы;
3. Проектирование и моделирование. Чертежи. Двумерная и трехмерная графика. Использование стандартных графических объектов и конструирование графических объектов: выделение, объединение, геометрические преобразования фрагментов и компонентов.
Уметь:
использовать приобретенные знания и умения в практической деятельности и повседневной жизни для:
· создания простейших моделей объектов и процессов в виде изображений и чертежей,
4. Тексты.
Создание текста посредством квалифицированного клавиатурного письма с использованием базовых средств текстовых редакторов.Работа с фрагментами текста. Страница. Абзацы, ссылки, заголовки, оглавления. Выделение изменений. Проверка правописания, словари. Включение в текст списков, таблиц, изображений, диаграмм, формул. Печать текста. Планирование работы над текстом. Примеры деловой переписки, учебной публикации (доклад, реферат).
Уметь:
· структурировать текст, используя нумерацию страниц, списки, ссылки, оглавления;
· проводить проверку правописания;
· использовать в тексте таблицы, изображения;
5. Математические инструменты, динамические (электронные) таблицы. Таблица как средство моделирования. Ввод данных в готовую таблицу, изменение данных, переход к графическому представлению. Ввод математических формул и вычисление по ним, представление формульной зависимости на графике.
Уметь:
· создавать и использовать различные формы представления информации: формулы, графики, диаграммы,
· создавать и использовать таблицы (в том числе динамические, электронные, в частности – в практических задачах),
· переходить от одного представления данных к другому;
использовать приобретенные знания и умения в практической деятельности и повседневной жизни для:
· создания простейших моделей объектов и процессов в виде (электронных) таблиц,
· проведения компьютерных экспериментов с использованием готовых моделей объектов и процессов;
6. Базы данных. Поиск данных в готовой базе. Создание записей в базе данных
Уметь:
· создавать записи в базе данных;
использовать приобретенные знания и умения в практической деятельности и повседневной жизни для:
создания информационных объектов, в том числе для оформления результатов учебной работы;
7. Обработка информации. Алгоритм, свойства алгоритмов. Способы записи алгоритмов; блок-схемы. Алгоритмические конструкции. Логические значения, операции, выражения. Разбиение задачи на подзадачи, вспомогательный алгоритм. Обрабатываемые объекты: цепочки символов, числа, списки, деревья, графы. Восприятие, запоминание и преобразование сигналов живыми организмами.
Знать/понимать:
· программный принцип работы компьютера;
Уметь:
· пользоваться персональным компьютером
· следовать требованиям техники безопасности, гигиены, эргономики и ресурсосбережения.
Использовать приобретенные знания и умения в практической деятельности и повседневной жизни для:
· создания простейших моделей объектов и процессов в виде программ (в том числе в форме блок-схем);
Представление информации. Формализация описания реальных объектов и процессов, примеры моделирования объектов и процессов, в том числекомпьютерного.
8. Управление, обратная связь. Основные этапы развития средств информационных технологий.
Уметь:
Использовать приобретенные знания и умения в практической деятельности и повседневной жизни для:
проведения компьютерных экспериментов с использованием готовых моделей объектов и процессов;
