GIF-анимация

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

Для подготовки анимации в программе ImageReady необходимо создать множество кадров изображения с помощью палитры Animation (Анимация), показанной на рис. 23.127. Затем можно редактировать отдельные слои каждого кадра с помощью палитры Layers (Слои), причем у каждого кадра будет собственная уникальная совокупность установок на палитре Layers. И наконец, надо сохранить последовательность кадров в виде одного GIF-файла — теперь анимация готова для просмотра в интерактивном режиме.

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

Перемещение элемента изображения с помощью анимации

Создадим анимационный эффект для какого-либо изображения.

  1. Откройте или создайте изображение, содержащее фоновый слой и прозрачный слой с рисунком какого-либо предмета (рис. 23.128). Как это сделать, рассказано в разделе «Маскирование фигур с помощью команды Extract» главы 5 и разделах, посвященных различным методам стирания изображения, в конце главы 12.

Рис. 23.127. Палитра Animation

Рис. 23.128. Слои изображения на вкладке Layers

Рис. 23.129. Перемещение элемента слоя к краю основного окна

Рис. 23.130. Перетаскивание элемента изображения к другому краю основного окна

Рис. 23.131. Исходный (начальный) и скопированный (последний) кадры анимации

  1. Откройте палитру Animation (Анимация), щелкнув по вкладке Animation (Анимация) или выполнив команду Window > Show Animation (Окно > Показать палитру Animation).
  2. Выберите слой на палитре Layers (Слои).
  3. С помощью инструмента Move (Перемещение) перетащите элемент изображения к краю основного окна (рис. 23.129). Соответствующая миниатюра на палитре Animation будет обновлена, чтобы отобразить новое положение элемента.
  4. В нижней части палитры Animation щелкните по кнопке Duplicate current frame (Дублировать текущий кадр). Скопированный кадр будет выделен.
  5. Слой, выбранный на шаге 3, должен оставаться выделенным.
  6. С помощью инструмента Move (клавиша V) перетащите элемент слоя на другую сторону основного окна (рис. 23.130). Текущая миниатюра на палитре Animation будет соответствующим образом обновлена (рис. 23.131). Оставьте этот слой выделенным!
  7. На палитре Animation щелкните по кнопке Tween (Промежуточные кадры) для построения промежуточных кадров между уже выбранными.
  8. В диалоговом окне Tween (Промежуточные кадры) поставьте переключатель Layers (Слои) в одно из следующих положений:

Затем установите в группе Parameters (Параметры) флажки тех параметров, которые будут изменяться в промежуточных кадрах: Position (Расположение), Opacity (Непрозрачность) и/или Effects (Эффекты) (подробнее об эффектах см. раздел «Эффекты слоя» главы 14).

Из всплывающего меню Tween with (Диапазон промежуточных кадров) выберите режим Previous Frame (Добавление промежуточных кадров между выделенным кадром и предыдущим).

Если до открытия диалогового окна Tween (Промежуточные кадры) было выделено несколько кадров, то во всплывающем меню Tween with (Диапазон промежуточных кадров) будет доступна только опция Selection (Добавление промежуточных кадров между выделенными).

Рис. 23.132. Диалоговое окно Tween

Другие опции анимации

Нажав клавишу Shift и щелкая мышью, можно выделить несколько кадров. Перетащите один или группу кадров на нужное место.

Для того чтобы разместить каждый кадр в слое, выберите из меню палитры Animation (Анимация) пункт Flatten Frames Into Layers (Поместить кадры в слои). Существовавшие до этого слои не будут удалены.

С помощью команды Revert Frames (Обратный порядок кадров) из меню палитры Animation можно поменять последовательность воспроизведения кадров. Эта опция эквивалента воспроизведению анимации в обратном порядке.

Рис. 23.133. Палитра Animation после добавления промежуточных кадров

Повторное создание промежуточных кадров

