Как деформировать объект в фотошопе. Как пользоваться командой марионеточная деформация в фотошопе

Рассмотрим еще одну новинку в Adobe Photoshop CS5 - команду "Марионеточная деформация".

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

Для примера был выбран рисунок Белоснежки на белом фоне.

Результат действия команды "марионеточная деформация" показан на рисунке:

Видно, что изменилось положение рук и головы.

Открываем изображение в программе Adobe Photoshop CS5.

Снимаем блокировку слоя, т.е. делаем слой обычным без "замочка". На заблокированном слое команда "марионеточной деформации" будет недоступна.

Инструментом выделения "Прямолинейное лассо" отмечаем область деформации.

При выборе команды "Редактирование - Марионеточная деформация" на выделенной области появится сетка.

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

Щелкаем мышкой по рисунку и расставляем таким образом узловые точки (булавки). Булавки отображаются желтыми кружочками. Лишние булавки можно удалять из контекстного меню, щелкнув по булавке правой кнопкой мыши.

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

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

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

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

Возьмем для примера тот же самый рисунок, но на белом фоне.

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

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

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

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

Только практика, практика и еще раз практика научит Вас с успехом пользоваться командой "Марионеточная деформация".

Вы узнаете:

• Как самостоятельно загнуть уголок у фотографии.
  • Как вызвать функцию трансформирования Warp (Деформация).
  • Как деформировать сетку и смещать опорные точки.
  • Как правильно наложить градиент на загнутый уголок.
  • Как сделать поверхность уголка текстурной с помощью стилей слоя.
  • Как пользоваться Puppet Warp (Марионеточной деформацией) в CS5.
  • Как удалить фигуру с фона клавишей Del и функцией Content-Aware (С учетом содержания) в CS5.

Способы создания загнутого уголка в Photoshop

Начнем с обычной деформации. В этом уроке мы создадим загнутый уголок при помощи инструмента трансформирования Warp (Деформация). Существует довольно много разных способов добиться этого эффекта. Есть отличный плагин AV Bros Page Curl Pro 2.1, который справляется с этой задачей за пару кликов мышкой. При желании вы можете легко найти его в интернете. Метод, который предлагаю я тоже не сложный. И к тому же, с полученными знаниями вы сможете контролировать процесс и использовать эти знания не только для загибания уголков, но и для других деформаций и искажений изображения. А так как мы только что прошли тему инструменты Трансформации, то попробуем закрепить пройденный материал на практике.

Подготовка изображения к трансформированию

Выберите инструмент Rectangular marquee (Прямоугольная область) . Задайте Style (Стиль) Normal (Обычный) .

Выделите правую часть изображения:

Наведите курсор на выделение, зажмите правую кнопку мыши и выберите Layer via copy (Скопировать на новый слой) .
В палитре слоев появится новый слой. Щелкните по миниатюре слоя 1, зажав клавишу Ctrl, чтобы загрузить выделение.

Создайте еще один новый слой 2. Перетащите вновь созданный слой под слой 1. Воспользуйтесь инструментом Paint Bucket (Заливка), цвет заливки белый. Отмените Ctrl + D или выберите в меню Select (Выделение) – Deselect (Отменить выделение) .

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

Деформируем сетку и смещаем опорные точки

Приступим к закручиванию угла. Нажмите Edit (Редактирование) – Transform (Трансформирование) – Warp (Деформация) . Или комбинацию клавиш Ctrl + T для вызова режима Free Transform (Свободная трансформация) и в панели параметров щелкните по значку Деформация. Появится сетка с опорными точками. Можно перетаскивать опорные точки, сегмент ограничительной рамки или сетки, а также область внутри сетки. Возьмитесь за нижний правый узелок и потяните. Появятся усики, которыми отрегулируйте изгиб. Добейтесь нужного положения и нажмите Enter .

Чтобы отменить последнюю коррекцию, выберите в меню Edit (Редактирование) пункт Undo … (Отменить…) или нажмите Ctrl + Z . Но помните, что при трансформировании и деформации резкость растрового изображения (в отличие от формы или контура) ухудшается с каждым разом. Выполните несколько команд (поворот, масштабирование, деформация….) и только потом нажмите Enter, а не подтверждайте все преобразования по отдельности.

Как сделать поверхность уголка текстурной с помощью стилей слоя

Выберите инструмент Pen (Перо) , в панели параметров отметьте Paths (Создать контур). Обведите уголок. Изучению инструмента Pen (Перо) мы посвятили несколько предыдущих уроков. Если вы новичок в Photoshop и начали изучать курс не с начала, советую вернуться к пропущенным темам. Напомню, что клавиша Alt – для образования угла, а клавиша Ctrl – для редактирования точек и направляющих.

