WEB Анимация




Практикум - часть 2


Упражнение 3.2. Создание анимации с расчетом промежуточных кадров

  • Запускаем ImageReady. По команде File > New (Файл > Новый) создаем новое изображение размером 300 х 300 пикселов.
  • С помощью инструмента Rectangle (Прямоугольник) нарисуем в верхнем левом углу квадрат и заполним его цветом. При этом автоматически будет создан второй слой.
  • Щелчком на кнопке Duplicates Current Frame (Дублировать текущий кадр) создаем второй кадр с тем же изображением.
  • С помощью инструмента Move (Перемещение) передвинем квадрат в правый нижний угол, что будет отображено на выделенном втором кадре палитры Animation (Анимация).
  • Открываем меню этой палитры и выбираем команду Tween (Промежуточный). В одноименном окне в поле Frames To Add (Число добавляемых кадров) задаем количество промежуточных кадров — 5, снимаем флажок параметра Opacity (Непрозрачность) и щелкаем на кнопке ОК.
  • На палитре Animation (Анимация) будут представлены все семь кадров. При просмотре анимации убеждаемся, что траекторией перемещения квадрата является прямая линия.
  • Выделив последний кадр, добавьте на изображение текст прямо на квадрат в правом нижнем углу (он сольется с ним, так как будет того же цвета). Убедитесь, что автоматически создан новый слой с именем набранного текста.
  • Создадим дубль этого кадра и переместим выделенный текст в правый верхний угол, а квадрат — в левый верхний угол. Для перемещения последнего придется выделить слой, содержащий этот объект.
  • Снова выполняем команду Tween (Промежуточный), задав в окне раскрывающегося списка Tween with (Расчет) значение Previous Frame (Предыдущий кадр), в результате чего получаем 13 кадров анимации.
  • Выполняя команду File > Save (Файл > Сохранить), сохраняем файл в формате Photoshop для продолжения работы со слоями изображения. Если работа завершена и не требуется сохранения слоев, то по команде File > Save Optimized (Файл > Сохранить оптимизированный) сохраняем GIF-файл для Web-страницы.
  • Упражнение 3.3. Создание анимации из файла со слоями




    Содержание  Назад  Вперед