Анимация в Adobe Photoshop

Компьютерные технологии

О.Тесельская,
член Союза художников России,
методист Центра непрерывного художественного образования, г.Москва

Анимация в Adobe Photoshop

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

требуются специальные компьютерные программы, которые нужно долго изучать. При этом они сильно удивляются, когда говоришь о том, что и в давно им знакомом Adobe Photoshop можно сделать анимиро­ванное изображение и в дальнейшем использовать его как заставку для wеb-странички.

О том, как это сделать, пойдёт речь в этой статье.

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

З. В основном меню программы щелкните левой клавишей мыши по слову "Выделение" и в открыв­шемся списке выберите "Инверсия".

4. Откройте окно "Слои", в нём дважды щел­кните левой клавишей мыши по словосочетанию "3адний план", в открывшемся диалоговом окне нажмите кнопку "Да". После этого нажмите кнопку квеlя на клавиатуре.

5. Сохраните документ. Процедура сохранения во всех программах похожая, только необходимо выбрать формат, в котором будет сохранен файл. Выберите формат *.Р$В (он позволит сохранить изображение в "слоёном" виде, фон останется по­крытым белыми и серыми квадратиками) и нажми­те кнопку "Сохранить". Не забудьте выбрать или создать папку для сохранения рисунков. Работу с этим файлом мы продолжим, сохранять изменения в нём будем под прежним именем.

б. Поместите в этот файл фоновое изображение. Для этого откройте нужное изображение, выделите его всё или необходимую часть, в основном меню программы щёлкните левой клавишей мыши по слову "Редактирование" и в открывшемся списке выберите "Копировать". После чего подведите курсор мыши к рабочему документу и щёлкните левой клавишей по нему (чтобы его активировать), в основном меню программы щёлкните левой кла­вишей мыши по слову "Редактирование" и в от­крывшемся списке выберите "Вставить".

  1. Изображение фона вставилось поверх изо­бражения диска, переместим его. В окне "Слои" прижмите левой клавишей мыши слой с фоном и переместите его ниже слоя с диском (рис.1).
  2. Изображение фона значительно меньшего раз­мера, чем необходимо, увеличим его. В основном меню программы щёлкните левой клавишей мыши по слову "Редактирование", в открывшемся списке выберите "Трансформирование", в следующем от­крывшемся списке выберите "Масштабирование". Прижимайте левой клавишей мыши маркеры рамки выделения и перемещайте мышь. Когда достигнете желаемого размера, щелкните дважды левой клавишей мыши внутри рамки выделения.
  1. В окне "Слои" перейдите на слой с изображе­нием диска. В основном меню программы щелкните левой клавишей мыши по слову "Изображение", в открывшемся списке выберите "Коррекция", в сле­дующем открывшемся списке выберите "Цветовой тон/Насыщенность...".
  2. В открывшемся диалоговом окне измените цветовое решение диска, перемещая ползунки по шкалам цветового тона, насыщенности и яркости, и нажмите кнопку "Да" (рис.2).
  3. Возьмите инструмент "Горизонтальный текст-маска" ("Horizontal Туре Mask Тооl") и по­кажите область для написания текста (растянув рамку выделения).
  4. Настройте шрифт, напишите текст.
  5. Нажмите кнопку "Создаёт деформирован­ный текст", в открывшемся диалоговом окне вы­берите "Стиль", например "Надутый".
  6. Настройте деформацию, перемещая ползун­ки по шкалам изгиба, искажения по горизонтали и вертикали, и нажмите кнопку "Да" (рис.3).
  7. Возьмите другой инструмент, например "Пе­ремещение", текст преобразовался в выделенную область. Скопируйте ее и вставьте в новый слой.

