Прозрачный стеклянный текст — уроки фотошоп

Как сделать стеклянный и прозрачный текст в Фотошопе

В этом уроке мы будем создавать стеклянный прозрачный текст в Фотошопе.

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

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

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

Итак, начнем с того, что создадим новый документ 850 х 550 пикселей, поместим в него фон. Измените размер, если потребуется, а затем объедините (Ctrl + Е) ваш фон с фоновым слоем Фотошопа, созданным по умолчанию.

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

Измените значение Заливки (Fill) текстового слоя на 0, затем создайте еще 3 копии этого слоя, т.о. в итоге у вас будет 4 текстовых слоя.

Шаг 2. Добавление текста

Дважды кликните по оригинальному текстовому слою и примените стиль Тиснение (Bevel and Emboss) с такими настройками:

— Размер (Size): 27

Уберите галочку в окошке Глобальное освещение (Use Global Light)

— Угол (Angle) : 149

— Высота (Altitude) : 58

— Контур глянца (Gloss Contour): Перевернутый конус (Cone – Inverted)

— Режим подсветки (Highlight Mode): Осветление (Screen) с Непрозрачностью (Opacity) 100%

— Режим тени (Shadow Mode): Умножение (Multiply) с Непрозрачностью (Opacity) 3%

Вкладка Контур (Contour):

— поставьте галочку в окошке Сглаживание (Anti-aliased)

Стиль Обводка (Stroke):
— Размер (Size): 1 пиксель

— Тип заливки (Fill Type): градиент (Gradient)

— Угол (Angle): 90

— Градиент (Gradient): нержавеющая сталь 10 пикселей – но вы можете использовать и другие градиенты из файла CHROMES.grd по желанию)

Стиль Внутренняя тень (Inner Shadow):

— Непрозрачность (Opacity): 25%
Чем большим будет значение Непрозрачности, тем более очерченным будет эффект.

Стиль Тень (Drop Shadow):

— Непрозрачность (Opacity): 19%

— Уберите галочку в окошке Глобальное освещение (Use Global Light)

— Угол (Angle): -143

— Смещение (Distance); 18

Это начальный вид эффекта, но он еще слишком упрощен.

Шаг 3. Добавление стиля слоя

Дважды кликните по первой копии текстового слоя и примените следующие стили:

Тиснение (Bevel and Emboss):
— Размер (Size): 10

— Уберите галочку в окошке Глобальное освещение (Use Global Light)

— Угол (Angle): 63

— Высота (Altitude): 69

— Поставьте галочку в окошке Сглаживание (Anti-aliased)

— Режим подсветки (Highlight Mode): Осветление (Screen) с Непрозрачностью (Opacity) 100%

— Режим тени (Shadow Mode): Умножение (Multiply) с Непрозрачностью (Opacity) 0%

Вы можете подвигать положение в круге, регулирующем Угол (Angle) и Высоту (Altitude), чтобы посмотреть, как это меняет картину. Выберите значение на свое усмотрение и нажмите ОК.

Этот простой шаг добавил сияния верхним краям текста.

Шаг 4. Добавление стиля слоя

Дважды кликните по второй копии текстового слоя и примените следующие стили:

Тиснение (Bevel and Emboss):

— Глубина (Depth): 150%
— Размер (Size): 15

— Уберите галочку в окошке Глобальное освещение (Use Global Light)

— Угол (Angle): -129

— Высота (Altitude): 58

— Поставьте галочку в окошке Сглаживание (Anti-aliased)

— Режим подсветки (Highlight Mode): Осветление (Screen) с Непрозрачностью (Opacity) 100%

·         — Режим тени (Shadow Mode): Умножение (Multiply) с Непрозрачностью (Opacity) 0%

Вкладка Контур (Contour):

— Контур (Contour): Полукруг (Half Round)
— поставьте галочку в окошке Сглаживание (Anti-aliased)

Это добавить блеска и глянца нижним краям и усилит эффект объема.

Шаг 5. Добавление стиля слоя

Дважды кликните по третьей копии текстового слоя и примените следующие стили:

Тиснение (Bevel and Emboss):

— Размер (Size): 21

— Уберите галочку в окошке Глобальное освещение (Use Global Light)

— Угол (Angle): -135

— Высота (Altitude): 69

— Поставьте галочку в окошке Сглаживание (Anti-aliased)

— Режим подсветки (Highlight Mode): Осветление (Screen) с Непрозрачностью (Opacity) 100%