Перейдите на вкладку Paths (Контуры) . Щелкнув по рабочему контуру, переименуйте его. Затем нажмите значок , чтобы загрузить выделение. И вернитесь в палитру Layers (Слои). Скопируйте выделение на новый слой Layer via copy (Скопировать на новый слой) . Или до выбора инструмента Pen (Перо) , создайте новый слой.

Выберите инструмент ведро или Paint Bucket (Заливка), цвет заливки белый. Щелкните по выделенной области, что бы залить ее цветом. Дважды кликните
мышкой по слою 3, откроется окно настройки . Отметьте галочкой Drop Shadow (Тень), Bevel and Emboss (Тиснение), Gradient Overlay (Наложение градиента) .
В настройках градиента установите режим Multiply (Умножение) . Поменяйте величину угла, чтобы градиент располагался от сгиба к краю, уменьшите непрозрачность и измените масштаб. Затем отметьте галочкой Pattern Overlay (Наложение узора) , подберите подходящий рисунок, настройте Opacity (H епрозрачность) и Scale (Масштаб) . Нажмите ОК.

Opacity (H епрозрачность) слоя снизьте приблизительно до 75 %, чтобы придать эффект полупрозрачной пленки. Или оставьте 100%, чтобы не просвечивался рисунок.

Переключитесь на слой 1, дважды кликните по нему, чтобы войти в настройки Layer Style (Стили слоя). В настройках Pattern Overlay (Наложение узора) подберите рисунок на свой вкус, настройте непрозрачность и масштаб. В настройках Color overlay (Наложение цвета) щелкните по цветному квадратику выбора цвета и переместите курсор на фотографию. Курсор примет вид пипетки. Попробуйте взять пробы с разных участков изображения, остановите свой выбор на более подходящем цвете, настройте непрозрачность.

В заключении выполните сведение слоев и не забудьте сохранить.

Откройте файл (гимнастика 012.jpg). Создайте копию документа (необязательно, но желательно), щелкнув по значку в палитре History (История). Это позволит сохранить исходное изображение. Создайте копию фонового слоя. Воспользуйтесь любым инструментом выделения и обведите фигуру девушки. Сохраните выделение как альфа-канал (необязательно). Для этого зайдите в палитру Chennel (Каналы) и щелкните по значку .

Вернитесь в палитру Layers (Слои) .

Выберите в меню Edit (Редактирование) – Puppet Warp (Марионеточная деформация) . Выделенная область заполнится сеткой. Наведите курсор на сетку. Курсор примет вид булавки со знаком +. Каждый новый щелчок по сетке добавляет точку, щелчок по уже созданной точке активирует ее. Расставьте узловые точки: на кончиках кроссовок, на талии и в центре мячика. Узловые точки‑булавки отображаются желтыми кружочками.

Для вызова контекстного меню щелкните по булавке правой кнопкой мыши. Нажмите на булавку в центре мяча и, не отпуская кнопку мыши, потяните ее вниз. Другие части фигуры, закрепленные булавками, сдвигаться не будут. Расставьте дополнительные булавки, переместите их по вашему усмотрению, но так чтобы наклон выглядел естественно. Выбрать сразу несколько булавок можно, удерживая нажатой клавишу Shift. Удалить лишние булавки можно клавишей Del, Alt + щелчок по центральной точке или из контекстного меню правой кнопки.

Отключить видимость сетки можно в том же меню Show Mesh (Скрыть сетку) или сняв галочку с пункта Mesh (Сетка) в панели параметров. Частоту ячеек сетки можно изменить в панели параметров. При выборе (Больше точек) точность увеличивается, но времени на обработку уходит больше.

Mode (Режим) – задает эластичность сетки. Можно сделать выбор из трех параметров: Строгий, Нормальный и Искажение. Булавки можно вращать. Для этого зажмите Alt и подведите курсор близко к булавке, но не на ее центр. Вокруг булавки появится окружность и двусторонняя стрелка. Зажмите левую кнопку мыши и, не отпуская Alt, выполните вращение. Задать угол поворота можно в панели параметров, просто введя нужное количество градусов в поле Rotate (Поворот).

Фотография Натальи Белоусовой. Фотограф Надежда Глазова.

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

Для выхода из марионеточного режима нажмите либо Enter, либо значок на панели параметров. Снимите выделение Ctrl + D.

Удаление фигуры с фонового слоя клавишей Del и функцией Content-Aware (С учетом содержания) в CS5