Для того чтобы повторить операцию создания промежуточных кадров, выделите все ранее созданные промежуточные кадры, щелкая мышью при нажатой клавише Shift, и перетащите их на кнопку Delete (Удалить). Отредактируйте один из двух оставшихся кадров, а затем снова примените команду Tween (Промежуточные кадры).

Далее укажите в поле Frames to Add (Добавить кадры) количество кадров, которое будет добавлено (от 1 до 100). Чем выше это значение, тем более плавной (без разрывов) будет анимация, но размер файла и время его загрузки увеличится.

  1. Щелкните по кнопке ОК (рис. 23.133). Теперь можно предварительно просмотреть анимацию (см. раздел «Предварительный просмотр анимации»). При воспроизведении элемент слоя будет плавно перемещаться от одного края основного окна к другому.

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

Если необходимо, чтобы загрузка и воспроизведение анимации происходили быстро, то используйте маленькие размеры кадров (примерно 200x200 пикселов или меньше).

Постепенное исчезновение или появление картинки

Если вы хотите, чтобы картинка исчезала или появлялась с одновременным перемещением по Web-странице или без него, необходимо отрегулировать непрозрачность изображения вместе с корректировкой его расположения или без этого. Следуйте инструкциям, которые изложены в разделе «Перемещение элемента изображения с помощью анимации», но при выполнении шага 4 выберите начальное значение непрозрачности слоя (рис. 23.134). Затем при выполнении шага 7 выберите конечное значение непрозрачности (рис. 23.135). Убедитесь, что установлен флажок Opacity (Непрозрачность) в диалоговом окне Tween (Промежуточные кадры) - см. рис. 23.136.

Удаление кадров из анимации

Для того чтобы удалить кадр, щелкните по нему, затем выполните команду Delete Frame (Удалить кадр) в меню палитры Animation (Анимация), либо перетащите кадр на кнопку Delete (Удалить), расположенную на палитре (это действие может быть отменено). Если вы хотите удалить все кадры анимации, за исключением первого, в меню палитры Animation воспользуйтесь командой Delete Animation (Удалить анимацию) и щелкните по кнопке Delete (Удалить).

Рис. 23.134. Установка значения в поле Opacity для первого кадра анимации

Рис. 23.135. Установка значения в поле Opacity для второго кадра анимации

Рис. 23.136. После построения промежуточных кадров рубанок перемещается влево, и постепенно появляется слово «Plane»

Рис. 23.137. Опции воспроизведения анимации

Не переходите к другой программе и не открывайте ее, а также-не выбирайте команду Preview in [browser] (Предварительный просмотр в [браузер]) во время воспроизведения анимации. Дело в том, что воспроизведение будет продолжаться в фоновом режиме и отнимать время у того приложения, в которое вы перешли.

Выбор параметров воспроизведения анимации

Из всплывающего меню, расположенного в нижнем левом углу палитры Animation (Анимация), выберите режим воспроизведения, указывающий, как будет воспроизводиться цнимация: Once (Однократно) или Forever (Непрерывно в цикле) -см. рис. 23.137. Либо включите опцию Other (Иначе), чтобы указать определенное количество воспроизведений анимации, а затем щелкните по кнопке ОК. Старайтесь не создавать анимацию, воспроизводимую до бесконечности - это может не понравиться человеку, просматривающему Web-страницу.

Чтобы определить длительность показа отдельного выделенного кадра в процессе воспроизведения, выберите значение времени задержки (delay value) из всплывающего меню Select frame delay time (Выбрать время задержки кадра), расположенного под кадром на палитре Animation (Анимация) - см. рис. 23.137. Для каждого кадра может быть установлено свое время задержки. Опция No delay (Без задержки) эквивалентна нулевой задержке. Также можно выбрать опцию Other (Другое) и указать время задержки (от 0 до 240 сек), а затем щелкнуть по кнопке ОК.

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

Параметры, которые можно изменять при создании промежуточных кадров