— Режим тени (Shadow Mode): Умножение (Multiply) с Непрозрачностью (Opacity) 0%

Вкладка Контур (Contour):

— Контур (Contour): Ассиметричный конус (Cone – Asymmetrical)
— поставьте галочку в окошке Сглаживание (Anti-aliased)

Это добавит блеска центральной части текста. Ключевое значение в этом играют настройки значений Угла (Angle) и Высоты (Altitude) стиля Тиснение (Bevel and Emboss)

Шаг 6. Добавление стиля слоя

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

Щелкните по иконке Создать новый корректирующий слой или слой-заливку (Create new fill or Adjustment layer) внизу панели слоев и выберите Градиент (Gradient).

Создайте градиент от прозрачности к заливке с цветом #7c7c7c по обеим сторонам градиента. Измените тип на Радиальный (Radial) и Масштаб (Scale) на 500.

Измените режим наложения слоя с градиентом на Линейный затемнитель (Linear Burn) с Непрозрачностью (Opacity) 30%.

Примечание

Созданный стеклянный эффект является масштабируемым. Вы можете выбрать в меню Изображение > Размер изображения (Image > Image Size) и проверить, чтобы в окошке Масштабировать стили (Scale Styles) стояла галочка. Т.о. вы можете изменять размер изображения, как вам нравится и эффект будет сохраняться.

Шаг 7. Финальное изображение

Вот и все!

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

Как сделать прозрачный текст

Как вы, наверное, уже знаете, такое понятие как «мода» присутствует даже в дизайне сайтов. Как в основной стилистике, так и в элементах. Особой популярностью в последнее время пользуется flat.

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

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

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

В окне слоев ищем наш текстовый слой и меняем его непрозрачность до 50%.

Вот и все! Осталось только свести слои. Для этого нажимаем комбинацию клавиш ctrl+shift+e. И можно сохранять.

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

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

Пишем текст, но уже черным цветом.

А теперь в окне слоев меняем режим наложения на «замена светлым». Наш текст становится невидимым. Придадим же ему объем. Используем мой любимый инструмент» параметры наложения». Вызываются они правым кликом мышки по слою.

Нас интересуются параметры «тень», со следующими настройками:

И «тиснение»:

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

Сводим слои, сохраняем.

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

Третья вариация самая простая. Тот же черный текст. Тот же режим наложения «замена светлым». Но в параметрах наложения выбираем только обводку со следующими настройками:

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

Прозрачный текст в Фотошоп

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

Финальное изображение, которое мы будем создавать:

Загрузить исходные файлы

Используемые материалы Следующие материалы были использованы в данном уроке:

Шрифт —TheNautiGal

Текстура для фона — Graphic River
Фоновое изображение (бесплатно)

Шаг 1 — Подготовка материалов и создание документа

Создайте новый PSD документ, 600 х 400 пикселей в RGB режиме разрешением 72 точки на дюйм с белым фоном.  Теперь подготовим наши материалы.  Установите шрифт TheNautiGal на ваш компьютер и при необходимости откройте .PAT файл для создания фона или используйте готовое фоновое изображение, чтобы не создавать фон. Вы можете пропустить создание фона и перейти сразу к шагу 3 этого урока.

Шаг 2 — Создание фона

Идём в Menu>Layer> Layer Styles> Blending Options (Меню>Слой>Стиль слоя>Параметры наложения) и используем  настройки ниже. Вы также можете получить доступ к Параметрам наложения  двумя более быстрыми способами.  Первый и самый быстрый способ это дважды щелкнуть на слое в меню слоев.

Другой способ: Нажмите правой кнопкой мыши на слое в меню слоев и выберите Режимы наложения.  Когда вы закончите со всеми настройками ниже, не забудьте нажать «OK» в окне настроек наложения! Если вы скачали шаблоны файлов – используйте шаблон № 31.  Вы также можете оставить фон без наложения текстуры или использовать любую другую текстуру, которая подойдёт для светлого фона.

Внутренняя тень: Режим наложения  – Линейный затемнитель, цвет #171718, непрозрачность 34%, угол -90, использовать глобальное освещение, смещение 96 пикс., стягивание 30%, размер 250 пикс., шум 8%.

Внутреннее свечение: Режим наложения: Осветление основы, непрозрачность 19%, шум 0%, цвет #ffffff, метод-мягкий, источник — из центра, стягивание 24%, размер 250 пикс., диапазон 50%, колебание 0%.