1б. В строке основного меню программы щел­кните левой клавишей мыши по слову "Слой", в открывшемся списке выберите "Стиль слоя", далее – "Тень".

  1. В открывшемся диалоговом окне настройте параметры тени, добавьте эффект тиснения, после чего нажмите кнопку "Да" (рис.4).
  2. Любым удобным способом продублируйте слой с изображением диска. Копию поверните на 90°.
  3. Поместите в этот файл второе изображение. Переместите слой с ним выше всех слоёв (в окне "Слои"). Измените его размер.
  4. Направляющие нам больше не нужны, скрой­те их. В основном меню программы щелкните левой клавишей мыши по слову "Просмотр", в открывшем­ся списке выберите "Вспомогательные элементы".
  5. Откройте окно "Каналы".
  6. Создайте в нём новый канал (Альфа1) путём нажатия кнопки "Создаёт новый канал".
  7. Возьмите инструмент "Градиент".
  8. В строке настройки инструмента установите цвет градиента кот основного к фоновому, тип "радиальный", режим "нормальный", непрозрач­ность 100°/о.

25. Выполните градиентную заливку, прижимая левую клавишу и перемещая мышь.

2б. В строке основного меню программы щёлкни­те левой клавишей мыши по слову "Выделение", в открывшемся списке выберите "Загрузить вы­деленную область".

27.В открывшемся диалоговом окне в строке "канал" должен стоять кАльфа1я, проверьте это, после чего нажмите кнопку "Да" (рис.5).

28. В окне "Слои" кликните (щелкните левой кла­вишей мыши) по самому верхнему слою. Сохраните результат своей работы перед настройкой анимации, чтобы иметь возможность вернуться к первоначаль­ному (не анимированному) изображению.

  1. В строке основного меню программы щел­кните левой клавишей мыши по слову "Окно", в открывшемся списке выберите "Анимация".
  2. В открывшемся окне настройки анимации сразу появился 1 кадр, нажмите кнопку "Создание копии выделенных кадров", кадров стало 2. В окне "Слои" скопируйте (продублируйте) самый верх­ний слой и сделайте исходный слой невидимым, работать будем с его копией. Нажмите кнопку Delete (Del) на клавиатуре (можно 2-3 раза) (рис.6).
  3. В окне настройки анимации нажмите кноп­ку "Создание промежуточных кадров". В открыв­шемся окне введите нужное число добавляемых кадров в строке "добавить кадров" и нажмите кнопку "Да".
  4. Промежуточные кадры добавились, они не­обходимы для плавного проявления нижних слоёв изображения.
  5. Выделите последний, 7-й, кадр (кликнув по нему), создайте его копию. В окне "Слои" сделайте невидимым верхний слой с изображением диска (по­лоса затемнения на котором вертикальная) (рис.7).
  6. Выделите 7 и 8 кадры анимации и добавьте между ними 3 промежуточных кадра.
  7. Выделите последний, 11-й, кадр, создайте его копию. В окне "Слои" сделайте видимым верхний слой с изображением диска (полоса затемнения на котором вертикальная). Выделите 11 и 12 кадры анимации и добавьте между ними 3 промежуточ­ных кадра.

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

  1. В начале анимации диск постепенно про­является из-под верхнего изображения, потом он вертится, а теперь мы постепенно спрячем диск под верхним изображением.
  2. Для осуществления этой задачи манипули­руем прозрачностью слоя с верхним изображением (в слое, который до этого момента был невидим) и добавляем необходимые промежуточные кадры (рис.8).
  3. Когда вы настроили анимацию изображения, сохраните файл под другим именем, но в формате *.Р$D (возможно, вам понадобится в нем что-то изменить).
  4. В основном меню программы щелкните левой клавишей мыши по слову кФайля и в от­крывшемся списке выберите "Сохранить для Web и устройств...".
  5. В открывшемся окне "Сохранить для Web и устройств" в разделе "Установки" выставите фор­мат оптимизации – GIF, модель редукции цвета – перцепционная, максимальное количество цветов в цветовой таблице – 256. После этого нажмите кнопку "сохранить".
  6. В открывшемся окне выберите папку для сохранения файла (лучше ту же самую, в которой сохраняли все предыдущие файлы), напишите имя файла латинскими буквами, а в строке "Тип файла" выберите только изображение (.gif) и нажмите кнопку "Сохранить".
  7. Может открыться окно предупреждения о не­корректности имён файлов, записанных русскими буквами, нажмите в нём кнопку "ОК".
  8. После завершения процесса сохранения полученный файл можно открыть в любом Web­браузере.

 

 

Искусство в школе: 
2014
№3.
С. 59-61

Оставить комментарий

CAPTCHA на основе изображений
Введите символы, которые показаны на картинке.