Учимся создавать анимацию на уроках информатики

Всё об анимации. Создание и вставка анимированных картинок. Настройка анимации в презентации.

Цели урока:

образовательные

1) конкретизировать понятие “анимация”, существование различных видов анимационных программ, показать на конкретном примере применение анимации в презентации, организовать деятельность учащихся по овладению навыком создании и настройки анимации в проектной работе( презентации) ит.д.;

развивающие:

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

3) способствовать развитию, у учащихся, наблюдательности, творческого мышления, также формированию операционного мышления, направленного на выбор оптимальных решений, развитие навыков и умений применения современных компьютерных технологий в практической и проектной деятельности; научиться создавать движущиеся изображения, используя программы Paint, Power Point, Microsoft Gif Animator, Gif Construcktion Set Professional.

воспитательные:

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

Тип урока: комбинированный интегративный урок с творческим применением знаний и умений.

Вид урока: проектное занятие (смешанный урок с использованием учебной презентации).

Место урока: 4-5 урок по теме “Создание презентаций” в 10-11 классе.

Технология: обучающая, проблемная.

Формы и методы, применяемые на уроке:

Формы:

• групповая, парная, фронтальная,индивидуальная.

Методы:

• наглядный, вербальный, практический, проблемно-поисковый,

Понятия: презентация, слайд, мультимедийные объекты, анимация, демонстрация.

Оборудование:

• компьютерный класс, оснащенный современной техникой, видеопроектор, экран; СД-диск. Компьютерные технологии.

• на компьютерах установлена операционная система Windows XP и пакет Microsoft Office 2007;

• оборудование доски (тема урока, домашнее задание, новые термины);

• презентации к уроку;

• кроссворд,

• раздаточный материал: инструкции к работе, карточки для групповой работы, домашнее задание;

План урока

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

1. постановка целей урока;

2. актуализация знаний.

II. Фронтальный опрос.

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

III. Работа в группах.

Решение кроссворда.

IV. Изучение нового материала.

Просмотр обучающей презентации 1, просмотр презентации 2 с обсуждением. Практическая работа.

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

VI. Непосредственная практическая работа над проектом с компьютером.

VII. Рефлексия.

VIII. Подведение итогов урока.

Подготовительный этап.

В начале изучения темы «Учимся создавать анимацию на уроках информатики» перед учащимися была поставлена проблема: создать презентацию к какому-нибудь предметному уроку физики, химии и информатики.

Были розданы справочные материалы по теме «Всё об анимации», используя интернетресурсы.

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

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

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

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

Ход урока

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

постановка целей урока, актуализация знаний.

Учитель: Здравствуйте, ребята! Рада вас приветствовать на уроке. Наш сегодняшний урок проходит в рамках изучения темы «Учимся создавать анимацию на уроках информатики». Каждый из вас работает над собственным проектом по созданию презентации к конкретному, выбранному вами уроку. Тему урока вы узнаете, если выполните следующее задание: решить анаграммы (в словах изменен порядок букв).

Какие слова зашифрованы?

• енпязтцеира (презентация),

• янтдмиосреац (демонстрация),

• манцииая (анимация).

Учитель: Итак, тема нашего урока – «Всё об анимации. Создание и вставка анимированных картинок. Настройка презентации». Мы должны познакомиться с понятием анимации, узнать, как настраивать анимацию на слайдах и применить полученные знания на практике при разработке своего проекта.

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

II. Фронтальный опрос.

Учитель: Что такое презентация?

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

Учитель: Что можно получить в результате подготовки презентации?

Ученик: В результате подготовки презентации можно получить:

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

• кальки для кодоскопа;

• слайды для слайдоскопа;

• страницы заметок;

• презентацию в электронном виде.

Учитель: Что такое слайд?

Ученик: Слайд – это фрагмент презентации, в пределах которого производится работа над объектами презентации.

Учитель: Что такое мультимедиа технология в презентации?