Наложение градиента: Режим наложения  — Умножение, непрозрачность 100%, , от #80b2a7 до #c7c8a2, стиль — радиальный, галочка «выровнять по слою», угол 0, масштаб 74%.

Наложение узора: Режим наложения — Нормальный, непрозрачность 100%, используйте  текстуру из набора 72 Subtle Web Patterns, масштаб 100%.

Шаг 3 — Приступим к созданию первого слоя с текстом

Теперь мы можем начать делать наш текстовый эффект.  Сначала выберите инструмент «текст» и измените шрифт на TheNautiGal, размером около 255 пунктов и метод сглаживания — резкий.  Теперь введите текст где-то в центре изображения.  Вы можете написать любое слово, но в этом уроке мы будем использовать слово «Wow».

Шаг 4

Этот первый слой с текстом будет расположен ниже всех текстовых слоев.  Идём в Menu>Layer> Layer Styles> Blending Options (Меню>Слой>Стиль слоя>Параметры наложения) и используем  настройки ниже для нашего текста.
Установите непрозрачность заливки — 0%.

Тень: Режим наложения — Линейный затемнитель, цвет #171718, непрозрачность 19%, угол — 52, снять галочку с «использовать глобальное освещение», смещение 11 пикс., стягивание 0%, размер 16 пикс., шум 0%.

Тиснение: Стиль-внутренний скос, метод-плавный, глубина 83%, направление — вверх, размер 3 пикс., смягчение 0 пикс., угол 0, снять галочку с «использовать глобальное освещение», высота 26, галочка на «сглаживание», режим подсветки — линейный осветлитель, цвет #ffffff, непрозрачность 28%, режим тени — линейный затемнитель, цвет #000000, непрозрачность 0%.

Шаг 5 — Создание и настройка 2-го слоя с текстом

Теперь дублируем слой с текстом. Выделите слой с текстом и перейдите Menu > Layer > Duplicate layer  (Меню>Слой>Создать дубликат слоя) и назовите его как хотите.

  Теперь перейдите Menu> Layer> Layer Style> Clear Layer Style (Меню>Слой>Стиль слоя>Очистить стиль слоя), так как мы будем применять другой стиль для этого слоя.

  Наконец идите в Menu> Layer> Layer Style> Blending Options (Меню>Слой>Стиль слоя>Параметры наложения) и используйте настройки ниже для вашего текста.

Опять же, вы можете использовать быстрый доступ к параметрам наложения  из шага 2 этого урока.  Когда вы закончите со всеми настройками ниже, не забудьте нажать «OK» в окне настроек наложения! Этот слой с текстом будет в середине всех слоев.  Так что сейчас он должна быть расположен выше первого слоя с текстом.
Установите непрозрачность заливки-0%.

Внутренняя тень: Режим наложения – Линейный затемнитель, цвет #171718, непрозрачность 24%, угол 180, снять галочку с «использовать глобальное освещение», смещение 1 пикс., стягивание 0%, размер 0 пикс., шум 0%.

Тиснение: Стиль-внутренний скос, метод-плавный, глубина 1000%, направление — вверх, размер 4 пикс., смягчение 1 пикс., угол 0, снять галочку с «использовать глобальное освещение», высота 26, галочка на «сглаживание», режим подсветки-осветление основы, цвет #ffffff, непрозрачность 4%, режим тени — линейный затемнитель, цвет #000000, непрозрачность 10%.

Шаг 6

Создание и настройка последнего 3-го слоя с текстом. Мы почти у цели.  Теперь нам нужно дублировать наш 2-ой слой с текстом.  Выделите слой с текстом и перейдите Menu > Layer > Duplicate layer  (Меню>Слой>Создать дубликат слоя) и назовите его как хотите.

  Теперь перейдите Menu> Layer> Layer Style> Clear Layer Style (Меню>Слой>Стиль слоя>Очистить стиль слоя), так как мы будем применять другой стиль для этого слоя.

  Наконец идите в Menu> Layer> Layer Style> Blending Options (Меню>Слой>Стиль слоя>Параметры наложения) и используйте настройки ниже для вашего текста.

Опять же, вы можете использовать быстрый доступ к параметрам наложения  из шага 2 этого урока.  Когда вы закончите со всеми настройками ниже, не забудьте нажать «OK» в окне настроек наложения!  Это — главный слой с текстом и он должен быть расположен выше всех других слоев с текстом.

https://www.youtube.com/watch?v=M-iJecQYDN4

Установите непрозрачность заливки — 0%.

