Создание GIF-анимаций для Web, страница 8


Затем щелкните мышью на кнопке Save (Сохранить) и на кнопке Replace(За­менить), чтобы заменить существующий файл.

Команда Save OptimizedAs (Сохранить оптимизированный как) сохраняет файл в форматах GIF, JPEGили PNG. Как правило, эти файлы предназначены для ис­пользования в Web. Единственным форматом, поддерживающим анимацию, явля­ется формат GSF, поэтому в данном проекте мы используем именно этот формат.

7      Закройте исходное изображение без сохранения изменений с помощью коман­ды меню File ♦ Close (Файл «Закрыть).

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

15.5 Создание анимации настройкой непрозрачности и положения слоя

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

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

15.5.1 Открытие графического файла и начало процесса создания анимации

Сейчас, чтобы начать работу, вы откроете новый графический файл и просмот­рите его текущие установки.

1       В меню ImageReady выберите команду File ♦ Open (Файл ♦ Открыть) и откроюте файл H2O.psd, расположенный в папке Lessons/Lesson 18 на вашем жестком диске.

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

2  Убедитесь, что палитры Animation (Анимация) и Layers (Слои) находятся в рабочей области, или откройте их, выбрав в меню команду Window ♦ Workspace Animation(Окно ♦ Рабочая область ♦ Анимация).

3  На палитре Animation(Анимация) щелкните мышью на кнопке Duplicatescur­rentframe(Создать дубликат текущего кадра), чтобы создать новый кадр
анимации.

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

15.5.2 Настройка расположения слоя и значений непрозрачности

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

1 Убедитесь, что на палитре Animation (Анимация) выделен кадр 2. Затем на па­литре Layers (Слои) выделите слой Н.

Выберите инструмент Move(Перемещение)и начните перетаскивание бук­вы «Н» в левую часть окна изображения. При перетаскивании удерживайте кла­вишу Shift (чтобы выдерживать горизонтальное направление). Когда на экране останется лишь часть буквы «Н», отпустите левую кнопку мыши, а потом и кла­вишу Shift.