Ученик: Мультимедиа технология позволяет одновременно использовать различные способы представления информации в презентации: числа, текст, графику, анимацию, видео и звук.

Учитель: Перечислите этапы создания презентации.

Ученик: 1 этап – планирование;

2 этап – выбор оформления и создание фона слайдов;

3 этап – создание текста на слайдах;

4 этап – вставка графических объектов, рисунков, таблиц и диаграмм;

5 этап – вставка звука и видеоклипов в презентацию;

6 этап - настройка анимации,

7 этап – демонстрация презентации.

III. Работа в группах.

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

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

IV. Изучение нового материала. Особенности изложения

Что такое анимация?

Анимация.

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

Вы часто видите рекламные ролики на сайтах в виде изображений или текстовых сообщений, которые сменяют друг друга через определённое время. Это реализуется посредством картинок в формате gif (animated GIF). Рекламодатели используют эту технологию по двум причинам

-такие изображения больше привлекают, чем обычные статические картины;

-за счёт чередования картинок на определённом участке можно помессссстить в несколько раз больше информации.

GIF

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

О форматах.

Начнём с того, что аббревиатура GIF расшифровывается как Graphic Interchange Format, что переводиться как формат обмена графической информации. На самом деле существует два формата типа GIF, а именно GIF87 и GIF89. Цифра в названии обозначает год его появления, и соответственно формат 1989 года имеет больше особенностей и возможностей, в сравнении со своим собратом. Он поддерживает анимацию, чересстрочность и прозрачность, то есть то, что и ценится в современном GIF-формате. Эти особенности мы и разберём.

Ученик 1.Основные характеристики формата.

Начнём с того, что формат поддерживает палитру из 256 цветов, и каждый цвет палитры глубиной в 24 бита на 1 пиксель (иначе 16 миллионов цветов). Размер картинки лежит в пределах от 1х1 до 65535х65535 пикселей. Количество повторов анимации от 1 до 65535 раз, количество же самих кадров не ограниченно, как неограниченно и количество текстовых комментариев и их размер. Время одного показа находиться в пределе от 1/100 до 655 секунд. Если говорить о прозрачности, то она 1-битная, а полупрозрачные цвета отсутствуют. С характеристикой, пожалуй, всё.

Ученик 2.Прозрачность.

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

Ученик3. Чересстрочность.

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

Мы разобрали основные особенности формата, теперь перейдём к программам, которые помогут в работе с форматом. Веб-мастеру будет особенно важно, чтобы программа была удобной, функциональной, лёгкой для освоения. Графика на сайте имеет очень большое значение в его дизайне, продвижении. Это касается не только кнопок сайта, особенностей оформления, но и баннеров, которые будут приглашать посетителя на сайт.

Основные программы анимации

Ученик 4.1) GIF Construction Set Professional

Программа с очень широкими возможностями, несмотря на весь свой простой вид. Компилировать анимацию мы можем не только в GIF, но и в других форматах, к примеру, в MNG, который и по размеру явно меньше, да и цветопередача в нём лучше, а также в формат SWF. И если формат MNG редко где используется, то SWF формат распространён очень и очень широко. В этом большой плюс программы: мы можем нашу анимацию GIF перенести в формат SWF, который имеет некоторые явные преимущества, одно из которых – поддержка звука и анимации одновременно. Но помните, что SWF не поддерживает прозрачность, да и время для отображения кадров в нём фиксировано. Стоит знать ещё и то, что цикличную анимацию в SWF перенести не получится, в другом случае необходимо будет прописывать дополнительные параметры в HTML коде страницы, которые будут повторять цикл.

Создание анимации простое и не обладает чем-либо особенным: создаётся группа картинок с изменяющимся рисунком, далее собирается в единый файл, а в анимации мы видим следующие друг за другом картинки. В контекстном меню спрятаны различные инструменты, такие как обрезание, удаление или объединение кадров, добавление тени и выравнивание цветокоррекции и так далее. Ещё одна важная функция программы, это “суперсжатие”. Так в Интернете размер имеет очень большое значение, функцией порой просто необходимо пользоваться.

