Эффект запотевшего стекла в фотошоп. Фотошоп стекла эффект


Эффект запотевшего стекла в фотошопе

Всем привет! С Вами на связи Сергей Заставный. Прошу прощения за то, что так долго не писал, т. к. меня не было в Полтаве.

После нескольких дней непрерывного дождя я решил использовать его в качестве вдохновения для нового урока в Photoshop.

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

Итак, поехали!

Конечный результат:

эффект запотевшего стекла

Шаг 1

Откройте Photoshop и создайте новый документ. Я буду использовать размер 2560×1440 пикселей. Далее залейте фоновый слой темно-серым цветом. Это нам понадобится при создании капель воды.

Шаг 2

Идем в Окно>Кисть и начинаем создавать кисть в форме капель воды. Установите настройки как на изображении ниже. ВАЖНО, чтобы кисть была мягкой.

Шаг 3

Добавьте новый слой и сгруппируйте их(Ctrl+G). Затем измените режим наложения данной группы на Осветление основы. С помощью инструмента Кисть нарисуйте капли как показано на рисунке ниже:

эффект запотевшего стекла в фотошоп

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

Шаг 4

Выберите фоновый слой и группу с каплями и объедините их в слой. Далее перейдите в Изображение>Коррекция>Уровни и установите входные значения черного в положение 124, а также белого в 161. Значения могут варьироваться, просто убедитесь, что Вы избавляетесь от размытых краев.

Шаг 5

С помощью инструмента Волшебная палочка(W) выделите черную область. Затем перейдите в Выделение>Подобные оттенки, чтобы убедиться, что все черные области выделены. Далее удалите их (Delete).

Шаг 6

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

эффект запотевшего стекла

Шаг 7

Перейдите в Фильтр>Размытие>Размытие по Гауссу и установите параметр радиуса в 20 пикселей.

Шаг 8

Перейдите в Слои>Стиль слоя>Наложение цвета. Используйте темно-серый цвет и Непрозрачность 60%.

эффект запотевшего окна

Шаг 9

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

Шаг 10

Перейдите в Слои>Стиль слоя>Параметры наложения. Установите непрозрачность заливки до 0. После этого Выберите стиль слоя Внутренняя тень. Используйте такие параметры:

Цвет: белый;

Режим наложения: Линейный осветлитель;

Непрозрачность: 50%;

Угол: 90 градусов;

Смещение: 3 пикс.;

Размер: 5 пикс.

Контур: Конус.

Шаг 11

Далее выберите стиль слоя Тиснение. Измените глубину до 350%, установите направление: вниз, размер: 7 пикс. Далее в опциях Затенения используйте такие параметры:

Угол: 54 градуса;

Высота: 42 градуса;

Контур: Глубокая выемка;

Непр. Режима подсветки: 80%;

Режим наложения подсветки: Линейный осветлитель;

Непр. Режима тени: 50%;

Режим наложения тени: Умножение.

Шаг 12

Следующий стиль слоя, который мы будем использовать – Внутреннее свечение:

Режим наложения: Темнее;

Непрозрачность: 40%;

Источник: На краях;

Размер: 25 пикс.

эффект запотевшего стекла

Шаг 13

Далее выберите Наложение цвета:

Цвет: #907f72;

Режим наложения: Линейный осветлитель;

Непрозрачность: 45%.

Шаг 14

И последним стилем слоя у нас будет Тень с такими параметрами:

Режим наложения: Умножение;

Цвет: Черный;

Непрозрачность: 20%;

Угол: 90 градусов;

Смещение: 9 пикс.

Размах: 5%;

Размер: 10 пикс.

эффект запотевшего стекла в фотошоп

Шаг 15

Включите видимость ранее дублированного нами слоя (не размытого). Далее перейдите в Фильтр>Размытие>Размытие по Гауссу. Установите радиус в 5 пикс. Далее на палитре слоев щелкните правой кнопкой мыши по миниатюре слоя с каплями и выберите Выделить пикселы. Таким образом, Вы получите выделение капель воды.

Теперь выберите слой с изображением, к которому мы применяли размытие и перейдите в Слой>Слой-маска>Показать выделенную область.

Шаг 16

Выберите маску слоя, которую мы создали на предыдущем шаге и перейдите в Фильтр>Размытие>Размытие в движении. Используйте угол: -90 градусов и смещение: 80 пикс.

Шаг 17

После применения размытия перейдите в меню Изображение>Коррекция>Уровни. Далее изменяйте входные черные и белые значения до тех пор, пока не достигнете такого эффекта:

эффект запотевшего окна в фотошоп

Шаг 18

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

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

Шаг 19

Добавьте новый слой и с помощью инструмента Кисть, с теми же настройками, добавьте еще капель, особенно над текстовой областью. Далее примените тот же стиль слоя, что и на предыдущем слое с каплями: щелкните правой кнопкой мыши по слою с каплями и выберите  Скопировать стиль слоя, далее перейдите на только что созданный нами слой и снова, нажав правую кнопку мыши выберите Вставить стиль слоя.

Шаг 20

Дублируйте слой с фотографией еще раз и удалите маску слоя. Далее перейдите в Слой>Маска слоя>Скрыть выделенную область. Щелкните по миниатюре маски слоя и перейдите в Фильтр>Рендеринг>Облака. Убедитесь, что у Вас установлен основной цвет – Черный, а фоновый – Белый. После выполнения данного шага эффект запотевшего стекла станет еще более реалистичным.

эффект запотевшего стекла

Шаг 21

Выделите все слои, дублируйте их и объедините (только дублированные). Вы также можете использовать комбинацию горячих клавиш Ctrl+Alt+Shift+E. Перейдите в Фильтр>Размытие>Размытие по Гауссу, установите параметр радиуса в 20 пикс.

Шаг 22

Измените, Режим наложения данного слоя на Перекрытие, также установите ему Непрозрачность в 40%.

Шаг 23

Дублируйте предыдущий слой, только теперь изменив Режим наложения на Экран. Непрозрачность оставьте ту же самую.

Шаг 24

Добавьте еще один слой поверх остальных и залейте его радиальным градиентом, используя темно-серые и светло-серые цвета. Также измените Режим наложения данного слоя на Умножение.

эффект запотевшего стеклаИтог урока: Вот и результат нашего урока. Как Вы видите техника создания эффекта запотевшего стекла довольно проста, все заключалось в стилях слоя, масках и фильтрах. Спасибо за внимание, всего Вам доброго!

Конечный результат:

эффект запотевшего стекла

Автор: Abduzeedo;

Переводчик: Сергей Заставный.

Ссылка на источник

Понравился материал?Не жадничай - поделись с другими!

smart-photoshop.ru

Эффект разбитого стекла в Фотошоп

Эффект разбитого стекла в Фотошоп

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

Финальное изображение:

Эффект разбитого стекла в Фотошоп

Дополнительные материалы:

Эффект разбитого стекла в Фотошоп

Шаг 1

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

Эффект разбитого стекла в Фотошоп

Шаг 2

Уменьшим насыщенность фото, перейдем в меню Изображение > Коррекция > Вибрация и установите настройки:Вибрация: +15Насыщенность: -70

Эффект разбитого стекла в Фотошоп

Шаг 3

Для данной сцены, давайте напишем что-нибудь шрифтом без засечек. Я использовал шрифт Pirulen.Цвет шрифта #56767d

Эффект разбитого стекла в Фотошоп

Шаг 4

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

Эффект разбитого стекла в Фотошоп

Прозрачность слоя с текстом слишком высока на мой взгляд, по этому уменьшим ее до 40%. Вот что получается на данном этапе.

Эффект разбитого стекла в Фотошоп

Шаг 5

Чтобы придать фотографии естественности, добавим блик. Создайте новый слой и залейте его черным цветом. Затем зайдите в Фильтр > Рендеринг > Блик. Настройки указаны ниже.

Эффект разбитого стекла в Фотошоп

Установим режим наложения на Экран для устранения черных областей.

Эффект разбитого стекла в Фотошоп

Шаг 6

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

Эффект разбитого стекла в Фотошоп

Шаг 7

Для того чтобы сделать эффект реалистичным, нам нужно размыть область, которую покрывает разбитое стекло. Выберите все слои лежащие ниже слоя с разбитым стеклом и нажмите Alt + Ctrl + E, чтобы объединить их в новый слой. Затем применяем Размытие по Гауссу ( Фильтр > Размытие > Размытие по Гауссу ) с радиусом около 3 px,

Эффект разбитого стекла в Фотошоп

Шаг 8

Создайте слой-маску для размытого слоя.

Эффект разбитого стекла в Фотошоп

Теперь используйте черную круглую кисть, чтобы очистить некоторые области от размытого фона.

Эффект разбитого стекла в Фотошоп

Шаг 9

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

Эффект разбитого стекла в Фотошоп

Шаг 10

