Презентация к уроку информатики "Практическая работа: Создаем анимацию на заданную тему". Практическая работа анимация Как создают мультфильмы

1. Запустите программу Paint .

2. Задайте рабочую область шириной 25 см и высотой 20 см. Примените инструмент Заливка для создания синего фона.

3. Изобразите в нижней части рабочей области несколько камней (инструмент Овал Карандаш Заливка для их закраски.

Фон .

5. Выполните команду Создать основного меню программы Paint . Задайте рабочую область шириной 5 см и высотой 3 см и нарисуйте в ней рыбку. Сохраните рисунок в личной папке под именем Рыбка .

6. Запустите программу PowerPoint (Пуск-Все программы-Microsoft Office-PowerPoint) .

7. На вкладке Главная в группе Слайды щёлкните мышью на кнопке Макет . Выберите Пустой слайд (щёлкните на макете пустого слайда).

8. Вставьте на пустой слайд рисунок Фон , созданный в программе Paint. Для этого выполните команду Вставка-Рисунок (вкладка Вставка) , найдите нужный файл в личной папке, выделите его и щёлкните на кнопке Вставить . Фоновый рисунок появится в рабочем поле (на слайде) программы PowerPoint.

9. На этот же слайд поместите изображения рыбки (файл Рыбка Осьминог из папки Заготовки .

10. Рыбка и осьминог появились на экране на белом фоне (в белых прямоугольниках). Для того чтобы сделать фон прозрачным, выделите рыбку, щёлкнув на её изображении, - вокруг рыбки должна появиться рамка с маркерами.

Выполните команду Формат-Цвет-Установить прозрачный цвет . Выделите изображение осьминога и сделайте окружающий его фон прозрачным.

11. Выделите рыбку. Перейдите на вкладку Анимация . В группе Расширенная анимация выберите Добавить анимацию . В раскрывшемся списке в группе Пути перемещения выберите Пользовательский путь . Изобразите произвольную траекторию перемещения рыбки.

12. Задайте траекторию перемещения осьминога.

13. Для просмотра анимации воспользуйтесь кнопкой Просмотр на вкладке Анимация .

14. После завершения просмотра выделите один из объектов анимации и изучите возможности настройки анимации в группе Время показа слайдов . По своему усмотрению внесите изменения в параметры анимации. Понаблюдайте за изменениями в ходе просмотра.

15. С помощью инструментов копирования и вставки (вкладка Главная ) разместите на слайде несколько копий рыбки и настройте для них параметры анимации.

16. Для просмотра готовой анимации воспользуйтесь функциональной клавишей F5 .

17. Сохраните свою работу в личной папке под именем Анимация .

Задание 1
(Linux)

1. Запустите программу KolourPaint .

2. Задайте рабочую область 1000 х 800. Примените инструмент Заливка для создания синего фона.

3. Изобразите в нижней части несколько камней (инструмент Эллипс ) и морских водорослей (инструмент Перо ). Воспользуйтесь инструментом Заливка для их закраски.

4. Сохраните рисунок в личной папке под именем Фон .

5. Задайте рабочую область 200 х 120 и нарисуйте в ней рыбку. Фон закрасьте тем же синим цветом. Сохраните рисунок в личиной папке под именем Рыбка .

6. Запустите программу OpenOffice.org Impress (К-Меню-Офис-Презентация (OpenOffice.org Impress)) . Создайте пустую презентацию.

7. Вставьте в пустую презентацию рисунок Фон, созданный в программе KolourPaint, выбрав пункт Изображение-Из файла в меню Вставка . Найдите нужный файл, выделите его и щелкните на кнопке OK . Фоновый рисунок появится в рабочем поле (на слайде) программы OpenOffice.org Impress.

8. На этот же слайд поместите изображения рыбки (файл Рыбка в личной папке) и осьминога (файл Осьминог из папки Заготовки).

9. Для настройки анимации щёлкните на изображении рыбки правой кнопкой и в контекстном меню выберите пункт Эффекты. Далее выберите команду Добавить, на вкладке Пути движения выберите Объект кривых , затем нарисуйте путь движения рыбки.

10. В группе Эффект выберите Начать-При щелчке, Скорость-Низкая .

11. Действия 9-10 повторите для настройки параметров анимации осьминога.

12. Для просмотра анимации воспользуйтесь функциональной клавишей F5 или командой Демонстрация слайдов меню Вид .

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

14. Попробуйте скопировать рыбку и настроить для неё параметры анимации.

15. Сохраните свою работу в личной папке под именем Анимация .

16. Завершите работу с программой OpenOffice.org Impress.

Задание 2. Анимация на свободную тему

1. Самостоятельно придумайте сюжет для анимации. Дайте ему название и подробно опишите планируемую последовательность событий.

2. Реализуйте свой проект средствами графического редактора и редактора презентаций. Подготовьтесь представить свою работу товарищам по классу.

Теперь вы умеете

  • запускать редактор презентаций;
  • помещать на слайд ранее подготовленные рисунки;
  • настраивать анимацию отдельных объектов;
  • просматривать анимацию;
  • сохранять результаты работы в редакторе презентаций;
  • завершать работу с редактором презентаций.

Современный человек не может себе представить свою жизнь без информации. В ХХІ веке 80 % этой информации - видеоинформация. Современные фильмы и мультфильмы являются той «отдушиной» для человека делового и постоянно занятого, при просмотре которых он отдыхает и отвлекается от обыденных проблем. Для того чтобы снять качественный фантастический фильм или 3D-мультфильм, нужно использовать анимацию и огромное количество компьютерных технологий. На данном уроке будут рассмотрены основы создания простейшей анимации, а также рассмотрены некоторые основные понятия, такие как Motioncapture, Эффект «зловещей долины», 3D-мультфильм.

На данном уроке будет рассмотрено создание анимации.

Слово анимация имеет множество значений.

1. Анимация (от фр. animation - оживление, одушевление) - западное название мультипликации: вид киноискусства и его произведение (мультфильм), а также соответствующая технология.

2. Компьютерная анимация - последовательный показ (слайд-шоу) заранее подготовленных графических файлов, а также компьютерная имитация движения с помощью изменения (и перерисовки) формы объектов или показа последовательных изображений с фазами движения.

3. Анимация - процесс придания способности двигаться и/или видимости жизни объектам и мёртвым телам (например, зомби - анимированный труп) в выдуманных мирах художественных произведений и играх жанра фэнтези.

Рис. 1. Наброски анимации Тарзана ()

Создание сложных анимированных изображений - очень трудоёмкая и непростая задача. Существуют специальные люди - аниматоры, которые занимаются созданием и обработкой анимации. С помощью анимации стала возможной передача движения человека различным компьютерным персонажам. В большинстве фильмов компьютерные персонажи на самом деле имеют вполне реальные человеческие прототипы. С помощью специальных датчиков фиксируются движения и мимика человека, которые затем передаются и анализируются компьютером. Один из последних примеров - работа Бенедикта Камбербэтча в трилогии «Хоббит». Как ни парадоксально, но актёр сыграет…дракона Смауга. Многие из вас, наверное, подумают, что речь идёт об озвучке. Однако нет - благодаря технологии захвата движения дракон Смауг в исполнении Камбербэтча оживёт. Сам актёр так говорит об этой работе: «Я уже качаюсь и делаю всякие упражнения на гибкость, чтобы двигаться в костюме, увешанном шариками, как это делается при съемках с помощью захвата движения… »

Motion capture . Захват движений

Motion capture - метод анимации персонажей и объектов. Дословный перевод с английского - захват движения. Метод применяется в производстве мультфильмов, а также для создания спецэффектов в фильмах. Широко используется в игровой индустрии. Разработчиком является компания Digital District. Данная технология использовалась при анимации сгенерированного компьютером киноперсонажа Голлум в трилогии «Властелин колец» (модель - Энди Серкис) (рис. 2). В 2007 году с помощью неё был создан «Беовульф», в 2009 году - «Рождественская история», «Аватар». Также с помощью этой технологии было создано лицо Волан-де-Морта в фильмах «Гарри Поттер».

Существуют два основных вида систем motion capture.

Рис. 2. Технология Motion capture вдействии (создание персонажа Голлума из «Властелина колец») ()

Маркерная система motion capture , где используется специальное оборудование. На человека надевается костюм с датчиками, он производит движения, требуемые по сценарию, встаёт в условленные позы, имитирует действия; данные с датчиков фиксируются камерами и поступают в компьютер, где сводятся в единую трёхмерную модель, точно воспроизводящую движения актёра, на основе которой позже (или в режиме реального времени) создаётся анимация персонажа. Также этим методом воспроизводится мимика актёра (в этом случае на его лице располагаются маркеры, позволяющие фиксировать основные мимические движения).

Рис. 3. Безмаркерная технология создание анимационного персонажа ()

Безмаркерная технология , не требующая специальных датчиков или специального костюма (рис. 3). Безмаркерная технология основана на технологиях компьютерного зрения и распознавания образов. Актер может сниматься в обычной одежде, что сильно ускоряет подготовку к съемкам и позволяет снимать сложные движения (борьба, падения, прыжки, и т. п.) без риска повреждения датчиков или маркеров. На сегодняшний день существует программное обеспечение для безмаркерного захвата движений, которому не требуется специального оборудования, специального освещения и пространства. Съёмка производится с помощью обычной камеры (или веб-камеры) и персонального компьютера.

Анимация обладает при нынешнем уровне развитии техники, поистине потрясающими возможностями.

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

Простая анимация - это последовательность сменяющих друг друга кадров.

Программы, которые помогают сделать анимированное изображение, в большинстве своём всего лишь выставляют в цепочку УЖЕ ПОДГОТОВЛЕННЫЕ ЗАРАНЕЕ пользователем картинки. Например, если взять несколько заранее подготовленных картинок и обработать их в специальной программе-аниматоре, то можно получить такую анимацию (рис. 4).

Рис. 4. Последовательные картинки для анимации ()

Чтобы было еще понятнее, нужно посмотреть на ту же картинку, но «в замедленном варианте». Пользователь увидит, что это всего лишь несколько кадров сменяют друг друга! Главное - время, пауза, которая проходит между ними. Выставить время помогают специальные программы-аниматоры.

Подобную анимацию каждый можете сделать и сам. Например, сфотографировать с помощью эффекта «мультисъёмки» подряд несколько положений своего домашнего любимца. Затем обработать их в специальной программе или просто сделать презентацию с помощью редактора Power Point, в которой с достаточной скоростью меняются слайды - и вы получите небольшой «ролик», имитирующий движения вашего питомца.

Как создают мультфильмы?

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

Мало кто знает, что мультипликация появилась даже раньше кинематографа. Отцом-основателем мультфильмов принято считать Эмиля Рейно. Он в 1877 году представил публике первую движущуюся ленту, на которой последовательно сменяли друг друга рисованные картинки. Однако и до него были попытки оживить картинки. Еще в XV веке в Европе были распространены книги, которое при быстром перелистывании создавали иллюзию движений персонажей. Собственно именно на этом и построен сам принцип мультипликации.

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

1. Рисованные.

Самый популярный вид мультипликации по сей день - рисованные. Меняются только технические приспособления. Если раньше мультфильмы рисовались от руки, то теперь это делается на компьютере. Принцип того, как делают рисованные мультфильмы, остался неизменным. Сначала пишется подробный сценарий. Затем рисуются все персонажи. Каждый рисунок представляет собой элемент движения персонажа, отдельную его позу. Таких рисунков может быть тысячи. После рисунки либо фотографируются по одному и сводятся в единый видеоряд с 24 кадрами в секунду, либо с помощью специальных программ то же самое делается на компьютере (рис. 5).

Рис. 5. Кадр из рисованного мультфильма ()

2. 3D-мультфильмы

Компьютерная анимация - это самое перспективное направление на сегодняшний день. В ней особо выделяются 3D-мультфильмы (рис. 6). Они позволяют делать изображение объемным. Это очень дорогая технология, но именно 3D-мультфильмы сегодня собирают полные залы в кинотеатрах.

Как делают 3D-мультфильмы? Конечно же, здесь на помощь человеку приходят современные технологии. Картинка создается с помощью особых компьютерных программ, например Maya или Z-Brush. Сначала прорисовывается «скелет» персонажа со всеми мышцами и сухожилиями. Каждая из них, как в настоящем человеческом теле, отвечает за то или иное действие. То есть при повороте головы мы будем видеть движение шейных мышц, а при сгибе руки будет напрягаться бицепс. Особое внимание уделяется лицу, мышцам, отвечающим за мимику. Затем на скелет натягивается текстура. Причем это не только цвет кожи и одежды. Важно проработать каждую морщинку и складочку, все светотени и прочее, чтобы персонаж выглядел живым. Так же подробно прорабатывается фон. Все должно быть максимально правдоподобным и реалистичным. Чтобы не прорисовывать каждую травинку, у мультипликаторов есть специальные модули, которые «рассаживают» растительность в кадре так, как она растет в действительности.

Затем начинается монтаж. Обычно аниматор создает 4 секунды мультфильма в неделю - настолько это кропотливый процесс! Чтобы успеть вовремя, над мультфильмом обычно работают десятки аниматоров.

Рис. 6. Кадр из 3D-мультфильма ()

3. Пластилиновые мультфильмы

Любимые с детства пластилиновые мультфильмы (рис. 7) делаются немногим проще. Но компьютер в них используется только на стадии монтажа. Все фигурки во всех их действиях лепятся вручную. В профессиональных студиях фигурки делают из особого пластилина, который не плавится под лампами. Затем их укладывают на специальную поверхность чистого цвета (синего, зеленого) - хромокей. Фигурки снимаются на цифровую камеру. Затем так же снимается фон. А уже на компьютере фон и фигурки соединяются. Это называется методом перекладки. Сейчас он наиболее распространен.

Рис. 7. Кадр из пластилинового мультфильма ()

На практике создание анимации с помощью программы Power Point выглядит так.

Для того чтобы запустить программу Microsoft PowerPoint, нужно зайти в меню Пуск - Все программы - Microsoft Office и выбрать Microsoft PowerPoint . Первое, что нужно сделать, - выбрать макет слайда, поскольку по умолчанию там будет стоять Заголовок слайда . Для создания анимации нужно выбрать Пустой слайд (рис. 8).

Рис. 8. Выбор в Power Point Пустого слайда

После этого нужно в пункте меню Вставка - Рисунок выбрать картинку, которая в последующем должна стать фоном для анимации. Она может находиться в любой папке компьютера пользователя. Если фоновый рисунок не совпадает с размерами слайда, его можно растянуть за соответствующие маркеры (рис. 9, 10).

Рис. 9 и 10. Выбор фонового рисунка

Следующая задача - выбор самого объекта анимации, который будет двигаться (рис. 11).

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

Рис. 11. Рисунки осьминога и рыбки наложены на фоновый рисунок

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

Следующая задача, после того как анимационная картинка полностью загружена, - сделать так, чтобы объекты двигались (рис. 12).

Рис. 12. Настройка движения анимационных объектов

Для этого нужно зайти на вкладку Анимация - Настройки анимации - Добавить эффект и выбрать путь перемещения объектов по своему усмотрению. Это может быть движение в любую сторону или даже нарисованный самим пользователем путь. В колонке справа можно выбрать и скорость передвижения анимационных объектов. Чтобы начать анимацию, нужно нажать клавишу F 5 и стрелочку «Вверх» в колонке справа (рис. 13).

Рис. 13. Начало просмотра анимации

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

Вставка. Эффект «зловещей долины» и перспективы анимации

Одним открытым вызовом в компьютерной анимации является фотореалистичная анимация человека. В настоящее время большинство фильмов, созданных с использованием компьютерной анимации, показывают персонажей-животных (В поисках Немо, Рататуй, Ледниковый период, Лесная братва), фантастических персонажей (Корпорация монстров, Шрек, Монстры на каникулах), антропоморфные машины (Тачки, Роботы) или мультяшного человека (Суперсемейка, Гадкий я). Фильм «Последняя фантазия: Духи внутри нас» часто приводится в качестве первого компьютерного фильма, сделавшего попытку показать реалистично выглядящих людей. Однако из-за огромной сложности человеческого тела, движений человека и биомеханики человека реалистичная симуляция человека остаётся в значительной степени открытой проблемой. Еще одной проблемой является неприязнь как психологический ответ на просмотр почти идеальной анимации человека, известная как «зловещая долина».

Эффект «зловещей долины» (англ. uncanny valley) - гипотеза, по которой робот или другой объект, выглядящий или действующий примерно как человек (но не точно так, как настоящий), вызывает неприязнь и отвращение у людей-наблюдателей.

В 1978 году японский ученый Масахиро Мори провел опрос, исследуя эмоциональную реакцию людей на внешний вид роботов. Поначалу результаты были предсказуемыми: чем больше робот похож на человека, тем симпатичнее он кажется - но лишь до определённого предела. Наиболее человекоподобные роботы неожиданно оказались неприятны людям из-за мелких несоответствий реальности, вызывающих чувство дискомфорта и страха. Неожиданный спад на графике «симпатии» и был назван «Зловещей долиной», притом Масахиро Мори обнаружил, что анимация усиливает и позитивное, и негативное восприятие (рис. 14).

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

Рис. 14. Эффект «зловещей долины» ()

Феноменом «зловещей долины» издавна пользуются создатели фильмов, литературы, игр и анимации, чтобы вызвать чувство страха, - достаточно вспомнить чудовище Франкенштейна, различных киборгов в человеческой плоти, зомби, медсестёр из «Сайлент-Хилла» или Садако из фильма «Звонок». Искусственные персонажи, которые должны вызывать симпатию, не должны быть чересчур похожи на людей, особенно если они анимированы - это хорошо знают мультипликаторы.

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

Список литературы

  1. Босова Л.Л. Информатика и ИКТ: Учебник для 5 класса. - М.: БИНОМ. Лаборатория знаний, 2012.
  2. Босова Л.Л. Информатика: Рабочая тетрадь для 5 класса. - М.: БИНОМ. Лаборатория знаний, 2010.
  3. Босова Л.Л., Босова А.Ю. Уроки информатики в 5-6 классах: Методическое пособие. - М.: БИНОМ. Лаборатория знаний, 2010.
  1. Cpu3d.com ().
  2. 1-film-online.com ().
  3. Osp.ru ().

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

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

2. Попробуйте сделать обычную рисованную анимацию, нарисовав внизу страницы небольшое дерево, которое постепенно на каждой следующей странице будет распускаться, расти и сбрасывать листья. Оцените, насколько это сложный и трудоемкий процесс.

3. Сделайте несколько поделок из пластилина, придумайте интересную историю для своих персонажей (сюжет пластилинового мультфильма).

4.* С помощью видео-урока попробуйте сделать простейшую анимацию, например домашнего питомца.

Зайцева Любовь Ивановна - учитель информатики и ИКТ,

МОУ: СОШ п.Горноправдинск

Содержание:

Практическая работа «Создаем поздравительную открытку» 2

Практическая работа «Снеговик» 9

Практическая работа «Анимация формы» 12

Практическая работа «Создание пользовательского курсора» 17

Разработка ЦОР для интерактивной доски с преобразованием статичной графики в объект для свободного перемещения. 22

Практическая работа «Создание презентации в среде Adobe Flash CS 3» 29

СОЗДАЕМ ПОЗДРАВИТЕЛЬНУЮ ОТКРЫТКУ

Работа в среде Flash CS 3

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

Тема «Рисуем в среде Flash CS 3»

    Создайтеновыйфильм. File – New – Flash File .

    На панели Tools (инструменты), выберите инструмент Rectange Tool и изобразите

    Затем выберите инструмент Selection Tool (v ) и создайте из верхнего прямоугольника трапецию.

    Подводя курсор к любой из линий, при выбранном инструменте Selection Tool (v ), мы увидим маленькую дугу, это значит, что данную линию можно искривить. Что мы и делаем.

    Дорисовываем еще одну линию у горловины вазы, используя инструмент Line Tool , и искривляем ее.

Выбираем цвет, для заливки используя панель Color . Если панель закрыта, мы можем ее найти Window - Color или нажимаем комбинацию клавиш Shift + F 9 .

На панели Color выбираем Type : Radial и, щелкая на правом и левом указателе, подбираем цвета градиентной заливки.

Затем закрашиваем вазу, щелкая ЛКМ по ее частям.

    Для удаления линий контура воспользуемся инструментом Selection Tool (v ). Выделяем линии инструментом и кнопкой Delete , их удаляем.

    Переименуем Layer 2, назовем его «Цветы ».

    Перейдем в слой Цветы , выберем инструмент Line Tool (линия), и нарисуем стебли и листья.

В середине лепестка появится круг, необходимо переместить его в нижний угол лепестка.

    Включаем панель Transform (Ctrl + T ), на переключателе Rotate задаем угол поворота 60 0 , и копируем лепестки, используя кнопку на панели Transform Copy and apply transform . Рисуем инструментом Oval Tool середину цветка.

    Чтобы мы могли перемещать цветок как единое целое, сгруппируем его. Для этого выделим его инструментом Selection Tool (v ) и нажмем комбинацию клавиш Ctrl + G .

    Переместим слой Цветы ниже слоя Ваза .

    Выделим верхушку вазочки, щелкнем ПКМ и выберем Cut (Вырезать).

    Создаем слой, переименовываем его, даем имя «Горлышко ». Размещаем на нем верхушку вазочки, для чего щелкаем на пустом месте ПКМ и выбираем Paste in Place (вставить на место).

Сохраним нашу работу File Save As , имя файла vaza . fla

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

Тема «Покадровая анимация. Создаем анимированный текст»

Технология работы:

    Для просмотра анимированного текста нажимаем комбинацию клавиш Ctrl + Enter .

    Сохраните файл под именем pozdrav .fla

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

Тема «Флэш - символы. Movie Clip »

Создание цветка

    Создайте новый клип, нажав клавишу CTRL + F 8 . В появившемся окне выберите Movie Clip . Назовите его Цветок.

    Создайте 2 слоя: Лепестки и Сердцевина .

    В слое Сердцевина нарисуйте желтый круг.

    Сделайте кадр 10 в обоих слоях простым, нажав F 5.

    Установите считывающую головку на кадр 10.

    В слое Лепестки поместите нужное количество экземпляров лепестков:

Проверяем, нажав клавишу Enter .

Открываем файл pozdrav . fla , в этом же окне Flash .

Создаем новый слой, даем ему имя цврасп . Делаем этот слой активным, щелкнув в первом кадре этого слоя ЛКМ.

Заходим в библиотеку и перемещаем созданный нами цветок на стебель. Затем еще один.

Придайте цветам разные оттенки. Для этого на панели Properties выберите Color Brightness – 50%.

Запустите фильм Ctrl + Enter .

Звук.

Создаем дополнительный слой Музыка . Помещаем в библиотеку нужный музыкальный файл File Import Import to Library . Перемещаем ЛКМ звуковой файл из библиотеки на рабочий стол. Настраиваем звучание. Панель Properties Syns : Start . Repeat - 1 . Сохраняем, присвоив имя otkritka . fla

Используемая литература:

    Вовк Е.Т. Информатика: уроки по Flash . – М.: КУДИЦ-ОБРАЗ, 2005,-176с.

    Татарникова Л.А. Знакомьтесь – Flash !: Учеб.пособие – Томск, 2005. – 60с

Тема « Покадровая анимация»

Практическая работа «Снеговик»

Технология работы:

    Создаем 2 слой и переименовываем его, дав имя «туловище». Рисуем второй снежный шар.

    Создаем 3 слой и переименовываем его, дав имя «голова». Рисуем 3 шар.

    Используя инструменты рисования и подбора цветов, рисуем рот, глаза, нос. Дорисовываем руки.

    Запустите ролик на просмотр CTRL +Enter .

Самостоятельно задайте движение по кадрам солнца.

Практическая работа «Анимация формы»

Технология работы:

    Создайте новый файл

    Создайте 3 ключевых кадра на расстоянии 20 кадров друг от друга, нажимая F 6

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

    Выделите первый кадр и выберите на панели Properties в раскрывающемся списке Tween (промежуточная анимация) режим Shape (форма).

    Для кадров 40 и 60 повторите те же действия.

    Нажмите клавишу Enter для просмотра анимации

Анимация форм для растровых изображений

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

По очереди, выделив изображения цыпленка и курицы, выполните команду Modify – Bitmap – Trace Bitmap (Изменить- Трассировать растр)

Выделите белый фон и удалите его, используя клавишу Del .

Делаем объекты примерно одинаковыми по размеру.

Создаем ключевые кадры на кадре 30 и 60.

В первом кадре убираем цыпленка и курицу, в 30 кадре яйцо и курицу, в 60 кадре цыпленка и яйцо.

Расположите все объекты в центре сцены.


Выделите 1 кадр и выберите в раскрывающемся списке Tween панели свойств Properties режим Shape

Нажмите на клавишу Enter и просмотрите анимацию. Яйцо трансформируется в цыпленка, цыпленок в курицу.

,

Практическая работа «Создание пользовательского курсора»

Размещаем на сцену фотографию моря. File- Import-Import to Stage .

Обратите внимание! Наша фотография по размеру больше сцены (550х400).

Чтобы изменить размер фотографии, выделяем её, на панели

свойств внизу экрана настраиваем высоту и ширину графики.

    Импортируем в библиотеку графическое изображение daulfin .gif

File – Import – Import to library.

2.1 Создаемновыйсимвол- клип. Insert-New Symbol (Ctrl +8).

Задаемимя : Name – delf, Type – Movie clip.

При этом мы автоматически входим во вновь созданный клип. В библиотеке появился символ delf .

2.2 ВыполняемкомандуFile – Import to Stage . Выбираем файл daulfin . gif из папки с исходниками графики.

2.3 Шкала кадров примет вид

В

ид библиотеки после вставки графического объекта.

    1. Перемещаем на сцену из библиотеки символ delf .

      Преобразуем перемещенный символ в кнопку – cursor . Для этого используем меню Modify- Convert to Symbol.

    1. Обязательно!

Задаем кнопке имя на панели свойств Instance Name – cursor

Mouse.hide();

startDrag("cursor",true);

Использованная литература:

« Flash для продолжающих» – материалы мастер – класса Ямкиной Елены Владимировны, Нуриевой Белы Олеговны.

http://it-n.ru/communities.aspx?cat_no=73740&lib_no=182080&tmpl=lib

Использована графика источников: http://www.stihi.ru/pics/2009/08/29/2758.jpg,

Данная работа успешно прошла открытую общественную профессиональную экспертизу на портале «Сеть творческих учителей» http :// it - n . ru

Материалу присвоен Уникальный Номер (УН) - 183414.

Разработка ЦОР для интерактивной доски с преобразованием статичной графики в объект для свободного перемещения.

Данный тип ЦОР реализует сенсорный принцип работы интерактивной доски. Свободно перемещать можно как графические объекты, так и текст.

Интерактивные задания могут быть как на установление соответствия, для упорядочивания, классификации; для заполнения пропусков; конструкторов и т.д.

Создадим ЦОР для учащихся по курсу «Информатика и ИКТ». По подобию данной работы возможно создание ЦОР по любому предмету.

С
оздадим новый документ в среде Flash CS 3. File -New . Выбираем В появившемся окнеFlashFile (ActionScript 2.0).

Устанавливаем размер сцены 550х600 на панели свойств.


Используем для создания таблицы инструменты

Rectange Tool (R ,O ,R ,O )

Pencil Tool(Y)

Paint Bucket Tool (K)

При использовании инструмента Pencil Tool (Y ) при прочерчивании линий, необходимо держать нажатой клавишу Shift .

Для создания надписей используем инструмент Text Tool (T )

Цвет, начертание выбираем на панели Properties .

Заполняем текстом таблицу и записываем задание.

Создаем второй слой. Даем ему имя «Элементы». На нем мы разместим графику и кнопку «Выход».

Для размещения графики используем меню File -Import -Import to Stage .

Создаем подписи.

Объединяем подпись и рисунок. Для этого выбираем инструмент Selection Tool (V ) и обводим стрелочкой вокруг объекта и надписи.

Затем группируем Modify-Group.

Выделяем сгруппированный графический объект и преобразуем в символ-тип клип.(Convert to Symbol - Movie Clip - ok ).

Дайте символу содержательное имя, чтобы в дальнейшем было легче редактировать ЦОР.

Теперь превращаем нашу графику в свободноперемещаемую. Выделяем графический объект и нажимаем F 9. Открывается закладка Actions -Frame , вписываем код свободного перемещения объекта.

on (press ) { //Кнопка мыши нажата

StartDrag (this ); } //Начать перемещение

on (release ) { //Кнопка мыши отпущена

StopDrag (); } //Закончить перемещение

(Замечание: StartDrag и StopDrag находятся в разделе Movie Clip Control )

Повторяем эти действия для каждого графического объекта.

Обратите внимание, что мы работаем на слое «Элементы». Чтобы не ошибиться защитите 1 слой с таблицей, нажав на знак замочка.

Теперь создадим кнопку, нарисовав ее или использовать готовую графику. Размещаем ее на слое «Элементы».Преобразуем графический объект в кнопку(Convert to Symbol -Button -ok ). Выделяем копку, нажимаем F 9 и вписываем код выхода из полноэкранного режима.

on (release) {

fscommand("quit");

}

Чтобы наш клип при просмотре разворачивался на весь экран, в первом кадре 1 слоя прописываем код:

fscommand("showmenu", "false");

fscommand("fullscreen","true");

Для этого, предварительно снимаем защиту со слоя, щелкаем ЛКМ на первый кадр и нажимаем F 9.

Тестируем проект нажав на клавиши Ctrl + Enter .

Адрес материала в сети: http://it-n.ru/communities.aspx?cat_no=139399&d_no=203370&ext=Attachment.aspx ?Id=86057

Практическая работа «Создание презентации в среде Adobe Flash CS 3»


В

ыделяем объект, заходим в меню Modify - Convert to Symbol . В появившемся окне выбрать Name - kn 1, Button , OK . (Следующие кнопки назовите соответственно kn2, kn3,kn4,kn5,kn6)

    Заходим внутрь 1 кнопки, сделав по ней двойной щелчок.

Унеё 4 кадраUp, Over, Down, Hit . Клавишей F 6 создаем ключевые кадры во всех кадрах кнопки.

П
ереходим в кадр Over (при наведении), вписываем текст около изображения.

С
амой кнопке на Главной сцене прописываем команду перехода на нужный кадр при нажатии на кнопки,.

on (release) {

gotoAndPlay(7);

}

on (release) {

gotoAndPlay(1);

}

    Чтобы не происходило автоматического перелистывания кадров, переходим на слой стопы и создаем 6 ключевых кадров.

Для каждого кадра прописываем команду stop ();

Источники информации:

- «Flash для продолжающих» – материалы мастер – класса Ямкиной Елены Владимировны, Нуриевой Белы Олеговны. - n . ru и перемещена в библиотеку сообщества "Создание интерактивных учебных пособий во Flash".

Материалу присвоен Уникальный Номер (УН) - 189760.

~ 34 ~

PowerPoint 2013, графический редактор GIMP 2.4, редактор Macromedia Flash Professional 8.

Цель работы. Научиться создавать анимацию в презентациях, GIF - и flash-анимацию.

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

Задание 2. Создать GIF-анимацию «Вращение Земли» из набора растровых GIF-изображений, показывающих последовательные положения Земли.

Задание 3. Создать flash-анимацию «последовательного преобразования синего квадрата в зеленый треугольник и красный круг.

Задание 1. Анимация в презентации

Запустить программу разработки презентаций Microsoft PowerPoint 2013. Выбрать пустую презентацию. На слайде с помощью команды [Вставка – Фигуры] нарисовать желтый круг (Солнце), затем выполнить команду [Вставка - Рисунки].

В диалоговом окне Вставка рисунка выбрать файл Земля. gif (Мои документы – 9 класс – Заготовки – Рисунки).

Создадим анимационное движение Земли вокруг Солнца и вращение Земли путем задания анимационных эффектов.

Выделить объект Земля и выполнить команду [Анимация – Добавить анимацию – Другие пути перемещения]. Появится диалоговое окно Добавление пути перемещения. Выбрать путь перемещения – Круг и щелкнуть по кнопке OK. Переместить объект Солнце так, чтобы оно оказалось в центре круга (траектории перемещения объекта Земля). При необходимости увеличить размер пути перемещения объекта Земля. Снова выделить объект Земля, выполнить команду [Анимация – Добавить анимацию – Дополнительные эффекты выделения…]. В окне Добавление эффекта выделениявыбрать анимационный эффект Вращение. Для просмотра результатов применения к объектам анимационных эффектов необходимо активировать кнопку Область анимации на вкладке Анимация. Справа в окне программы создания презентаций появится панель Область анимации с кнопкойВоспроизвести...

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

На панели Область анимации выделить по очереди вставленные анимационные эффекты и в контекстном меню, вызываемом щелчком по «стрелочке» справа от эффекта, выбрать команду Параметры эффектов…

В появившемся диалоговом окне на вкладках Эффект и Время установить параметры анимационных эффектов:



Запустить презентацию на выполнение командой [Показ слайдов – С текущего слайда] и наблюдать вращение Земли вокруг Солнца и собственной оси. При необходимости в работу внести поправки. Сохранить готовую работу в собственной папке под именем Вращение.

Задание 2. Создание GIF-анимации с помощью растрового графического редактора GIMP

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

Запустить редактор GIMP командой [Пуск – Все программы – GIMP – GIMP 2].

С помощью команды [Файл – Открыть…] последовательно загрузить в окна изображений файлы 1.gif – 14.gif из папки (Мои документы – 9 класс – Заготовки – Рисунки – Земля). Выделить одновременно файлы изображений 1.gif – 14.gif и нажать Открыть.

Последовательно скопируем изображения 2.gif – 14.gif в окно с изображением 1.gif.

В окне изображения 2.gif ввести команду [Правка - Копировать].

В окне изображения 1.gif ввести команду [Слой –Создать слой] (тип заливки слоя – прозрачный), затем [Правка – Вставить в…].

В окне изображения 3.gif ввести команду [Правка - Копировать].

В окне изображения 1.gif ввести команду [Слой –Создать слой], затем [Правка – Вставить в…].

Повторить шаги 2-3 для всех оставшихся изображений.

Просмотрим результат

В окне изображения 1.gif выполнить команду [Фильтры – Анимация – Воспроизведение…]. Откроется диалоговое окно Воспроизведение фильма.


Чтобы просмотреть анимацию, щелкните по кнопке Воспр. Закройте окно Воспроизведение фильма.

Сохраним полученное изображение как GIF-анимацию.

В окне изображения 1.gif выполнить команду [Файл – Сохранить как…].

В открывшемся окне Сохранение изображения указать путь к собственной папке и присвоить файлу имя Земля.

В появившемся диалоговом окне Экспортировать файл установить переключатель в положение Сохранить как анимацию и щелкнуть по кнопке Экспорт.


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

В текстовое поле Комментарий GIF: можно ввести какой-либо комментарий к изображению.

Задание 3. Создание flash-анимации с помощью редактора Macromedia Flash Pro 8

Запустить редактор Macromedia Flash командой [Пуск – Все программы – Macromedia – Macromedia Flash 8]. Изучить программу.

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

В середине находится Окно рабочего поля, в котором создаются кадры.

Внизу располагается диалоговая панель Свойства, которое позволяет устанавливать тип анимации и настраивать ее параметры.

Справа находится панельИнструменты, позволяющая производить операции над объектами, используемыми в кадрах анимации.

Слева находится группа панелейБиблиотека и Цвет.

Скрытие и отображение тех или иных панелей и окон в окне программы осуществляется в выпадающем меню Окна на текстовой ленте меню.

Выберем ключевые кадры (например, 1, 5 и 9) и нарисуем на них синий квадрат, зеленый треугольник и красный круг.

Щелчком левой кнопки мыши выделить кадр 1 (ключевой по умолчанию) и в левой частиОкна рабочего поля нарисовать синий квадрат, выбрав инструмент Прямоугольник и синий цвет заливки. Выделит кадр 5, щелкнуть по нему правой кнопкой мыши и преобразовать его в ключевой кадр с помощью команды Преобразовать в клавиатуры (вариант – Преобразовать в ключевые кадры).

В центре Окна рабочего поля нарисовать зеленый треугольник, используя инструменты Линия иИнструмент массовой заливки (Заливка).

Выделить кадр 9, щелкнуть правой кнопкой мыши и преобразовать его в ключевой кадр командой Преобразовать в клавиатуры (в ключевой кадр).

В правой части Окна рабочего поля нарисовать красный круг.

Установим тип анимационного перехода между ключевыми кадрами, который позволит автоматически создать промежуточные кадры.

Выбрать ключевой кадр 1 и на панели Свойства с помощью раскрывающегося спискаTween: (Пара:) выбрать пункт Shape (Форма). Повторить действие п. 6 для ключевого кадра 5.

На Монтажной линейке последовательность кадров приобретет салатовый цвет и между ключевыми кадрами появятся стрелки:

Для просмотра полученной анимации ввести команду [Управление – Проиграть]. Для детального просмотра полученной анимации по кадрам выделить первый кадр и последовательно нажимать клавишу > (буква Ю).

Для перемещения по кадрам назад использовать клавишу < (буква Б).

Сохраним анимацию в виде flash-ролика.

Выполнить команду [Файл – Экспорт – Экспорт фильма…].

В появившемся окне Экспорт ввести имя сохраняемого файла («Анимация») и указать путь для сохранения (сохранить в собственную папку).

Откроется диалоговое окно Экспортировать плеер Flash. Удостовериться, что в опциях стоит «галочка» Сжать ролик и с помощью ползунка установить качество изображения (Качество JPEG:).

Нажать OK.

Просмотреть сохраненный flash-ролик в каком-либо flash-проигрывателе. Сохранить проект в собственной папке под именем Анимациякомандой [Файл – Сохранить как…]. Файл проекта будет сохранен с расширением. fla.

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

Анимация

Аппаратное и программное обеспечение. Компьютер с установленной операционной системой Windows 7 , приложение MicrosoftPowerPoint 2013 , графический редактор GIMP 2.4 , редактор MacromediaFlashProfessional 8 .

Цель работы. Научиться создавать анимацию в презентациях, GIF- и flash-анимацию.

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

Задание 2. Создать GIF-анимацию «Вращение Земли» из набора растровых GIF-изображений, показывающих последовательные положения Земли.

Задание 3. Создать flash-анимацию «последовательного преобразования синего квадрата в зеленый треугольник и красный круг.

Задание 1. Анимация в презентации

    Запустить программу разработки презентаций MicrosoftPowerPoint 2013 . Выбрать пустую презентацию.

    На слайде с помощью команды [Вставка – Фигуры ] нарисовать желтый круг (Солнце ), затем выполнить команду [Вставка - Рисунки ].

В диалоговом окне Вставка рисунка выбрать файл Земля. gif (Мои документы – 9 класс – Заготовки – Рисунки ).

Создадим анимационное движение Земли вокруг Солнца и вращение Земли путем задания анимационных эффектов.

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

    На панели Область анимации выделить по очереди вставленные анимационные эффекты и в контекстном меню, вызываемом щелчком по «стрелочке» справа от эффекта, выбрать команду Параметры эффектов

В появившемся диалоговом окне на вкладках Эффект и Время установить параметры анимационных эффектов:


    Запустить презентацию на выполнение командой [Показ слайдов – С текущего слайда ] и наблюдать вращение Земли вокруг Солнца и собственной оси. При необходимости в работу внести поправки.

Задание 2. Создание GIF-анимации с помощью растрового графического редактора GIMP

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

    Запустить редактор GIMP командой [Пуск – Все программы – GIMP GIMP 2 ].

С помощью команды [Файл – Открыть… ] последовательно загрузить в окна изображений файлы 1. gif – 14. gifиз папки (Мои документы – 9 класс – Заготовки – Рисунки – Земля ). Выделить одновременно файлы изображений 1. gif – 14. gif и нажать Открыть .

Последовательно скопируем изображения 2. gif – 14. gif в окно с изображением 1. gif.

    В окне изображения 2. gifввести команду [Правка - Копировать ].

Слой –Создать слой ] (тип заливки слоя – прозрачный), затем [Правка – Вставить в… ].

    В окне изображения 3. gifввести команду [Правка - Копировать ].

В окне изображения 1. gif ввести команду [Слой –Создать слой ], затем [Правка – Вставить в… ].

    Повторить шаги 2-3 для всех оставшихся изображений.

Просмотрим результат

    Фильтры – Анимация – Воспроизведение… ]. Откроется диалоговое окно Воспроизведение фильма .

Сохраним полученное изображение как GIF-анимацию.

    В окне изображения 1. gif выполнить команду [Файл – Сохранить как… ].

В открывшемся окне Сохранение изображения указать путь к собственной папке и присвоить файлу имя Земля .

В появившемся диалоговом окне Экспортировать файл установить переключатель в положение Сохранить как анимацию и щелкнуть по кнопке Экспорт .