Ученик 5. 2) Easy GIF Animator Pro

Программа главным образом рассчитана для создания баннеров и анимации на сайте, и если вы на это и рассчитываете, то Easy GIF Animator Pro для вас. Она полностью оправдывает своё название, создание проекта в ней элементарное и быстрое, что достигается за счёт хорошо продуманного процесса создания анимации, и, конечно же, интерфейса и заготовок. Всё что нужно – под рукой, а заранее подготовленные мастера для создания баннера, кнопки для сайта и далее упрощают работу – главное, что в такие заготовки заложены все необходимые параметры, размеры, расширения, и если вы не можете вспомнить что и как делать, то вам предоставят выбор. Если вам необходимо создать простейшую анимацию без особых сложных предъявлений к дизайну, то опять же мастер создания анимации поможет создать анимацию за пару минут. К этому прилагаются различные эффекты появления – из за угла, снизу, сверху, плавное появление и тому подобное. Инструментов программы вполне хватит для создания баннера с нуля, в ней есть возможность добавлять текст, делать заливку, причём не только градиентным цветом, но и необходимой текстурой, а также создавать геометрические фигуры.

Ученик6.3) Ulead GIF Animator

Программа является очередным продуктом компании Ulead, которая известна высококачественной продукцией, потому и Ulead GIF Animator лишь подтверждает подобную положительную репутацию – программа удобна, продуманна до мелочей, функциональна, в общем, хороша во всём.

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

Начнём с того, что эффектов в программе достаточно, и этот набор составляет не только стандартные эффекты, но и такие приложений как Video Studio и Media Studio Pro, которые присущи видеоредакторам. Более того, набор можно расширить, ведь программа поддерживает фильтры от Photoshop и Adobe, и вам остаётся лишь указать их расположение. Но тут и всплывает некий минус – новые, довольно поздние версии фильтров программой поддерживаться не будут. Режим оптимизации кадров выглядит как экран, разделённый надвое, в одной части показываются кадры до сжатия, в другой, соответственно, после. Все изменения качества сжатия будут тут же отображаться на половине, выводящей конечный результат, потому вы сразу можете провести оценку работы. Цветовая палитра поможет в подборе наиболее подходящего результата, как и параметры Lossy и Dither. Lossy отвечает за потери качества, за их количество, а Dither отвечает за передачу градиентного перехода цвета, за её точность. Управление кадрами можно осуществлять с панели настроек. Кадры здесь выглядят как слои. Такое же управление осуществляется и с панели кадров, они показаны будут в виде слайдов.

Имеется у программы и довольно странная функция. Трудно придумать для неё полезное и широкое применение, но раз функция имеется, надо о ней упомянуть. Программа может упаковывать созданную анимацию в формат EXE. При запуске файла поверх окон всплывает созданная нами анимация и воспроизводится, а как использовать это, решайте сами.

Ученик 7. 4) Active GIF Creator

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

Отдельно стоит сказать о Script Editor, встроенном в программу, который сильно упрощает работу, автоматизировав её. Работает это следующим образом: анимационные скрипты, имеющие расширение *.agif, сохраняются в проекте и далее многократно используются, в результате чего мы можем автоматически менять отображение, место или размер необходимого объекта. Не обошлось и без различных готовых наборов, как например наборы стрелок, символов, различной графики. Это явно сэкономит время вэбмастеру при оформлении меню на страничке сайта.

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

Указав скорость вашего Интернет-соединения, программа сама оптимизирует размер анимации, и более того, сохраняя, предоставит вам готовый HTML код для установки на страницу сайта. В предварительном просмотре вы сможете выбрать фон и цвет текста.

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