В анимацию можно включить изменение расположения элемента слоя, изменение прозрачности слоя либо переход от одного эффекта слоя к другому (за исключением эффекта Gradient/Pattern (Градиент/Узор), который нельзя использовать в сочетании с командой Tween (Промежуточные кадры)). Либо можно просто создавать промежуточные кадры между моментами включения и выключения эффекта слоя (эффекты слоя рассмотрены в разделе «Эффекты слоя» главы 14). Так как все эти преобразования задаются с помощью палитры Layers (Слои), то они никак не влияют на настоящие точки слоя. (Анимационный эффект, рассмотренный далее в разделе «Анимация покачивания предметов», влияет на пикселы слоя.)

Предварительный просмотр анимации

Осуществим предварительный просмотр анимации.

  1. В основном окне выберите вкладку Original (Исходное изображение) или Optimized (Оптимизированное изображение).
  2. Если первый кадр не выделен, то в нижней части палитры Animation (Анимация) щелкните по кнопке Select first frame (Выделить первый кадр) - см. рис. 23.138.

Рис. 23.138. Кнопки управления воспроизведением на палитре Animation

Рис. 23.139. Дублирование кадра анимации

  1. Щелкните по кнопке Play (Проиграть) -см. рис. 23.138. Анимация будет воспроизводиться чуть медленнее, чем должна. (Предварительный просмотр в программе ImageReady происходит медленнее, чем в браузере.)
  2. Щелкните по кнопке Stop (Остановить), которая имеет вид квадрата, чтобы приостановить воспроизведение (рис. 23.138).
  3. Сохраните файл, затем щелкните по кнопке Default Browser (Предварительный просмотр в браузере по умолчанию), расположенной на панели инструментов. Щелкните по кнопке Back (Назад), чтобы вернуться в программу ImageReady, когда просмотр будет закончен. Если анимация не воспроизводится в браузере, следуйте инструкциям, которые даны в разделах «Кадрирование изображения» и «Уменьшение размера изображения».

Анимация покачивания предметов

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

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

  1. Откройте изображение и палитру Animation (Анимация).
  2. В нижней части палитры Animation щелкните по кнопке Duplicate current frame (Дублировать текущий кадр) - см. рис. 23.139. Теперь будет выделен дубликат кадра.
  3. На палитре Animation щелкните по кнопке Tween (Промежуточные кадры), а затем поставьте переключатель Layers (Слои) в положение All Layers (Все слой), введите число кадров в поле Frames to Add (Добавить кадры), чтобы создать анимацию, и щелкните по кнопке ОК.
  4. Щелкните по кадру, в котором должно начаться покачивание.
  5. На палитре Layers (Слои) создайте дубликат того слоя, изображение которого будет двигаться.
  6. Отредактируйте дубликат слоя (например, чуть поверните, добавьте немного мазков кистью, подкорректируйте цвет или измените его другим способом). Спрячьте исходный слой, чтобы увидеть внесенные изменения. На рис. 23.140 виден отредактированный слой receiver left tilt, в то время как исходный слой receiver спрятан. Трубка телефона наклонена влево (рис. 23.140). Изменения отразятся в выделенном кадре на палитре Animation.
  7. Щелкните по следующему кадру (либо по кнопке Next Frame (Следующий кадр) в нижней части палитры Layers (Слои)). Сделайте исходный слой receiver видимым и спрячьте его отредактированный дубликат receiver left tilt (рис. 23.141).
  8. Щелкните по следующему кадру. Теперь покажите отредактированный дубликат слоя и спрячьте исходный слой.
  9. Так попеременно показывайте/прячьте слои для оставшихся кадров анимации.

Рис. 23.140. Телефон с наклоненной влево трубкой и слои изображения на палитре Layers

Рис. 23.141. Телефон в исходном положении и слои изображения на палитре Layers

Рис. 23.142. Очередность кадров анимации