Для завершения работы, просто поиграем с двумя корректирующими слоями. Начнем с изменения цветов при помощи Карты градиента ( Слои > Новый корректирующий слой > Карта градиента ). Сделайте переход градиента от фиолетового (# 6f156c) на зеленый (# 00601b) к оранжевому (# fd7c00). Установите режим наложения на Экран, с непрозрачностью 70%.

Эффект разбитого стекла в Фотошоп

Шаг 11

Для того, чтобы стиль винтаж стал еще больше выражен, давайте поиграем немного с корректирующим слоем Цветовой баланс ( Слои > Новый корректирующий слой > Цветовой баланс ). Я просто изменял полутона, пока не стал доволен результатом.

Эффект разбитого стекла в Фотошоп

Конец

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

Эффект разбитого стекла в Фотошоп

psdtop.ru

Как сделать эффект стекла в Фотошопе? - да очень просто | Как сделать..

Стоп - хей! Эффект стекла в фотошоп, идем делать быстрей. :) Все привет в сегодняшнем уроке рассмотрим несколько вариантов о создании эффекта остекления. Читая дальше вы увидите как выглядит данный эффект на деле, и научитесь с легкостью делать его сами.

Я покажу Вам два самых простых способа как можно быстро и красиво сделать эффект стекла.

Эффект стекла в фотошоп - метод первый

По традиции начнем с самого часто используемого метода.

Откройте фотошоп, Файл -> Создать -> (размеры на ваше усмотрение), я применил 750х250px, залейте его черным цветом. Должно получится что то такое:

Шаг 1: Воспользуйтесь инструментом "Прямоугольная область" или нажмите клавишу "М".

Шаг 2: Создайте новый слой или нажмите сочетания клавиш Shift + Ctrl + N

Шаг 3: Кликнув в левом верхнем углу растяните область по горизонтали до правого угла опустив по вертикали до середины изображения, в общем сделайте как на картинке ниже:

Шаг 4: Выберите белый цвет по умолчанию ( или нажмите клавишу "D" для сброса цвета) и залейте им выделенную область воспользовавшись инструментом заливка ( клавиша "G"). 

Шаг 5: Зайдите во вкладку Выделение -> Отменить выделение или нажмите сочетание клавиш Ctrl + D

Шаг 6: Уменьшите прозрачность до 3%

И вот у вас получился настоящий эффект стекла первым способом.

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

 

Эффект стекла в фотошоп - метод второй

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

Шаг 1: Создайте новый документ или останьтесь на предыдущем (только не забудьте удалить слой с эффектом стекла предыдущего метода)

Шаг 2: Зайдите в стиль слоя через вкладку Слои -> Стиль слоя -> Внутренняя тень 

Шаг 3: Установите значения параметров как показано на рисунке ниже

И вот что мы получили с помощью этих манипуляций:

Если вы заметили я в начале этого метода написал про гибкие настройки, я имел виду изменение параметров Внутренней тени для начала давайте рассмотрим скриншот:

 

 

1. Режим наложения

  • Рекомендую ставить на "Нормальный", когда у вас светлые или однотонные изображения. Если вы делаете блик на какой картинке или фотографии то можно по экспирементировать с другими режимами например: перекрытие, осветление основы, экран, мягкий свет.

2. Цвет

  • Думаю тут все логично, мы делаем эффект стекла а не плосмасса поэтому единогласно цвет должен быть белый или #ffffff

3. Непрозрачность

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

4. Угол света

  • Здесь фотошоп предлагает нам задать угол источника света, то есть под каким углом или с какой стороны будет отображаться наш эффект. Давайте я приду несколько значений​ Эффект с верху  значение 90оЭффект с низу значение -90оЭффект с права значение 0оЭффект с лева значение 180оЕсли нужен не стандартный эффект, крутите угол пока не добьетесь нужно :)

5. Смещение 

  • В данном параметре можно отрегулировать нахождение эффекта, то есть будет он до центра картинки или чуть чуть сверху, двигайте ползунок и найдете идеальное значение.

6. Стягивание

  • Данный параметр работает на пару с параметром 7. Размер. Он отвечает за жесткость (четкость).

7. Размер

  • Рекомендую ставить значение на 0, потому что при увеличение размера, получается рамка а не эффект. Но! Если вам не нравятся жесткие края эффекта стекла, вы можете установить значение:Стягивание - 0Размер - 10И ваши края размоются (расплывутся) что при даст мягкости данному эффекту.

 

В заключение 

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

ps-magic.ru


Смотрите также