Ученик 8.5) Selteco Bannershop GIF Animator

Программа основным образом рассчитана для создания баннеров, название программы довольно ясно говорит нам об этом. Поддерживаются все стандартные форматы баннеров, от самых маленьких до типов skyscraper. Режим создания анимации и мастер создания слайдов работают одинаково, и довольно просто: мы составляем список файлов, задаём время до появления следующего кадра и сохраняем проект в GIF, вот и всё.

Selteco Bannershop GIF Animator содержит три группы эффектов. Первый, Intro Animation, позволяет настраивать появление определённого кадра, Outro Animation, соответственно, исчезновения кадра. Возможности этих групп очень широки, и они большие, чем простые эффекты переходов. Третья группа, Animation, позволяют управлять движением изображения: переливаться, дрожать, скользить и так далее.

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

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

Сохранять мы можем сразу в виде HTML странички, в коде которого будет указано название нашего баннера.

Программа также содержит поддержку WMF формата и позволяет конвертировать созданную нами анимацию в формат AVI.

Ученик9. 6) CoffeeCup GIF Animator

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

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

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

Программа также поддерживает сохранение в формате SWF, и предоставляет нам готовый код для размещения его на нашей веб-странице.

Ученик 10. 7) Microsoft GIF Animator

Программа очень популярна, причём не своей функциональностью, которая, кстати, довольно невелика, а расчетом на рядовых пользователей, потому о ней нельзя не упомянуть. Microsoft GIF Animator выполняет лишь функцию составления анимации, то есть в неё мы будем загружать предварительно созданные в других редакторах картинки-кадры, а в программе мы создадим анимацию, нам остаётся лишь задать задержку, время отображения и количество повторов анимации. Плюс программы в том, что она осваивается за считанные минуты и быстро работает. А вот минусы более существенны: наш мультик мы составим только из кадров, сохраненных предварительно в формате GIF, что часто неудобно.

Ученик 11. 8) GIF Movie Gear

Говоря о GIF Movie Gear стоит сказать, что её использование возможно скорее как вспомогательной программой, то есть в комплекте с каким-нибудь редактором. Дело в том, что в самой утилите отсутствует возможность редактирования изображения, кроме как изменения рисунка по пикселям. Зато имеется интересная возможность запуска вспомогательной программы. Вы выбираете программу для редактирования рисунков, и при запуске GIF Movie Gear выбранный редактор будет запускаться совместно.

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

Ученик 12. 9)Программа Animated Captures Maker – это инструмент для создания презентаций и уроков по использованию программ. Программа очень простая, но мощная в записи экрана, что позволяет вам фиксировать движения курсора, выбор меню, всплывающие окна, слои окон, печать и все, что вы видите на вашем экране. Вы можете фиксировать экран многими способами, включая полноэкранное фиксирование, фиксирование области, фиксирование активного окна, объектов. Программа имеет простой в использовании дружественный интерфейс. Все, что вы видите на экране, программа Animated Captures Maker запишет легко и быстро в формате анимированного GIF. Программа особенно подойдет для создания демо, уроков и тренинговых анимаций.

С созданными уроками вы можете рекламировать вашу программу или ответы на вопросы о вашей программе визуально для поддержки ваших клиентов. Анимированный формат GIF – это самый дружественный и совместимый с графикой, что может быть использовано для веб-анимаций.

Формат GIF может хранить информацию внутри бинарных данных, а также создавать высококачественные результаты путем сжатия, которое может уменьшить размер файла, сохраняя целостность рисунка. Формат анимированный GIF поддерживается большинством браузеров как напрямую, так и через плагины. Вы можете также просматривать анимированные GIF в формате справки Windows (*.CHM, также известный как "составленный HTML").

Используйте справочный материал