Рис. 23.143. Три слоя на палитре Layers

Дополнительное редактирование

Если необходимо еще раз изменить исходный элемент слоя, то создайте еще один дубликат и отредактируйте его. Затем в одном кадре анимации сделайте видимым исходный слой и спрячьте дубликаты. В следующем кадре отобразите первый дубликат слоя и спрячьте второй и исходный слои. В третьем кадре покажите второй дубликат и спрячьте исходный слой вместе с первым дубликатом и т.д. Приведенные рисунки иллюстрируют эти действия. На рис. 23.142а виден слой receiver left tilt (телефонная трубка наклонена влево), на рис. 23.142б виден слой receiver (телефонная трубка расположена горизонтально) и, наконец, на рис. 23.142в виден слой receiver right tilt (телефонная трубка наклонена вправо). Слои, используемые в анимации, показаны на рис. 23.143.

Редактирование анимации

Если после создания анимации вы отредактируете пикселы слоя (например, раскрасите, откорректируете цвет и яркость или каким-либо образом преобразуете слой), то внесенные изменения автоматически будут применены ко всем кадрам анимации, в которых виден данный слой.

Если же вы спрячете или покажете слой, измените расположение элемента слоя, непрозрачность или режим смешивания либо измените эффект слоя в одном кадре, эти изменения не будут скопированы в другие кадры. Дело в том, что такие изменения производятся с помощью палитры Layers (Слои) и не затрагивают реально существующих точек слоя. Если же необходимо внести перечисленные изменения во все кадры анимации, то в меню палитры Animation воспользуйтесь командой Match Layer Across Frames (Привести в соответствие слои во всех кадрах).

Так как некоторые виды изменений, вносимых с помощью палитры Layers (Слои), могут быть выполнены при помощи установки в диалоговом окне Tween (Промежуточные кадры) флажков Position (Расположение), Opacity (Непрозрачность) и Effects (Эффекты), то в любой момент можно изменять значения перечисленных параметров для отдельных кадров, не затрагивая остальные.

Команда Match Layer Across Frames удаляет все изменения, которые были внесены в слой при создании промежуточных кадров. Если это недопустимо, редактируйте кадры анимации при помощи методов, описанных в разделе «Применение второго анимационного эффекта к существующей анимации».

Воспроизведение анимации в обратном порядке до первого кадра

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

  1. Выделите последний кадр на палитре Animation (Анимация).
  2. Щелкните по кнопке Tween (Промежуточные кадры), расположенной на этой же палитре.
  3. Поставьте переключатель Layers (Слои) в положение All Layers (Все слои), установите флажки для всех параметров, выберите пункт First Frame (Первый кадр) в меню Tween with (Диапазон промежуточных кадров) и введите соответствующее значение в поле Frame to Add (Добавить кадры).
  4. Щелкните по кнопке ОК.

Применение второго анимационного эффекта к существующей анимации

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

  1. Выберите или создайте слой, к которому следует применить анимационный эффект.
  2. На палитре Animation (Анимация) щелкните по тому кадру, с которого будет начинаться эффект анимации (рис. 23.144).
  3. Расположите изображение слоя желаемым образом в кадре, соответствующем началу анимационной последовательности. При необходимости отрегулируйте его непрозрачность или примените какие-либо эффекты (рис. 23.145).
  4. Щелкните по конечному кадру анимационной последовательности.
  5. В конечном кадре измените положение изображения слоя или значение непрозрачности, удалите или, наоборот, примените эффекты слоя. Не снимайте выделение со слоя!
  6. Если при выполнении шагов 2-4 выбраны первый и последний кадры анимации соответственно, то выполните команду Select All Frames (Выделить все кадры) из меню палитры Animation. Если же при выполнении этих шагов первый и последний кадры анимации выбраны не были, то щелкните по кадру (для шага 2), затем, нажав клавишу Shift, щелкните по кадру, который будет последним. Теперь выделен некоторый ряд кадров. 7. Щелкните по кнопке Tween (Промежуточные кадры), расположенной на палитре Animation, чтобы сразу же создать промежуточные кадры. Второй способ: в меню палитры Animation выполните команду Tween. Установите переключатель Layers (Слои) в положение All Layers (Все слои), установите флажки для тех параметров, которые только что изменили (Position (Расположение), Opacity (Непрозрачность) или Effects (Эффекты)), а затем щелкните по кнопке ОК. На рис. 23.146 показаны начальный кадр (эффект Outer Glow, непрозрачность 4%), промежуточный и последний кадр (эффект Outer Glow, непрозрачность 100%) второго эффекта анимации.