Тень: Режим наложения — Умножение, цвет #171718, непрозрачность 82%, угол -0, снять галочку с «использовать глобальное освещение», смещение 2 пикс., стягивание 0%, размер 8 пикс., шум 0%.

Внутренняя тень: Режим наложения – Линейный осветлитель, цвет #ffffff, непрозрачность 22%, угол — 90, снять галочку с «использовать глобальное освещение», смещение 1 пикс., стягивание 0%, размер 0 пикс., галочка на «сглаживание», шум 0%.

Тиснение: Стиль — внутренний скос, метод-плавный, глубина 1000%, направление — вверх, размер 16 пикс., смягчение 0 пикс., угол 0, снять галочку с «использовать глобальное освещение», высота 40, галочка на «сглаживание», режим подсветки — линейный осветлитель, цвет #ffffff, непрозрачность 18%, режим тени — линейный затемнитель, цвет #000000, непрозрачность 8%.

Обводка: Размер 1 пикс., положение — внутри, режим наложения-перекрытие, непрозрачность 27%, тип обводки — цвет, цвет #999999.

Окончательное изображение

Автор урока: Jan Stverak
Переводчик урока: Сабчук Ангелина
Ссылка на источник урока

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

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

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

Стеклянный текст или поверхность чего-либо должна получиться вполне реалистичной. Давайте начнем!

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

Шаг 1

Сначала создайте новый PSD документ, размером 600х400px в режиме RGB, 72 dpi с белым цветом фона. Далее 2 раза кликните на единственном слое, чтобы сделать его редактируемым.

Шаг 2

Создадим фон или подложку. Выберите Меню -> Layer -> Layer Style -> Blending Options и установите параметры как на скриншотах ниже. Вы также можете получить доступ к свойствам Blending Options двумя быстрыми способами.

Первый и самый быстрый способ, дважды щелкните на слой в меню слоев (старайтесь не попадать на имя слоя). Второй способ заключается в клике правой кнопкой мыши на слое в меню слоев и выборе пункта Blending Options.

Когда вы закончите со всеми настройками какие показаны ниже, не забудьте нажать “OK”.

Шаг 3

Приступить к созданию первого слоя текста. Теперь мы можем начать делать наш текстовый эффект стекла. Сначала выберите инструмент “текст” и изменить шрифт на The Nautigal, размером около 250 px и сглаживанием “Sharp”. Теперь введите текст расположив его например по центру. Вы можете написать любое слово, я написал “Labdes”.

Шаг 4

Это первый слой текста из трех, который будет располагаться в нижней части всех текстовых слоев. Выберите Меню -> Layer -> Layer Style -> Blending Options и установите параметры как показано ниже.

Шаг 5

Создание и настройка 2-го слоя из трех нашего будущего стеклянного текста. Дублируем первый слой с текстом. Для этого перетащите первый текстовый слой на значок нового слоя внизу панели слоев. Выберите получившийся новый текстовый слой.

Перейдите в меню Layer -> Layer Style -> Очистить стиль слоя, либо кликните правой кнопкой на слое и выберете нужный пункт меню как показано ниже. Наконец перейдем в настройки слоя Layer -> Layer Style -> Blending Options.

Этот текстовый слой будет располагаться по середине из наших 3-х текстовых слоев.

Шаг 6

Создание и настройка последнего 3-го слоя стеклянного текста. Мы почти у цели. Теперь нам нужно снова дублировать текстовый слой, на этот раз 2-ой.

После этого очистите стиль слоя, как мы делали это на предыдущем шаге. Наконец, перейдем снова в настройки слоя Layer -> Layer Style -> Blending Options и укажем параметры как показано ниже.

Этот текстовый слой должен быть наверху из наших 3-х слоев с текстом.

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

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

Надеюсь у вас все получится!

Стеклянный текст с жидкостью с помощью Фотошопа

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

https://www.youtube.com/watch?v=Huh4HcfQfVM

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

Шаг 1

Создайте документ 1500px на 1000px. Заполните фон Линейным Градиентом (Linear Gradient) используя цвет #acacac как Foreground цвет, и #e1e1e1 как  Background цвет. Начните с низа файла и двигайтесь вверх.

Шаг 2

Теперь наберите тот текст, на котором вы хотите испробовать эффект. Используйте цвет #dbdbdb, размер 300px. Шрифт в данном уроке это “Cooper Std”, но подойдет любой жирный шрифт. Скопируйте текстовый слой, и назовите и так, как показано на картинке.

Шаг 3