Теперь нужно удалить первоначальную фигуру с фона (Background). Зайдите в палитру Chennel (Каналы) и загрузите сохранённый ранее альфа-канал как выделение, нажав на пунктирный кружок . Перейдите в палитру Layers (Слои) и выберите фоновый слой. (Если вы не создавали Альфа-канал, то обведите девушку еще раз любыми инструментами выделения). Нажмите Del . В появившемся окне выберите Content - Aware (С учетом содержания) . Нажмите ОК. Девушка будет удалена с фона, как будто ее там не было. Некоторые области на изображении могут пострадать, поэтому потребуется дополнительная коррекция фона восстанавливающими инструментами (заплатка, штамп и лечащие кисти). Если нужно удалить объект не с фонового слоя, то клавиша Del сработает как обычно, т.е. оставит дырку в слое. Чтобы удалить с учетом содержания, выберите Content-Aware (С учетом содержания) из меню Edit (Редактирование) – Fill (Выполнить заливку) или нажмите Shift + F5.

Вопросы:

(правильный ответ вы можете узнать из викторины в конце видеоурока)

1. Каким из нижеперечисленных способов нельзя скопировать выделение на новый слой?

– В меню правой кнопки мыши и выберите Layer via copy (Скопировать на новый слой).

– Нажать Ctrl +J.

– Меню Layers (Слои) – New (Новый) – Layer via copy (Скопировать на новый слой).

– Нажать Ctrl + C, создать новый слой и нажать Ctrl + V.

– Меню Edit (Редактирование) – Copy (Скопировать), меню Edit (Редактирование) – Past (Вставить).

– Выбрать инструмент Move (Перемещение) и зажав Alt переместить выделение.

1. Какой из нижеперечисленных способов не подходит для загрузки окна настроек Blending Options (Параметры наложения)?

– В палитре Layers (Слои) дважды кликните по слою (кроме фонового, фоновый нужно предварительно переименовать).

– Щелкнуть правой кнопкой мыши по слою и выбрать Blending Options (Параметры наложения).

– Меню Layers (Слои) – LayerStyle (Стили слоя) – Blending Options (Параметры наложения).

– Меню Layers (Слои) – Layer Properties.

– В правом верхнем углу палитры Layers (Слои) щелкнуть по треугольнику и выбрать Blending Options (Параметры наложения).

1. Какой из нижеперечисленных способов не подходит для загрузки режима Warp (Деформация)?

– Edit (Редактирование) – Transform (Трансформирование) –Warp (Деформация).

– Ctrl + T , в параметрах инструмента нажать на значок деформации.

– Edit (Редактирование) – Transform (Трансформирование) – Rotate 180 (Поворот на 180),

– Edit (Редактирование) – Transform (Трансформирование) – Rotate (Поворот), в параметрах инструмента нажать на значок деформации.

– правый клик мышки на выделении Free Transform (Свободное трансформирование),
в параметрах инструмента нажать на значок деформации.

1. Сколько действий можно отменить, не выходя из режима Деформации?

– ни одного

Домашнее задание

Вы должны или чтобы увидеть скрытый текст.

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

В панели настроек находятся следующие опции:

• Режим — определяет, на сколько сильно можно искажать сетку.
• Частота — определяет размеры ячеек в сетке
• Расширение — определяет, насколько сетка будет выходить за пределы холста.

Чтобы отобразить, или скрыть сетку, нужно поставить, или убрать галочку в соответствующем чекбоксе.

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

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

Булавку можно удалить, удерживая клавишу Alt , и нажимая на нее клавишей мыши.

Можно сразу выделить несколько булавок, нажимая клавишу Ctrl , и кликая по ним повторно. В активных булавках появится точка, и они будут перемещаться одновременно.

Изображение можно вращать вокруг выбранной булавки. Для этого нажимаете и удерживаете клавишу Alt рядом с изображением булавки. Появляется круг, который можно вращать. Изображение будет вращаться тоже. Чтобы ограничить вращение, обозначьте булавками места, которые хотите оставить неподвижными. Угол поворота можно задать в панели настроек.

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

Команда Трансформирование

Также в программе Adobe Photoshop CS5 есть команда Трансформирование . Она находится в меню , и включает в себя следующие команды:

• Масштабирование : изменение размеров. Чтобы сохранить пропорции изображения при таком трансформировании, тянете угловой маркер, с нажатой клавишей Shift. Поворачивать изображение с помощью команды Масштабирование нельзя.
• Поворот : напротив, позволяет делать только повороты объекта, другие действия выполнять невозможно.
• Наклон : и угловые, и средние маркеры можно перемещать вдоль границ, на которых эти маркеры находятся.
• Искажение : маркеры можно перемещать как угодно.

Перспектива : если Вы двигаете какой-либо угловой маркер в одну сторону, маркер, который находится справа или слева, будет перемещаться в другую сторону.

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

Также с помощью меню Редактирование — Трансформирование можно поворачивать изображение на 90 и 180 градусов, а также зеркально отображать его по горизонтали и вертикали.

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

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