Одной из наиболее сложных областей анимации, безусловно, является моделирование движений живых существ, и особенно человека. Если при анимации человека вы уделите недостаточно внимания мельчайшим жестам и естественности перемещения центра тяжести, это сразу же будет бросаться в глаза. Каждый из нас легко заметит малейшую фальшь в движении других людей. Единственный способ добиться правдоподобия — наблюдать за людьми в видео- и кинофильмах.
В качестве исключительно полезного пособия Тед Бэкман рекомендует книгу Идвирда Мюйбриджа (Eadweard Muybridge) «The Human Figure in Motion» (1989, Dover Pub.).

Тед Бэкман, сверяясь с книгой Идвирда Мюйбриджа, с помощью D Studio MAX создает "боковой вид бегущего человека. Таким образом ему удается воспроизвести естественные и правдоподобные человеческие движения.

Двумерная и трехмерная анимация, создаваемая как традиционными (без использования вычислительных средств), так и компьютерными методами, основана на одном и том же принципе: если ряд статичных изображений показать в достаточно быстром темпе, то человеческий глаз свяжет их вместе и примет за непрерывное движение. Для того чтобы несколько изображений объекта были восприняты глазом как плавное движение этого объекта, может хватить скорости 8 компьютерных экранов в секунду. В отличие от традиционной целлулоидной анимации, где каждый кадр рисуется вручную, в компьютерной 2D-анимации часть рутинной работы берет на себя программа. Можно, например, задать движение по траектории (программа создаст соответствующие промежуточные кадры) или плавно изменить палитру в течение нескольких кадров.

1. Учитель демонстрирует на проекторе или на компьютере этапы создания изображений.

Учитель: Делаем вывод: при настройке анимации надо учитывать следующие требования (изложены в инструкции):

• порядок следования объектов (заголовок, подзаголовок, графический объект, текст);

• одна анимация не должна перекрывать другую;

• текст должен быть читаемым;

• изображение на слайдах должно быть отчетливым и простым;

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

VI. Практическая работа над проектом за компьютером.

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

Ученик:

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

• работать за компьютером надо на расстоянии 60-70 см, соблюдая правильную посадку, не сутулясь, не наклоняясь;

• ученикам, имеющим очки для постоянного ношения, - в очках.

Учитель: Переходим к практической работе с компьютером. Откройте свои презентации и настройте анимацию на готовых слайдах с учетом всего вышесказанного. В своей работе используйте инструкцию по настройке анимации.

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

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

1. Учитель выдает карточки с планом.

№1. Карточка-инструкция для сильных учащихся.

Здесь код вставки Flash (.swf) на сайт.

96B8-444553540000" codebase="http://download.macromedia.com/pub/

shockwave/cabs/flash/swflash.cab#version=5,0,0,0"

WIDTH="300" HEIGHT="150"

WIDTH="300"

HEIGHT="150"

TYPE="application/x-shockwave-flash"

PLUGINSPAGE="http://www.macromedia.com/

shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash"

EMBED

OBJECT

--------------------------------------------------------------------------------

Ниже укороченный код для XHTML

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

--------------------------------------------------------------------------------

type="application/x-shockwave-flash" data="../flash/waterimage1.swf"

width="300" height="150"

object

--------------------------------------------------------------------------------

Откройте новый файл.

Инструкции к работе. Работа сильных учащихся в группе.

Создание статических изображений через CorelDpaw

Откройте новый файл.

Введите текст "inet". Для этого нажмите мышью кнопку Text Tool на панели графики, установите курсор в поле документа, нажмите левую кнопку мыши и введите текст.

Отредактируйте введенный текст следующим образом. Выделите редактируемый текст, для че-го нажмите мышью кнопку Pick Tool на панели графики, кликните по редактируемому тексту. С помощью панели свойств установите размер шрифта 36, включите свойства полужирный ( кнопка В ) и курсив ( кнопка I ).

Преобразуйте текст в кривые. Для этого нажмите правой кнопкой мыши на тексте. Выберите в выпадающем меню команду Convert To Curvers.