С помощью двойного нажатия на слой «bottom» откройте меню Layer Style и примените следующие настройки.

Шаг 4

Измените значение заливки слоя «top» на 0%. Затем с помощью двойного нажатия на этот слой откройте меню Layer Style и примените следующие настройки.

Шаг 5

Используя инструмент Rectangle Tool нарисуйте прямоугольную форму, которая закроет нижнюю половину текста. Цвет формы измените на #aa4280. Убедитесь в том, что слой с прямоугольной формой находится между слоями «top» и «bottom».

Шаг 6

Выберите инструмент Add Anchor Point Tool и добавьте точки на краях букв в тех местах, которые пересекаются с цветным прямоугольником.

Шаг 7

После добавления точек, добавьте точки между уже существующими точками. Это определит нижние и верхние точки волн жидкости.

После этого, выберите инструмент Direct Selection Tool и, выбрав точки, сдвиньте их вверх и вниз. Удалите точки, которые посчитаете ненужными с помощью инструмента Delete Anchor Point Tool.

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

Шаг 8

Теперь переведем слой с цветным прямоугольником в растр. Сделайте копию слоя, нажмите правой кнопкой на новом слое и выберете Rasterize Layer. Затем нажмите клавишу Cmd/Ctrl и, удерживая ее, нажмите правой кнопкой на иконку одного из текстовых слоев, чтобы создать выделение. После этого нажмите Cmd/Ctrl + Shift + I, чтобы инвертировать выделение, и нажмите Delete.

Шаг 9

С помощью двойного нажатия на слой растровой формой откройте меню стилей слоев и примените следующие настройки:

Шаг 10

Вот все и готово, но по желанию вы с легкостью можете изменить цвет жидкости, открыв меню слоя Hue/Saturation и выбрав нужный вам цвет.

По материалам Psd.Tutsplus

Рисуем стеклянный текст в Photoshop CS

Сегодня вы научитесь работать, с одним из самых популярнейших стилей — Bevel and Emboss [Фаска и рельеф], который, к сожалению, многие пользователи не всегда используют полностью, забывая про его возможности. С помощью этой статьи я попробую исправить сложившееся положение. Итак — «Стеклянный текст».

Шаг 1

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

Итак, выполните команду File > New [Файл > Новый]. Задайте размер изображения 900 x 300. Resolution [Разрешение] выставите 100 pixel/inch. Нажмите Ok.

Заполните изображение черным цветом, для этого можно воспользоваться «сбрасыванием» цветов на умолчания и последующим заполнением слоя цветом переднего плана — клавиша D, затем сочетание Alt+Backspace.

Сделайте активным инструмент Type [Текст], выберите гарнитуру Georgia, задайте ее размер 90 pt, выставите Bold Italic (Полужирный Курсив) и напечатайте какой-нибудь текст, белым цветом.

Шаг 2

Сделайте активным слой с текстом (он будет иметь название тех букв, которые вы напечатали). Примените к нему стиль Bevel and Emboss [Фаска и рельеф], выполнив команду Layer > Layer Style > Bevel and Emboss [Слой > Стиль слоя > Фаска и рельеф].

В диалоговом окне измените следующие параметры:

Style [Стиль] – Emboss [Рельеф] — режим помещает эффект скоса и рельефа не только внутри текущего слоя, но и снаружи (в данном случае это слой с текстом), таким образом, вы получаете сразу два эффекта – внутреннего и внешнего скоса;

Size [Размер] –3;

Снимите флажок возле строки Use Global light [Использовать Глобальный свет] — помогает вам сохранить или изменить все «световые» настройки в вашем документе. В настоящий момент его снятие необходимо нам для того, чтобы другие эффекты не поменяли освещения своими параметрами;

Измените Highlight mode [Режим подсветки] на Normal [Нормальный], Opacity [Непрозрачность] выставите 100%. Цвет установите #6E6EBE.

Измените Shadow mode [Режим тени] на Normal [Нормальный]. Opacity [Непрозрачность] выставите 100%. Цвет установите #2D375A. Два вышеописанных режима были изменены на «нормальный» режим, в связи с тем, что в дальнейшем мы будем использовать их цвета прямо на фоне, без использования объединения цветов режимом Screen [Экран] и Multiply [Множественный]

Совет:

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

Для их подборки можно использовать Hue/Saturation (Оттенок/Насыщенность) слои или Color Balance (Баланс Цветов) слои.

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

