Как сделать небо на заднем фоне

Самолет в облаках

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

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

Разберемся как выполнить этот эффект на примере картинки с самолетом, которую вы видите слева от этого текста.

 


ШАГ 1.
Подыскиваем подходящие картинки. В данном случае это самолет и облака.
(Для урока можете взять эти же, что и у меня. По щелчку по картинке она откроется в новом окне в полном размере. Картинка самолета в формате png без фона.)

 Самолет  Облака
ШАГ 2.Переименовываем слой

Открываем картинку с облаками в фотошопе. Снимаем замочек, блокирующий слой. Для этого просто перетаскиваем иконку замочка со слоя в корзину (правый нижний угол окна слоев).

Переименовываем слой, даем имя Облака 1.

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

ШАГ 3.


Для того, чтобы облака двигались достаточно медленно, необходимо, чтобы картинка с облаками была намного длиннее по ширине, чем картинка самолета.

Плюс еще важно, чтобы во время того, когда начало картинки и ее конец сменяют друг друга (движение облаков будет циклическим), не было бы видно этого перехода.

Поэтому выполняем следующие действия:

Удлиняем картинку с облаками.
Даем команду Изображение - Размер холста (Image - Canvas Size...)
В открывшемся окошке изменяем сначала центр холста, выбираем левый центральный, чтобы холст увеличивался в одну сторону. А затем вводим длину холста в два раза больше исходной. Снизу на картинке видно, что исходная ширина (Width) 600px, а новая ширина 1200px.   Изменяем размер холста  Изменение размеров холстаИзменение размеров холста


Копируем слой с облаками.
Для этого выделяем слой и нажимаем комбинацию клавиш Ctrl+J или даем команду Слой - Дублировать слой (Layer - Duplicate Layer).
Два слоя с облакамиДва слоя с облаками

Рисунок облаков на верхнем слое передвигаем вправо на свободное место.
Затем разворачиваем его по горизонтали для того, чтобы не было видно место стыка.

Для того, чтобы развернуть картинку, выделяем ее (клавиша Ctrl + щелчок мышкой по картинке на соответствующем слое), нажимаем комбинацию клавиш Ctrl+T, щелкаем по картинке правой кнопкой мыши и в открывшемся меню выбираем пункт Повернуть по горизонтали (Flip Horizontal)

Удлиняем картинку с облакамиУдлиняем картинку с облаками

Склеиваем оба слоя. Для этого проще всего выделить верхний слой и нажать комбинацию Ctrl+E, ну или выделить оба слоя и дать команду Слой - Слить слои (Layer - Merge Layers).
В итоге получаем вот такую длинную картинку с облаками:
ОблакаОблака

ШАГ 4.Устанавливаем картинку по левому краю холстаУстанавливаем картинку по левому краю холста

Приступаем к созданию движения. 

Возвращаем исходный размер холста у картинки облаков.

Даем команду Изображение - Размер холста (Image - Canvas Size...) и указываем исходную ширину в 600px.

Двигаем картинку так, чтобы совместить левый край холста и левый край картинки с облаками. Лучше пользоваться не инструментом Перемещение (Move Tool) Move Tool, а клавишами управления курсором. 

Открываем панель анимации. Окно - Анимация (Window - Animation).
Так как у нас один слой, то и на панели анимации мы увидим всего один кадр.
Добавляем еще один кадр к анимации. На этом кадре сдвигаем картинку с облаками влево, пока не совместим правый край холста и правый край картинки.
Внизу на иллюстрации стрелками показана кнопка создания кадров, новый кадр и правая граница холста и картинки.
Создаем новый кадр

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

Между первым и вторым кадрами вставиться еще 15, то есть второй кадр станет 17. Нам он не нужен больше (16 и 17 полностью совпадают), поэтому удаляем его.Выставляем время смены кадров в 0,1 сек и делаем повторение анимации постоянным (Forever).Удаляем последний кадр

В итоге получаем вот такую анимацию движущихся облаков.
Облака

ШАГ 5.

Осталось добавить рисунок самолета. Если у вас рисунок с фоном, то фон, конечно же нужно удалить. У меня самолет сразу в формате png с прозрачностью.Поэтому я просто открываю его в фотошопе, затем выделяю все 16 кадров на анимации с облаками (Shift) и вставляю самолет на новый слой.
Самолет на новом слоеСамолет на новом слое
Вот в принципе и все!
Сохраняем наше произведение следующим способом.
Даем команду:
Файл - Сохранить для WEB и устройств. В открывшемся окне ОБЯЗАТЕЛЬНО выбираем формат GIF и сохраняем с нужным именем.
Самолет, летящий в облаках



Источник: http://sunveter.ru/uroki/fotoshop/214-motion-fon.html


Рекомендуем посмотреть ещё:


Закрыть ... [X]

Как сделать небо на фотографии более ярким и красочным Как сделать что бы отец не пил

Как сделать небо на заднем фоне Визуализация: Окружение - Небо - AUGI Forums - Autodesk User Group
Как сделать небо на заднем фоне Техника быстрой замены неба на пейзаже
Как сделать небо на заднем фоне 52 платья на выпускной 2017, фото самых модных и
Как сделать небо на заднем фоне Cached
Как сделать небо на заднем фоне Ветряная мельница из пластиковых бутылок - Идеи для детской
Как сделать небо на заднем фоне Гимнастика для лица: как сделать скулы выразительными
Как сделать небо на заднем фоне Инструменты для квиллинга: как сделать своими руками, фото набора
Как сделать небо на заднем фоне Как закрепить бусину на пине: Серьги-бусины - Клуб 1001
Как из старых джинс сделать шорты, Видео, Смотреть онлайн Как сделать машину из дерева своими руками? Как сделать подложку в Word Вставка рисунка в качестве подложки Как сделать прозрачным фон значков (ярлыков) на Книга: 16 уроков Английского языка. Начальный курс Оформление проектов нормативных правовых актов Подробные мастер-классы для начинающих, описание с фото и видео Почему не печатает принтер с компьютера - что делать, если Создание групп в социальных сетях - AvenueSoft

Похожие новости