Работа 8.1. Создание GIF-анимации в пакете Adobe Photoshop.

Цель работы: Освоение способов создания анимированных изображений в формате GIF в онлайн версии многофункционального графического редактора Adobe Photoshop.

Порядок выполнения работы.

1. Изучить теоретическую часть.

2.  Выполнить задания в соответствии с заданным вариантом и отразить результате в отчете

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

Теоретическая часть

GIF (англ. Graphics Interchange Format – формат для обмена изображениями) – формат растровых графических изображений, позволяющий создавать простую анимацию – чередующиеся кадры. Анимация представляет собой последовательность из нескольких статичных кадров и информацию о времени показа каждого кадра на экране. Можно сделать, чтобы вслед за последним кадром начиналось воспроизведение первого кадра и т.д. Такая анимация называется цикличной.

Формат GIF способен хранить сжатые данные (алгоритм сжатия LZW, Лемпеля-Зива-Велча). Не зависящий от аппаратного обеспечения формат GIF был разработан в 1987 г. фирмой CompuServe для передачи растровых изображений по компьютерным сетям. В 1989-м формат был модифицирован, была добавлена поддержка анимации.

Число цветов палитры – от 2 до 256. Число повторов анимации – бесконечное. Время показа одного кадра анимации – от 0,01 секунды до 655 секунд. Число кадров анимации – неограниченно.

Процесс подготовки GIF-анимации можно условно разделить на несколько этапов:

– создание отдельных кадров;

– генерация движущегося изображения;

– оптимизация целевого файла.

Для создания последовательности растровых изображений и для их преобразования в GIF-анимацию можно использовать многофункциональные растровые редакторы (Adobe Photoshop, CinePaint, cosmigo Pro Motion, PhotoLine) или специальные редакторы GIF-анимации (Gif Construction Set(tm) Professional, Animagic Gif, Ulead Gif Animator, WWW Gif Animator, Xara Webster, Gif Movie Gear).

В Интернете также есть ресурсы, предлагающие создание GIF-анимации онлайн: http://gifovina.ru/, http://minimultik.ru/, http://ru.toolson.net/GifAnimation.

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

Хотя к настоящему времени создан новый формат PNG, формат GIF по-прежнему широко используется и особенно востребован и широко используется на страницах сайтов в Интернете.

 

Практическая часть

Подготовка к работе.

· Создайте папку с Вашей фамилией.

·  Файлом отчета по данной работе является файл GIF-анимации. Именем файла GIF-анимации должна быть фамилия студента с его инициалами, находящийся в папке

 

ПРИМЕЧАНИЕ. В данной работе не рекомендуется использовать Internet Explorer. Рекомендуется – Chrome.

 

Выполнение работы

1. Запустите браузер.

2. Откройте страницу http://photoshop.domfailov.ru/ (рис. 8.1.1).

На данном сайте находится бесплатная онлайн версия Adobe Photoshop.

 

 

 

Рис. 8.1.1. Первая страница сервера http://photoshop.domfailov.ru

3. Нажмите Загрузить изображение с компьютера. Из папки с номером учебной группы (или папки с методичкой) загрузите файл Часы60.jpg (рис. 8.1.2).

 

 

Рис. 8.1.2.  Вид загруженного файла ЧАСЫ

 

4. С помощью панели «Навигатор» увеличьте масштаб изображения до 150 % и далее работайте с таким масштабом.

Для перемещения по изображению используйте палитру инструмент «Рука» .

5. Используя инструмент Многоугольное лассо  , выделите секундную красную стрелку (рис. 8.1.3), для чего выполните следующие действия:

· В горизонтальном меню нажмите на лассо  ,

· затем справа найдите символ .

6. В строке меню нажмите Редактировать, затем Вырезать. Вырезанную стрелку поместите на новый рисунок. Для создания нового рисунка в строке меню нажмите Файл, затем Новый рисунок. Затем нажмите Редактировать, затем Вставить (рис. 8.1.4).

 

 

 

Рис. 8.1.3. Выделение секундной стрелки

 

 

Рис. 8.1.4. Новый рисунок с секундной стрелкой

 

7. Отредактируйте изображения: закрасьте часовую стрелку и другие элементы циферблата часов. Для определения цвета раскрашивания используйте инструмент Пипетка . Для раскрашивания используйте инструмент Кисть   (рис. 8.1.5).

 

 

Рис. 8.1.5.

 

8. Верните минутную стрелку на циферблат часов (рис. 8.1.6). При помощи инструмента Перемещение  расположите стрелку в предназначенное для нее место на циферблате. В строке меню выберите Редактировать, затем Free transform. Либо используйте элемент  на панели инструментов. Разверните стрелку, чтобы она показывала на 60 секунд.

 

 

Рис. 8.1.6

 

9. Сохраните изображение в формате JPG. Для этого в строке меню нажмите Файл, затем Сохранить.    

10. В строке меню выберите Редактировать, затем Free transform. Разверните стрелку, чтобы она показывала на 1 секунду (рис. 8.1.7). Сохраните изображение в формате JPG, дав файлу другое имя.

 

 

Рис. 8.1.7. Секундная стрелка показывает 1 секунду

11. Последовательно сохраните изображения часов с разными показаниями секундной стрелки 1, 2, …, 5 секунд в папке с именем, соответствующим вашей фамилии (рис. 8.1.8).  

 

 

 

Рис. 8.1.8. Секундная стрелка показывает 5 секунд

 

12. Откройте http://gifovina.ru/ (рис. 8.1.9) (С браузером Opera возможны проблемы с загрузкой).

На данном сайте находится бесплатная программа создания GIF-анимации онлайн.

 

 

Рис. 8.1.9. Первая страница сервера http://gifovina.ru

 

13. В правом верхнем углу нажмите Добавить кадры с компьютера. Последовательно загрузите файлы с изображением часов с разными показаниями секундной стрелки 60, 1, 2, …, 5 секунд (рис. 8.1.10).

 

 

Рис. 8.1.10. Загруженные файлы со всеми показаниями часов

 

 

 

Рис. 8.1.11. Готовая анимация

14. В нижней части экрана нажмите Готово

15. Сохраните GIF-анимацию нажав кнопку Скачать (рис.8.1.11).

16. Просмотрите GIF-анимацию при помощи браузера. 

17. Запишите файл с GIF-анимацией в Вашу папку и скопируйте ее в папку преподавателя (с номером Вашей группы).

18. Сохраните материалы данной работы для их использования в дальнейших работах.

Контрольные вопросы

1. К какому виду компьютерной графики относится формат GIF?

2. Что представляет собой GIF-анимация?

3. Какая GIF-анимация называется цикличной?

4. Какими параметрами управляют GIF-анимацией? Какие значения могут принимать эти параметры?

5. Из каких этапов состоит подготовка GIF-анимации?

6. На каких сайтах Интернета можно создать GIF-анимацию онлайн?

7. Перечислите многофункциональные растровые редакторы, поддерживающие создание GIF-анимации.

8. Перечислите специальные редакторы GIF-анимации.

9. Где в основном используется формат GIF?

10. Какой формат в настоящее время рассматривается как альтернатива формату GIF?