Используйте кнопку Zoom Tool для получения удобного для работы масштаба.

Измените цвет объекта "inet". Для этого предварительно выделив его (кнопка Pick Tool ), вызовите окно градиентной заливки (кнопка Fill Tool на панели графики + Fountain Fill Dialog ). В появившемся окне выберите настройки по своему вкусу, нажмите кнопку ОК.

Сделайте семь копий с полученного обьекта и разместите их последовательно в одну горизонтальную линию. При этом испольуйте команды Edit|Copy и Edit|Paste. Поверните обьекты со второго по восьмой на соответственно 45, 90, 135,180, 225, 270, 315 градусов. Для этого выделив объект вводите в поле Angle of Rotation значение угла поворота. В результате у Вас должна получиться следующая картинка.

Теперь каждый фрагмент надо сохранить в отдельный gif файл. Для этого используйте команду File|Export.

На этом первый этап завершен. У Вас есть восемь кадров в виде отдельных gif файлов. Осталось лишь объединить их в анимированную картинку. О том, как это сделать, рассказано на следующей странице -

Объединение кадров в "живую" картинку.

Создание "живой" картинки с помощью GifCon32.

Здесь рассмотрим, как объединить несколько готовых статичных кадров в один подвижный анимированный GIF файл. Если Вы не знаете, как подготовить кадры для GIF анимации, посмотрите страницу Подготовка кадров.

Запустите GifCon32

Откройте новый файл с помощью команды File|New.

Добавьте в документ модуль Loop. Для этого выполните команду Insert|Loop.

Добавьте в документ модуль Image. Для этого выполните команду Insert|Image. В открывшемся окне выберите файл 1.gif и нажмите ОК. В следующем окне установите переключатель в положение Use a local palette for this image и нажмите ОК. Аналогично добавьте остальные семь картинок. Убедитесь, что модули Image расположены в документе последовательно от 1 до 8.

Вставьте перед модулем Image1 модуль Control. Для этого выделите в документе модуль Loop и выполните команду Insert|Control. Аналогично вставьте еще семь модулей Control перед остальными модулями Image. В результате долен получиться следующий документ:

HESDER GIF98a Screen (640 x 480)

LOOP

CONTROL

IMAGE 1.gif54 x 32. 256 colors

CONTROL

IMAGE 2.gif54 x 32. 256 colors

. . .

. . .

CONTROL

IMAGE 8.gif54 x 32. 256 colors

Отредактируйте свойства модулей Control. Для этого выделите один из модулей и выполните команду Blok|Edit. В открывшемся окне включите переключатель Transparent color. Нажмите кнопку с указателем и в открывшемся окне кликните мышью в картинке по тому цвету, который должен стать прозрачным ( белый цвет фона ). В строке Remove by установите Background. В поле Delay установите значение 20. Нажмите кнопку ОК. Проделайте тоже самое с остальными модулями Control.

Отредактируйте свойства модулей Image. Для этого выделите первый модуль и выполните команду Blok|Edit. Установите свойства Image left и Image top - соответственно 0 и 40. Нажмите кнопку ОК. Проделайте тоже самое с остальными модулями Image, установив следующие значения: Image2 - 7/3, Image3 - 40/0, Image4 - 3/7, Image5 - 0/40, Image6 - 7/3, Image7 - 40/0, Image8 - 3/7.

Нажмите кнопку View для просмотра результатов своей работы.

Чтобы отменить показ - нажмите правую кнопку мыши.

Сохраните файл, а затем откройте его с помощью брoузера.

Для уменьшения размеров полученного Gif файла воспользуйтесь программой сжатия, например SmartSaver Pro или Advanced GIF Optimizer или Web Graphics Optimizer .

Карточка-инструкция для более слабых учащихся.

План создания движущегося изображения

В графическом редакторе Paint создайте фон будущего изображения, например Рисунок 1.