Рис. 23.144. Первая анимация

Рис. 23.145. Результат применения к слою iogо команды Invert и эффекта Outer Glow

Рис. 23.146. Результат добавления второго эффекта анимации

Второй эффект анимации будет постепенно «проявляться» в кадрах, выбранных на таге 6. Существовавшие до этого анимационные эффекты будут сохранены.

Уменьшение размера изображения

Если созданная анимация слишком велика для воспроизведения в браузере либо слишком долго загружается на Web-страничку, то можно выполнить следующие действия: уменьшить размер файла с помощью команды Image Size (Размер изображения) в меню Image (Изображение) или обрезать изображение. Независимо от того, какой способ выбран, убедитесь, что работаете с копией файла (чтобы создать ее, воспользуйтесь командой File > Save As (Файл > Сохранить как)).

  1. Выполните команду Image > Image Size (Изображение > Размер изображения).
  2. Уменьшите значения в полях Width (Ширина) и Height (Высота) до 200x200 пикселов (или 150x300) либо итого меньше (рис. 23.147).
  3. Убедитесь, что в меню Quality (Качество) выбран вариант интерполяции Smooth (Bicubic) (Гладкая (Бикубическая)).
  4. Щелкните по кнопке ОК.

Рис. 23.147. Диалоговое окно Image Size в программе ImageReady

Рис. 23.148. Кнопки управления воспроизведением на палитре Animation

Рис. 23.149. Последовательность кадров на палитре Animation

Рис. 23.150. Панель опций инструмента Crop

Обрезка изображения

  1. Если при анимации изображение движется от одного края основного окна к другому, то на палитре Animation (Анимация) щелкните по кадру где-то в середине анимационной последовательности (рис. 23.148 и 23.149). Если изображение остается в центре основного окна, то щелкните по любому кадру.
  2. Откройте палитру Info (Информация) и перетащите ее, чтобы отделить от группы палитр.
  3. Выберите инструмент Crop (Кадриро-вать), нажав клавишу С, или щелкните по пиктограмме %|j.
  4. На панели опций поставьте переключатель Cropped Area (Отсекаемая область) в одно из положений - см. рис. 23.150:
  5. Перетащите курсор инструмента Crop (Кадрировать) по диагонали, чтобы указать меньшие размеры изображения (рис. 23.151), наблюдая за значениями W и Н (размеры рамки для обрезанной области) на панели Info (Информация). Если необходимо, переместите границы созданной рамки, чтобы достичь желаемого размера. Уменьшите размеры примерно до 200x200 пикселов (или 150x300 пикселов) или еще меньше (см. ниже первый совет).
  6. Чтобы применить эффект кадрирования, дважды щелкните мышью внутри рамки или нажмите клавишу Enter.
  7. Предварительно просмотрите анимацию (как это сделать, написано в разделе «Предварительный просмотр анимации») - см. рис. 23.152.

200x200 (или 150x300) пикселов - это рекомендуемый размер рамки кадрирования. Если необходимо использовать другие размеры, то в палитре History (История) щелкните по элементу состояния, предшествующему применению команды Crop (Кадриро-вать). Каждый раз просматривайте полученный результат с помощью команды File > Preview in [browser] (Файл > Предварительный просмотр в [браузер]) программы ImageReady. А чтобы увидеть реальное воспроизведение анимации, загрузите ее на Web-страничку, чтобы потом просмотреть через Internet.

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