Когда я занимаюсь такой подборкой, то сначала использую совершенно произвольные цвета (тем не менее, они согласуются между собой), затем делаю форму и только потом с помощью настраиваемых слоев (они создаются из подменю Layer >New Adjustments Layer [Слой > Новый настраиваемый слой]) подбираю необходимые оттенки.

Шаг 3

На этом настройка стиля не заканчивается. Присмотритесь внимательней ко всем параметрам, вы не изменяли один из ключевых — контур. Итак, дважды щелкните в поле Gloss contour [Контур блеска]. Откроется диалоговое окно Contour editor [Редактор Контуров].

С ним мы и будем сейчас работать – это сердце нашего эффекта.

Линия, располагающаяся посередине, показывает, что цвета после применения значений будут применены в средней части слоя с параметрами: Input [Вход] – 50; Output [Выход] – 50, что соответствует значениям, установленным по умолчанию.

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

Для лучшего усвоения материала рекомендую вам взглянуть на рис. 1.

Теперь, оставаясь в диалоговом окне, выберите Custom [Выборочный] (поле Preset [Предустановки]). Щелкните левой кнопкой мыши в середине линии. Появится крестик, в поле Input [Вход] введите 75, в поле Output [Выход]: 50. (рис. 2)

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

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

Шаг 4

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

Итак, измените параметры Bevel and Emboss [Фаска и рельеф] на слое следующим образом:

Depth [Глубина] – 140% — увеличение этого параметра сделает подсветку более четкой;
Size [Размер] – 8% — делает текстовый эффект, полужирного шрифта.
Теперь, дважды щелкните на Gloss contour [Контур блеска] и установите кривую, как на рис. 3

Наконец-то, получилось что-то дельное :). Итак, левая часть кривой представляет затемненные части изображения, а правая светлые — поинтеры, установленные близко к основанию уступят цвет, который мы устанавливали для теневого режима.

Поинтеры, установленные ближе к середине, «выдаст» прозрачный цвет (который на самом деле в нашем случае является черным). И, наконец, поинтеры, установленные ближе к вершине, «выдаст» цвета, которые мы устанавливали для Highlight mode [Режим подсветки].

Теперь, работая все с тем же стилем, установите у него Angle [Угол] — 110, а Attitude [Высота] — 60.

При такой настройке высоты (с освещением, располагающимся ближе к вершине), рельефный стиль для Bevel and Emboss [Фаска и рельеф] эффекта создает два уровня скоса — очень удобно.

Шаг 5

Внимательно посмотрите на ваш результат. Для придания стеклянных оттенков не хватает подсветки. Сделать ее можно при помощи стиля Outer Glow [Внешний свет]. Но этим все не ограничится, мы создадим дополнительные слои и с их помощью сделаем эффект воды в стекле. Но обо всем по порядку. Для начала щелкните правой кнопкой мыши по слою с текстом и выберите строку (Create layers [Создать слои]).

Примечание: Если при щелчке правой кнопкой мыши вы не обнаружили данной строчки, значит вы не попали в слой, попробуйте щелкнуть в другом месте.

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

Убедитесь в активности слоя с текстом (у которого заполнение выставлено на 0%).

И примените к нему стиль Bevel and Emboss [Фаска и рельеф] со следующими параметрами:

Style [Стиль] — Inner Bevel [Внутренний скос];

Depth [Глубина] — 311%;

Size [Размер] — 6%;

Angle [Угол] — 20;

Attitude [Высота] 30;

Highlight mode [Режим подсветки] на Normal [Нормальный], Opacity [Непрозрачность] выставите на 100%. Цвет установите #FFFFFF;

Shadow mode [Режим тени] на Normal [Нормальный]. Opacity [Непрозрачность] выставите на 0%. Цвет установите #000000.

И не забудьте снять флажок Use Global light [Использовать Глобальный свет].

Шаг 6

Теперь добавим воду в текст. Для этого нужно создать новый слой командой Layer >New > Layer [Слой > Новый >Слой] и разместить его выше предыдущих. Изменить Blending Mode [Режим смешивания] на Hard Light [Жесткий свет].

Задать цвет переднего плана #AFAFFF. Сделать активным инструмент Brush [Кисть] установить Hardness [Жесткость] 100% и нарисовать волны на тексте. Сейчас необходимо создать маску волнового слоя в соответствии с текстом.

Первое, что может прийти большинству в голову – создать маску для первоначального текстового слоя. Безусловно, можно и так, но в этом случае эффект будет испорчен. Вместо этого, лучше использовать слои с тенью и подсветками созданные от Bevel and Emboss [Фаска и рельеф] стиля. Итак, сделайте активным слой «Photoshops Emboss Shadows».

