Картинки-анимации могут выступать не только украшением страницы или поста, но и нести полезную информацию. Такого рода картинки быстрее привлекают внимание, а также обеспечивают более продуктивное взаимодействие пользователя с интерфейсом. Как создать анимированные изображения с помощью ресурсов Photoshop – читайте в данной статье.
Алгоритм создания GIF-анимации в Photoshop
GIF-анимация или покадровая анимация представляет собой последовательную смену заданных вами изображений. Запустив графический редактор Photoshop, загружаете серию подготовленных заранее картинок. Именно они и будут образовывать вашу анимацию.
- Переходите во вкладку “File” и среди пунктов выпавшего перечня выбираете сценарии (“Scripts”).
- Далее обращаетесь к опции загрузки файлов в стек (“Load Files into Stack”).
- Выбор необходимых картинок для создания анимации происходит через клавишу “Обзор”. Т. к. вам необходимо загрузить серию изображений, зажимаете клавишу Shift и выбираете необходимые файлы. Жмете “Ок”. В результате все изображения загрузятся в один файл, объединяющий несколько слоев. Слои, расположенные в правой половине рабочего поля и будут кадрами вашей GIF-картинки.
- Следующий шаг – переход к шкале времени. Работая с англоязычной версией редактора, пользователю необходимо перейти во вкладку “Window” (окно), а после выбрать пункт “Timeline” – собственно шкала времени.
- В центральной части панели, появившейся в нижней части окна Photoshop, по нажатию стрелки выбираете опцию создания анимации кадра – “Create Frame Animation”. Выполняете данную команду, нажав по этой центральной клавише.
- Далее приступаете к превращению загруженных на начальном этапе слоев в анимационные кадры. Для этого щелкаете однократно по кнопке меню шкалы времени (расположена в правом верхнем углу центрального блока шкалы времени) и выбираете вариант создания кадров из слоев – “Make Frames From Layers”. Если вы хотите видеть смену слоев-кадров в обратном порядке, выбираете вариант “Reverse Frames”.
- Результат вашей работы можно увидеть по нажатию клавиши пробела или кнопки воспроизведения на шкале времени.
- Заключительный шаг создания GIF-анимации – зацикливание, т. е. непрерывный повтор сменяющихся за один цикл кадров. Для этого в левой нижней части панели шкалы времени щелкаете по небольшой стрелочке и выбираете вариант постоянной смены кадров – “Forever”. Скорость смены картинок устанавливается для каждого кадра по щелчку стрелочки под ним – выбираете подходящее значение или устанавливаете собственный вариант.
Для сохранения получившейся анимации вновь переходите к разделу “File”.
- Выбираете пункт сохранения для Web (“Save for Web”). Данная строка может быть вынесена отдельно, а может быть “спрятана” в экспорте (“Export”).
- Заполняете следующие поля:
- Поле набора (“Preset”) – GIF 128 Dithered.
- В графе цветов (“Colors”) – 266.
- В поле параметров повтора (“Looping Options”) выбираете вариант постоянной смены (“Forever”).
- При необходимости корректируете размеры файла (в нижнем левом углу “Image size”).
- Кликнув клавишу “Save”, сохраняете файл и указываете его место хранения.
Алгоритм создания анимации в Photoshop из видео
Первый этап предполагает преобразование кадров видео в отдельные слои для создания покадровой анимации.
- Запускаете редактор Photoshop и переходите к разделу “File”.
- Загружаете фрагменты видео в слои – перейдя к пункту импортирования (“Import”), выбираете строку “Video Frames to Layers”.
- Далее, выбрав видео файл, кликаете клавишу “Открыть”.
- Для завершения преобразования фрагментов видео в многослойный файл жмете “Ок”.
Дальнейшие действия повторяют алгоритм для создания антимации из серии картинок (описан выше).
Используя алгоритм создания покадровой анимации, можно работать не только с уже готовыми изображениями или сюжетами видео, но и с самостоятельно созданными наборами картинок. Вооружившись карандашом (“Pencil Tool”), например, можно создать для начала серию картинок-рисунков в стиле пиксель-арт, которые затем также объединить в анимированный сюжет.