При цитировании достаточно нажать кнопку "Нравится"

Как бы ни были красивы статичные картинки, но иногда им не помешает стать немного живыми. Как придать движение понравившейся картинке? Очень просто. Для этого в программе Adobe Photoshop есть уникальная функция «Марионеточная деформация». Рассмотрим на маленьком примере как она применяется и что дает.

Открываем картинку , которой будем придавать движение. Следует учесть, что необходимо, чтобы изображение, которое будет подвергаться трансформации должно быть отсоединено от фонового изображения. Поэтому изначально удобно будет тренироваться на клипарте (вырезанное изображение на прозрачном фоне). Можно также вырезать необходимое изображение из общего картинки с помощью инструмента «Прямолинейное лассо» как указано стрелочкой № 1 или инструмента «Магнитное Лассо» указано стрелочкой № 2 либо инструмента «Свободное перо» указано стрелочкой № 3.

Итак, картинка готова к работе. Делаем копию слоя. Для этого на слое, который нужно скопировать нажимаем правую кнопку мыши и в появившемся меню выбираем «Создать копию слоя».

Переходим во вкладку «Редактирование» функция «Марионеточная деформация».

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

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

Если вдруг была установлена булавка не в том месте или она лишняя, то её можно удалить, для этого нажимаем правую кнопку мыши, стоя на булавке и в меню выбираем «Удалить булавку».

Стоит отметить, что данная функция «Марионеточная деформация» может применяться, как с целью исправить изображение или для того, чтобы сделать анимацию.

Теперь переходим к созданию анимации. Во вкладке «Окно» выбираем функцию «Анимация».

Внизу рабочего файла (файла, с которым производятся изменения) появляется лента раскадровки с первым кадром. Выставляем время на кадре 0,5 секунды. Для этого нажимаем на треугольник, как показано стрелочкой и выбираем из открывшегося списка 0,5.

Для того, чтобы анимация была постоянной необходимо выбрать параметр цикла «Постоянно» как показано на рисунке стрелочкой № 1. Далее копируем кадр как показано на рисунке стрелочкой № 2, нажав листик.

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

Переходим к сохранению картинки. Так как у нас анимация, то во вкладке «Файл» выбираем функцию «Сохранить для WEB и устройств». В открывшемся окне устанавливаем те параметры, как на рисунке, нажимаем на кнопку воспроизведение, как указано стрелочкой и нажимаем «Сохранить».

В диалоговом окошке задаем название файла, выбираем место для сохранения и нажимаем «ОК».

Примечание. Для использования «Деформации », нужно перейти в режим «Трансформирование » нажав Ctrl+T .

Инструмент «Warp» (Деформация) в Фотошопе очень хороший инструмент, если использовать его с толком.

1. Создайте новый документ: 1920 на 1080 рх. Скачайте :

2. Тепереча, в древних городах и пустынях, отыщите и скачайте . Удалите белый фон, переместите изображение вниз, потом обесцветьте лампу Ctrl+Shift+U (и перестаньте уже ее тереть - джина я еще раньше пересадил в другое место):

4. Немного растушуем выделение: нажмите Ctrl+Alt+D и в появившееся поле введите цифру 3 , после залейте выделение черным цветом:

5. Сдвиньте тень немного правее:

6. Теперь, прежде чем мы начинаем добавлять и варпить (деформировать) огонь, разумно будет обозначить изгиб будущего направления, по которому мы и будем его (огонь) накладывать. Это будет своего рода пример-заготовка, по которой мы будем ориентироваться при работе. Создайте новый слой выше остальных, назовите его «start stroke », и затем, используя инструмент (), нарисуйте путь, как это показано:

7. Выберите кисть, откройте палитру с настройками (F5 ) и подготовьте ее для будущего мазка по нарисованному пути:

8. Находясь на слое «Start Stroke » выберите инструмент () и сделайте правый клик, в появившемся меню выберите пункт Stroke path… (Выполнить обводку контура). Далее как показано на скрине:

9. Понизьте Opacity (Непрозрачность) данного слоя до 10%-20% :

10. Загрузите изображение и откройте его в фотошопе. Перейдите в палитру Channels ( (Окно - Каналы)) и сдублируйте красный канал:

11. При выбранной копии красного канала примените к нему кривые Ctrl+M или (), настройки показаны ниже:

12. Теперь, зажав клавишу Ctrl , кликните на этот канал, чтобы получить выделение или сделайте это через меню (Выделение - Загрузить выделенную область) и кликнуть Ок :

13. Теперь нажмите Ctrl+~ , вернитесь в палитру Layer (Слои / F7), скопируйте выделение Ctrl+C и вставьте его в основной рабочий документ. Назовите этот слой «fire flame »: