Image Ready - Анимация для ленивых - Кораблик


High Star

Анимация для ленивых. Кораблик




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

Предположим, нам нужно, чтобы какой-то предмет переместился из пункта А в пункт Б. Предположим, что этим предметом будет кораблик. И пусть он у нас плывет по морю. Возможно, у меня не очень получится красиво и в Третьяковку мои шедевры не поместят. Но то, что их увидит не одна тысяча человек - ручаюсь!

Итак, я в программе Image Ready открываю File | New (Файл | Новый) и выбираю следующие настройки:


Рис.1 Будем делать баннер!

Обратите внимание, что я выбрала Web Banner (468x60). Как правило баннеры бывают стандартных размеров: 468х60, 340х60 и 88х31. Я всегда путаюсь в этих размерах, а потому страшно благодарна Image Ready за помощь своей, увы, не крепкой памяти. Рисую небо и море. Оно у меня будет неподвижным, спокойным и тихим. Так сказать, полный штиль. Поэтому я рисую его не добавляя новых слоев. Вот так:


Рис.2. Море и небо. Полный штиль

А вот кораблик не будет стоять на месте. А поэтому я создам новый слой и на этом новом слое нарисую кораблик. Опять все объясняю подробно. Тем более, это мне совсем не трудно:


Рис.3. Создаем новый слой и на нем рисуем кораблик

Дальше уже интересней. Переходим к панели Animation (Анимация), нажимаем на пиктограмму Duplicate Carrent Frame (Дублировать Текущий Кадр) внизу диалога и видим перед собой следующую картину Неайвазовского:


Рис.4. Сейчас у нас два одинаковых фрейма!

Теперь я возьму и передвину с помощью инструмента Move Tool (Перемещение), либо клавишей V кораблик во втором фрейме к левому краю картинки, вот так:


Рис.5. Работа во втором фрейме

Ну, а теперь совсем легко (хотя когда нам было трудно?), нажимаем треугольник-стрелочку в верхнем правом углу панели Animation и выбираем Tween, о котором я упоминала в самом начале урока:


Рис.6. Вызов диалога Tween

Появился диалог:


Рис.7. Диалог Tween

Я пока не буду их изменять. Просто нажму OK и посмотрю, что из этого вышло:


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

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


Рис.9. Пожарный катер

Думаю, вы уже поняли, что Tween добавляет фреймы между выделенными кадрами с заданной последовательностью. Мы добавили 5 кадров для такой последовательности.

Попробую изменить установки в диалоге Tween, - увеличу число добавленных кадров до 20, и кроме того, во втором фрейе я установлю Opacity для слоя кораблика равным 50%. Вернее, сначала установлю Opacity, а потом уж сделаю Tween. Думаю, на рисунке будет более понятно:


Рис.10. Во втором фрейме делаем кораблик полупрозрачным

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


Рис.11. Вторая попытка

А следующий урок будет посвещен суперленивым!