Рис. 23.151. Рамка кадрирования

Рис 23.152. Постепенное исчезновение изображения за границами рамки кадрирования

Другие способы сокращения размеров файлов

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

Рис. 23.153. Создание новой миниатюры ролловера (стиль button-up заменен на button-down)

Рис. 23.154. Добавление кадров в анимационную последовательность

Рис. 23.155. Выделение миниатюры ролловера в состоянии Normal

Рис. 23.156. Первый кадр

Ролловер, инициирующий анимацию

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

  1. На палитре Rollover (Ролловер) создайте новую миниатюру для выделенного ломтика изображения, желательно в состоянии Over (Над) (как это сделать, написано в разделе «Создание ролловера для ломтика изображения») - см. рис. 23.153.
  2. Перетащите вкладку Animation (Анимация) и расположите ее отдельно от других палитр.
  3. Выделите миниатюру нового ролловера на палитре Rollover (но не состояние Normal (Нормальный)), щелкните по палитре Animation и создайте кадры и события анимации (см. раздел «Перемещение элемента изображения с помощью анимации») - рис. 23.154.
  4. Щелкните по миниатюре ролловера в состоянии Normal (рис. 23.155). Все кадры, за исключением первого, временно исчезнут с палитры Animation (рис. 23.156).
  5. Сохраните файл и просмотрите его с помощью команды File > Preview in [browser] (Файл > Предварительный просмотр в [браузер]).

Создание анимации с искажением текста

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

  1. Откройте или создайте изображение, содержащее фоновый слой и прозрачный слой с редактируемым текстом.
  2. В палитре Layers (Слои) выберите текстовый слой (рис. 23.157).
  3. Откройте палитру Animation (Анимация), выделите первый кадр, а затем щелкните по кнопке Duplicate current frame (Дублировать текущий кадр).
  4. На панели опций инструмента Туре (Текст) щелкните по кнопке Warp (Деформировать) - см. рис. 23.158.
  5. В диалоговом окне Warp Text (Деформировать текст) произведите необходимые настройки.

Из всплывающего меню Style (Стиль) выберите стиль деформации (рис. 23.159). Включите опцию Horizontal (Горизонтально) или Vertical (Вертикально), чтобы указать направление искажения текста. Затем с помощью ползунка или полей Bend (Изгиб), Horizontal Distortion (Искажение по горизонтали) и Vertical Distortion (Искажение по вертикали) установите необходимые значения для получения соответствующего эффекта. В главном окне документа можно увидеть результат.

  1. Щелкните по кнопке ОК (рис. 23.160).

Рис. 23.157. Выделение текстового слоя на палитре Layers

Рис. 23.158. Кнопка Warp на панели опций инструмента. Туре

Рис. 23.159. Установка значений параметров Style и Bend в диалоговом окне Warp Text

Рис. 23.160. Кадры анимации искажения текста

  1. В текущем кадре на палитре Animation будет отображен деформированный текст. Не снимая выделения с кадра, на этой же палитре щелкните по кнопке Tween (Промежуточные кадры). Поставьте переключатель Layers (Слои) в положение All Layers (Все слои), введите соответствующее число в поле Frame to Add (Добавить кадры) и щелкните по кнопке ОК.
  2. Выберите время задержки для кадров и щелкните по кнопке Play (Проиграть) на палитре Animation, чтобы начать воспроизведение.

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

Удаление или корректировка искаженного текста

  1. Выберите слой искаженного текста.
  2. На панели опций инструмента Щ Туре (Текст) щелкните по кнопке Warp (Деформировать).
  3. Для того чтобы удалить эффект деформации текста, выберите во всплывающем меню Style (Стиль) пункт None (Нет).