(Название этому слою Photoshop задал автоматически после выполнения соответствующей команды) загрузите его непрозрачность, щелкнув по нему правой кнопкой мыши по слою, и выберите строчку Select Layer Transparency [Загрузить Прозрачность Слоя].

Теперь, сделайте активным слой с волнами и щелкните в палитре Layers [Слои] на строчке Add Layer Mask [Добавить маску слоя].

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

Шаг 7

Осталось добавить последний штрих — изящную пену на поверхности волны. Создайте новый слой и поместите его выше ранее созданных. Установите его Opacity [Непрозрачность] на 30%.

Нажмите клавишу B для активации инструмента Brush [Кисть], выберите жесткую кисть небольшого размера, например 3 px (цвет установите #FFFFFF). Проведите белую линию по контуру созданной вами волны.

Затем размажьте получившеюся линию инструментом Smudge [Палец]. И, наконец, установите Opacity [Непрозрачность] слоя с волной на 55%.

Примените к слою с текстом стиль Outer Glow [Внешний свет]. Измените там только параметр Opacity [Непрозрачность] задав его равным 30%

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

Прозрачный текст в Фотошоп

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

Финальное изображение, которое мы будем создавать:

Загрузить исходные файлы

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

Используемые материалы Следующие материалы были использованы в данном уроке:

Шрифт -TheNautiGal

Текстура для фона — Graphic River
Фоновое изображение (бесплатно)

Шаг 1 – Подготовка материалов и создание документа

Создайте новый PSD документ, 600 х 400 пикселей в RGB режиме разрешением 72 точки на дюйм с белым фоном.  Теперь подготовим наши материалы.  Установите шрифт TheNautiGal на ваш компьютер и при необходимости откройте .PAT файл для создания фона или используйте готовое фоновое изображение, чтобы не создавать фон. Вы можете пропустить создание фона и перейти сразу к шагу 3 этого урока.

Шаг 2 – Создание фона

Идём в Menu>Layer> Layer Styles> Blending Options (Меню>Слой>Стиль слоя>Параметры наложения) и используем  настройки ниже. Вы также можете получить доступ к Параметрам наложения  двумя более быстрыми способами.  Первый и самый быстрый способ это дважды щелкнуть на слое в меню слоев.

Другой способ: Нажмите правой кнопкой мыши на слое в меню слоев и выберите Режимы наложения.  Когда вы закончите со всеми настройками ниже, не забудьте нажать “OK” в окне настроек наложения! Если вы скачали шаблоны файлов – используйте шаблон № 31.  Вы также можете оставить фон без наложения текстуры или использовать любую другую текстуру, которая подойдёт для светлого фона.

Внутренняя тень: Режим наложения  – Линейный затемнитель, цвет #171718, непрозрачность 34%, угол -90, использовать глобальное освещение, смещение 96 пикс., стягивание 30%, размер 250 пикс., шум 8%.

Внутреннее свечение: Режим наложения: Осветление основы, непрозрачность 19%, шум 0%, цвет #ffffff, метод-мягкий, источник – из центра, стягивание 24%, размер 250 пикс., диапазон 50%, колебание 0%.

Наложение градиента: Режим наложения  — Умножение, непрозрачность 100%, , от #80b2a7 до #c7c8a2, стиль – радиальный, галочка “выровнять по слою”, угол 0, масштаб 74%.

Наложение узора: Режим наложения – Нормальный, непрозрачность 100%, используйте  текстуру из набора 72 Subtle Web Patterns, масштаб 100%.

Шаг 3 – Приступим к созданию первого слоя с текстом

Теперь мы можем начать делать наш текстовый эффект.  Сначала выберите инструмент “текст” и измените шрифт на TheNautiGal, размером около 255 пунктов и метод сглаживания – резкий.  Теперь введите текст где-то в центре изображения.  Вы можете написать любое слово, но в этом уроке мы будем использовать слово “Wow”.

Шаг 4

Этот первый слой с текстом будет расположен ниже всех текстовых слоев.  Идём в Menu>Layer> Layer Styles> Blending Options (Меню>Слой>Стиль слоя>Параметры наложения) и используем  настройки ниже для нашего текста.
Установите непрозрачность заливки – 0%.

Тень: Режим наложения – Линейный затемнитель, цвет #171718, непрозрачность 19%, угол – 52, снять галочку с “использовать глобальное освещение”, смещение 11 пикс., стягивание 0%, размер 16 пикс., шум 0%.

Тиснение: Стиль-внутренний скос, метод-плавный, глубина 83%, направление – вверх, размер 3 пикс., смягчение 0 пикс., угол 0, снять галочку с “использовать глобальное освещение”, высота 26, галочка на “сглаживание”, режим подсветки – линейный осветлитель, цвет #ffffff, непрозрачность 28%, режим тени – линейный затемнитель, цвет #000000, непрозрачность 0%.

Шаг 5 – Создание и настройка 2-го слоя с текстом

Теперь дублируем слой с текстом. Выделите слой с текстом и перейдите Menu > Layer > Duplicate layer  (Меню>Слой>Создать дубликат слоя) и назовите его как хотите.

  Теперь перейдите Menu> Layer> Layer Style> Clear Layer Style (Меню>Слой>Стиль слоя>Очистить стиль слоя), так как мы будем применять другой стиль для этого слоя.

  Наконец идите в Menu> Layer> Layer Style> Blending Options (Меню>Слой>Стиль слоя>Параметры наложения) и используйте настройки ниже для вашего текста.

Опять же, вы можете использовать быстрый доступ к параметрам наложения  из шага 2 этого урока.  Когда вы закончите со всеми настройками ниже, не забудьте нажать “OK” в окне настроек наложения! Этот слой с текстом будет в середине всех слоев.  Так что сейчас он должна быть расположен выше первого слоя с текстом.
Установите непрозрачность заливки-0%.

Внутренняя тень: Режим наложения – Линейный затемнитель, цвет #171718, непрозрачность 24%, угол 180, снять галочку с “использовать глобальное освещение”, смещение 1 пикс., стягивание 0%, размер 0 пикс., шум 0%.

Тиснение: Стиль-внутренний скос, метод-плавный, глубина 1000%, направление – вверх, размер 4 пикс., смягчение 1 пикс., угол 0, снять галочку с “использовать глобальное освещение”, высота 26, галочка на “сглаживание”, режим подсветки-осветление основы, цвет #ffffff, непрозрачность 4%, режим тени – линейный затемнитель, цвет #000000, непрозрачность 10%.

Шаг 6

Создание и настройка последнего 3-го слоя с текстом. Мы почти у цели.  Теперь нам нужно дублировать наш 2-ой слой с текстом.  Выделите слой с текстом и перейдите Menu > Layer > Duplicate layer  (Меню>Слой>Создать дубликат слоя) и назовите его как хотите.

  Теперь перейдите Menu> Layer> Layer Style> Clear Layer Style (Меню>Слой>Стиль слоя>Очистить стиль слоя), так как мы будем применять другой стиль для этого слоя.

  Наконец идите в Menu> Layer> Layer Style> Blending Options (Меню>Слой>Стиль слоя>Параметры наложения) и используйте настройки ниже для вашего текста.

Опять же, вы можете использовать быстрый доступ к параметрам наложения  из шага 2 этого урока.  Когда вы закончите со всеми настройками ниже, не забудьте нажать “OK” в окне настроек наложения!  Это – главный слой с текстом и он должен быть расположен выше всех других слоев с текстом.

https://www.youtube.com/watch?v=M-iJecQYDN4

Установите непрозрачность заливки – 0%.

Тень: Режим наложения – Умножение, цвет #171718, непрозрачность 82%, угол -0, снять галочку с “использовать глобальное освещение”, смещение 2 пикс., стягивание 0%, размер 8 пикс., шум 0%.

Внутренняя тень: Режим наложения – Линейный осветлитель, цвет #ffffff, непрозрачность 22%, угол – 90, снять галочку с “использовать глобальное освещение”, смещение 1 пикс., стягивание 0%, размер 0 пикс., галочка на “сглаживание”, шум 0%.

Тиснение: Стиль – внутренний скос, метод-плавный, глубина 1000%, направление – вверх, размер 16 пикс., смягчение 0 пикс., угол 0, снять галочку с “использовать глобальное освещение”, высота 40, галочка на “сглаживание”, режим подсветки – линейный осветлитель, цвет #ffffff, непрозрачность 18%, режим тени – линейный затемнитель, цвет #000000, непрозрачность 8%.

Обводка: Размер 1 пикс., положение – внутри, режим наложения-перекрытие, непрозрачность 27%, тип обводки – цвет, цвет #999999.

Окончательное изображение