Если вы хотите скорректировать искажение, обусловленное упомянутым эффектом, выберите другой вариант из меню Style ли6o примените другое направление искривления или-задайте другие значения параметров Bend (Изгиб), Horizontal Dis-torsion (Искажение по горизонтали) или Vertical Distorsion (Искажение по вертикали).

Также можно на палитре Animation выделить какой-либо кадр и по-другому исказить текст только в этом кадре.

Сохранение GIF-анимации

Если выполнить команду File > Save (Файл > Сохранить), то файл анимации будет сохранен в формате Photoshop; текущие настройки формата GIF на палитре Optimize (Оптимизация) будут также сохранены вместе с файлом. Выберите варианты Perceptual (Учитывающий восприятие), Selective (Селективный) или Adaptive (Адаптивный) в этой палитре, а также метод размытия, который поможет сгладить переходы от одного кадра к другому. Команда Save (Сохранить) никак не повлияет на палитру Layers (Слои) (сравните с командой Save Optimized (Сохранить с оптимизацией), о которой рассказывается далее) - см. рис. 23.161. Сохраненный файл можно будет в дальнейшем редактировать.

Если воспользоваться командой File > Save Optimized (Файл > Сохранить с оптимизацией), которой соответствует комбинация клавиш Ctrl+Option+S, то автоматически устанавливается формат GIF, а не Photoshop. За исключением одного случая: если в файле содержится ролло-вер, инициирующий анимацию, автоматически будет установлен формат HTML вместо GIF. Команда Save Optimized существенно влияет на слои. Вместо того, чтобы сохранить отдельные элементы слоя, которые составляют анимацию, команда сопоставляет каждый слой отдельному кадру анимационной последовательности (рис. 23.162). Посмотрите, какие изменения произойдут на палитре Layers (Слои) после того, как вы снова откроете файл, сохраненный командой Save Optimized (Сохранить с оптимизацией). Подробнее об этой команде рассказано в разделе «Сохранение оптимизированного файла в ImageReady».

Рис. 23.161. Пока файл остается в формате Photoshop, каждый элемент анимации находится на отдельном слое

Рис. 23.162. Сопоставление слоев кадрам анимации в результате использования команды Save Optimized

Рис. 23.163. Опция Optimize By в диалоговом окне Optimize Animation

Открытие анимации в формате GIF

Единственное видимое преимущество использования формата GIF - это возможность применения или редактирования настроек оптимизации файла.

  1. Выполните команду File > Open (Файл > Открыть) либо нажмите комбинацию клавиш Ctrl+O.
  2. Найдите название файла с расширением .gif и щелкните по нему.
  3. Щелкните по кнопке Open (Открыть). Кадры анимационной последовательности при этом будут сохранены. Однако на палитре Layers (Слои) теперь станет отображаться последовательность слоев: по одному слою для каждого кадра. Отдельные элементы слоя теперь нельзя редактировать независимо от других кадров!

Оптимизация анимации

  1. В меню палитры Optimize (Оптимизация) воспользуйтесь командой Optimize Animation (Оптимизировать анимацию).
  2. В группе параметров Optimize By (Оптимизировать с помощью) установите флажок Bounding Box (Габаритная рамка), чтобы сохранить первоначальный кадр, а также только те области, которые изменяются при переходе от одного кадра к другому (рис. 23.163). В результате уменьшится размер файла, но в то же время не все программы-редакторы, воспринимающие формат GIF, смогут работать с данным файлом.

В дополнение к этим действиям или вместо них установите флажок Redundant Pixel Removal (Удалить лишние.точки), чтобы удалить те точки объекта или фона, которые не меняются, то есть повторно выводятся при загрузке каждого нового кадра. Это также поможет уменьшить размер файла.

Ни одна из этих опций не изменит фактического вида анимации, все изменения происходят «за сценой».

 

 

Hosted by uCoz