Текстовый эффект в восточном стиле в Adobe Photoshop
В этом уроке мы будем создавать интересный текстовый эффект в Photoshop. Мы начнем с создания паттерна с красивой цветочной текстуры в восточном стиле. После этого мы используем ее для создания тисненого красного фона, а также для оформления текста. Мы используем стили слоя, режимы наложения и фильтры, чтобы добиться финального результата.
Результат
Исходники
Для выполнения этого урока вам понадобятся следующие исходники:
- Китайская цветочная текстура
- Гранж-текстура
- Шрифт в японском стиле
Создаем узор из текстуры
Откройте китайскую цветочную текстуру из исходников в Photoshop. Убедитесь что вы скачали самый большой вариант файла.
Выберите в меню Edit > Define Pattern/Редактировать>Определить узор.
Создаем восточный красный фон
Красный цвет очень популярен в китайской культуре. Он символизирует удачу, счастье и радость. Вот почему мы сделаем наш фон красным.
Создайте новый файл PSD, создайте новый слой и назовите его Asian Background. Залейте слой белым цветом. Кликните по нему дважды, чтобы открыть стили слоя и укажите стили Color Overlay/Перекрытие цвета (цвет #7e0404) и Bevel and Emboss/Тиснение.
Включите подпункт Texture/Текстура в стиле слоя Тиснение, и выберите наш китайский цветочный узор. Scale/Размер текстуры настройте под размер вашего документа.
Новым слоем добавьте гранж-текстуру и укажите слою режим наложения Soft Light/Мягкий свет, на opacity/непрозрачности в 58%.
Текст в японском стиле
Используйте шрифт из исходников, чтобы ввести ваш текст. Назовите его Asian Text. Нажмите Control-J чтобы создать копию текста и назовите копию Asian Text 1. Нажмите Control-J еще раз и назовите копию Asian Text 2.
Укажите следующие стили для слоя Asian Text 1.
Для стиля Inner Glow/Внутреннее свечение используйте цвета #ffffbe .
Для стиля Bevel and Emboss/Тиснение используйте цвета #ffffff и #f5f0ea .
Стиль Satin/Глянец и цвет #1749d7 .
Stroke/Обводка — цвет #ed2024 .
Вот что должно получиться:
Укажите слою Asian Text 2 следующие стили слоя:
Укажите слою Fill/Заливку в 0%.
Результат должен выглядеть так:
Кликните правой кнопкой по слою Asian Text и выберите Rasterize Text/Растрировать текст. В меню выберите Filter > Other > Minimum/Фильтр>Другой>Минимум.
Кликните правой кнопкой по слою Asian Text 2 и выберите Copy Layer Style/Копировать стиль слоя. Кликните правой кнопкой по слою Asian Text и выберите Paste Layer Style/Вставить стиль слоя.
Вы можете открыть окно со стилями слоя и изменить стиль Drop Shadow/Тень, увеличив параметры distance/дистанция, size/размер, opacity/непрозрачность и пр.
Нажмите Shift-Control-Alt-E чтобы создать слой-копию всех видимых слоев. В меню выберите Filter > Other > High Pass/Фильтр>Другое>Цветовой контраст.
Укажите слою режим наложения Soft Light/Мягкий свет.
Результат
Автор урока psddude
Перевод — Дежурка
Смотрите также:
- Текстовый гранж-эффект в Adobe Photoshop
- Вышитый гладью текст в Adobe Photoshop
- Текстовый эффект в стиле Спайдермена в Adobe Photoshop
Почему мы поменяли «Фотошоп» на «Фигму»: плюсы и минусы
Раньше все дизайнеры Email Soldiers использовали «Фотошоп» как основной рабочий инструмент. Много лет он казался удобной программой, но мы просто не знали ничего лучше. : )
В прошлом году я посмотрела мастер-класс арт-директора Red Collar и обратила внимание на программу, в которой она работала. Я не единственная ей заинтересовалась: в чате было много вопросов, что это за зверь такой. Оказалось, это «Фигма». Я её изучила и поняла, что это то, что нам нужно.
Предложила новый инструмент команде: большинством голосов мы решили, что надо попробовать. И назначили «Фигме» испытательный срок.
Как мы переносили проекты в «Фигму»
С того момента мы заводили все новые проекты в «Фигме» и параллельно разбирались с интерфейсом. Это было легко, так как он простой и интуитивно понятный.
Макеты, начатые в «Фотошопе», переносили с помощью сервиса Avocode. Для этого приходилось сначала переводить их в формат «Скетча», а уже потом импортировать в «Фигму». Перенести макет сразу из «Фотошопа» в «Фигму», к сожалению, невозможно.
Иногда слетали изображения и ориентация шрифта, но это легко поправить. Так за неделю мы перетащили 50 проектов. Если бы нам пришлось собирать макеты с нуля, это точно бы заняло в десятки раз больше времени.
Мы быстро поняли, что «Фигма» значительно удобнее. Она решила часть проблем, связанных с особенностями «Фотошопа». Некоторые из них я раньше даже не осознавала — просто не знала, что процесс можно настроить по-другому.
Чем «Фигма» удобнее «Фотошопа»
Исходники хранятся в облаке
Основная проблема «Фотошопа» в том, что исходники много весят. Хранить их на компьютере проблематично: приходится покупать SSD-диск, перекидывать макеты в облачное хранилище или просто удалять их.
Мы заливали исходники на корпоративный Google Диск, но и там были свои проблемы. Загрузка файлов занимала много времени. Мы раскладывали всё по отдельным папкам, ставили даты, но менеджерам всё равно было сложно находить нужные макеты. Плюс этим диском пользуется всё агентство: порой кто-то заливал файл с таким же именем или создавал дублирующуюся папку. Просто папочный ад.
В «Фигме» все макеты хранятся в облаке и вообще не занимают место на компьютере. Создаешь папку проекта и все материалы сохраняются туда, в том числе последняя версия макета.
Все изменения сохраняются автоматически
Файл в «Фотошопе» нужно постоянно сохранять. Иначе, если что-то случится, — привет, макет с нуля! При этом он хранит только определённое количество итераций в макете, так что отменить кучу последних действий и «откатиться» далеко назад не выйдет.
В «Фигме» макет сохраняется автоматически, и вы можете возвращаться назад бесконечно. Можно даже открыть историю, выбрать конкретный день и сделать дубликат этой версии.
Над макетом могут работать несколько человек одновременно
В «Фотошопе», чтобы два дизайнера работали над одним макетом (например, в случае жёсткого дедлайна), приходилось скидывать исходник, вносить изменения, вновь скидывать исходник, а потом соединять две версии в одну.
В «Фигме» над проектом может работать хоть вся команда. Каждый будет отвечать за свою область, а результат видно в режиме реального времени. Это экономит кучу времени, я не представляю, как мы жили без этого раньше.
Работает в браузере, доступна на Windows и Mac OS
Уникальная особенность «Фигмы» в том, что она работает в браузере, причём со всем функционалом. Правда, я всё равно пользуюсь десктопной версией, потому что у меня обычно и так сто вкладок открыто.
А ещё «Фигма», в отличие от того же «Скетча», доступна и на Windows, и на Mac OS. Мы в команде пользуемся обеими системами, поэтому для нас это важное условие.
Читайте также
HTML вёрстка писем — полная инструкция
Удобно передавать макеты на вёрстку
В «Фигме» проще передавать макеты на вёрстку: не нужно ничего никуда заливать или сохранять. Достаточно дать доступ для просмотра, и верстальщик увидит вкладку с режимом «Код». Чтобы экспортировать элемент макета, достаточно одного клика, в «Фотошопе» это занимало гораздо больше времени.
Александр Гурков, верстальщик Email Soldiers:
Главный плюс «Фигмы» в том, что всё хранится в облаке и нам не нужно ничего скачивать. Макеты «нарезаются» раза в два быстрее, чем через «Фотошоп». Удобнее вычислять отступы между элементами (размер показывается при наведении). Легко вытащить градиент или тень в виде CSS — я сразу вижу их в виде кода на боковой панели.
Прототипирование
В «Фигме» можно настроить ссылки и переходы между страницами. Открываете макет в режиме презентации и — вуаля! — всё кликабельно и наглядно. Это безумно полезный инструмент: с ним вы сразу понимаете, как пользователь будет взаимодействовать с интерфейсом.
Иван Дудин, руководитель IT-направления Email Soldiers:
До «Фигмы» я всё рисовал в Фотошопе, в том числе прототипы.
Услышал от дизайнеров про новый инструмент, попробовал. И сразу начали получаться крутые вещи. Скорость прототипирования выросла многократно, и продолжает расти до сих пор.
Сначала мне не хватало динамики в прототипах: всякие попапы и выпадающие меню приходилось делать через костыли. Я уже начал искать другой сервис, как вдруг в «Фигме» появился Overlay. И вот она снова закрывает 100% моих потребностей.
Сейчас многие пробуют или переходят на «Фигму» (Intercom, Uber, Twitter…). Не удивлюсь даже, если команды Facebook сменят Framer на «Фигму».
Фигма синхронизируется с Google шрифтами
Мы больше не мучаемся с проблемой, когда не установленные в системе шрифты заменяются на дефолтные.
Правда, в «Фигме» есть свой косяк: шрифты, которых нет на Google Fonts, не отображаются. Но они сами решили эту проблему с помощью утилиты Figma Font Helper. С ней можно ставить любые нестандартные шрифты и всё будет работать корректно.
Горячие клавиши показываются в интерфейсе
Ребята добавили подсказки с горячими клавишами прямо в интерфейс — они собраны в одном месте и удобно разбиты по категориям. Синим подсвечиваются комбинации, которыми вы пользуетесь.
Мокапы устройств
Недавняя потрясающая фича «Фигмы» — теперь там есть мокапы разных устройств. Вы можете посмотреть как ваш макет будет смотреться на айфоне, планшете, Apple Watch и т. д. Можно выбрать мокап, цвет устройства и фон.
Режим комментирования
Еще одна уникальная функция «Фигмы» — комментарии в макете. Полезно, когда надо дать фидбек — я беру макет на ревью и оставляю пометки сразу на блоках.
Там же можно вести диалог с участниками проекта. Это удобно, потому что дизайнерам не надо переключаться между экранами и пользоваться другими мессенджерами, чтобы обсудить макет.
Иногда я оставляю комментарии сама себе, чтобы не забыть, что хотела сделать.
Читайте также
Дизайн email-рассылок: полная инструкция
Автоматический подсчёт отступов и расстояний между объектами
Функция Smart Selection позволяет автоматически настраивать отступы, менять расстояния между несколькими объектами и их расположение. Это тоже экономит кучу времени, чем если бы вы считали отступы вручную.
Стили
В «Фигме» можно создавать стили цвета, текста и даже тени для каждого проекта индивидуально. Причём стили текста можно применять отдельно от стиля цвета.
Если вы измените стиль, он обновится на всех элементах. И все, кто пользуются этим стилем, смогут обновить его в своих макетах. Это избавляет от необходимости кликать на каждый элемент отдельно и вручную менять цвет, шрифт или тени.
Это преимущества, которые мы ощутили сразу после перехода. На деле в «Фигме» много-много фич, рассказать обо всех в одной статье просто невозможно.
Подводные камни (точнее, один большой дорогой камень)
Сначала мы раздавали доступ на редактирование макета всем, кто работал над проектом — менеджерам, копирайтерам, верстальщикам. Удобно же, когда они могут сами исправить опечатку или обновить текст в письме.
В конце месяца пришёл счёт: мы должны были 350 долларов вместо запланированных 50. В 7 раз больше! Потому что планировали дать доступ 8 людям, а на деле их вышло аж 22 🙂
Теперь режим редактирования доступен только дизайнерам, остальным — исключительно просмотр. Верстальщикам этого достаточно, потому что код макета прописан в отдельной вкладке.
Что в итоге
Сейчас мы делаем в «Фигме» 90% работы, что значительно ускорило процесс. Правда, и «Фотошоп» не ушёл полностью: ретачить фотографии всё равно приходится в нём.
Во внутренней Вики мы собираем статьи и видео о возможностях программы — это полезно новичкам, которые будут с нуля осваивать программу. Мы продолжаем делиться разными фишками друг с другом: мы получаем эстетическое удовольствие от работы в «Фигме» и о каждой находке хочется рассказать.
Если вы ещё не пользуетесь «Фигмой», я советую попробовать. Ребята развивают свой продукт с огромной скоростью и продумывают каждую деталь интерфейса. Думаю, в скором времени она вытеснит всех своих конкурентов. «Фигма» — ван лав.
Поделиться:
20 руководств по созданию логотипов и заголовков
Использование простого текста в качестве визуальных элементов в вашем дизайне скучно. Но с очень небольшими усилиями и с помощью Adobe Photoshop вы можете применить эффекты к этим текстам, чтобы получить очень удивительный и замечательный вид. В этом посте я собираюсь перечислить 20 очень простых, но очень полезных уроков по созданию текстовых эффектов в Photoshop. Методы, используемые для создания этих текстовых эффектов Photoshop, полезны не только для изучения того, как создавать специальные эффекты для всех видов объектов, но и для того, чтобы дать вам базовые представления о многих фильтрах и командах Photoshop.
Учебники по текстовым эффектам Photoshop, включенные в этот обзор, научат вас воссоздавать логотип или название популярного фильма, добавлять световые эффекты к текстам, 3D-эффекты, текстурировать типы и многое другое. Не стесняйтесь вносить в них свой собственный поворот и пробовать другие способы их воссоздания. Чтобы просмотреть интересующее вас руководство по работе с текстом Photoshop, нажмите на изображение для предварительного просмотра.
Вы можете использовать эти текстовые эффекты Photoshop для создания заголовков для ваших плакатов или листовок. Они также будут отлично смотреться в качестве заголовков для обложек книг или журналов. Я уверен, что у вас есть сотни других творческих идей о том, что можно сделать из этих уроков по текстовым эффектам Photoshop.
01. Как создать 3D-эффект колотого окрашенного дерева
Этот туториал покажет вам, как использовать некоторые текстуры и пару различных 3D-материалов и настроек освещения, а также корректирующие слои для создания реалистичного эффекта сколотого, окрашенного дерева.
ССЫЛКА НА ИСТОЧНИК
02. Эффект, вдохновленный «Очень странными делами» в Adobe Photoshop
Этот очень краткий урок покажет вам простой способ создания текстового эффекта, вдохновленного сериалом «Очень странные дела», используя только стили слоя и некоторые простые настройки.
ССЫЛКА НА ИСТОЧНИК
03. Эффект многослойной цветочной типографики в Adobe Photoshop
Цветочная типографика — это дизайнерская тенденция, сочетающая приятные цветочные элементы со смелой типографикой для создания элегантных дизайнов.
ССЫЛКА НА ИСТОЧНИК
04. Футуристический эффект металла в Adobe Photoshop
В этом кратком совете вы узнаете, как создать простой текстовый эффект стиля слоя с футуристическим ощущением. Чтобы добиться этого вида, вы собираетесь использовать текстуру, узор и пару стилей слоя, чтобы создать яркий текстовый эффект в футуристическом стиле.
ССЫЛКА НА ИСТОЧНИК
05. Создание каркасного текста
С помощью Photoshop довольно легко создать эффект каркасного текста. В этом уроке вы узнаете, как создать этот текстовый эффект. Легко следовать даже новичкам.
ССЫЛКА НА ИСТОЧНИК
06. Роскошный текст в Adobe Photoshop
Здесь вы узнаете, как создать этот великолепный текстовый эффект в Adobe Photoshop.
Этот элегантный и роскошный вид достигается путем создания тонкого темного фона и добавления текстового слоя и других эффектов.ССЫЛКА НА ИСТОЧНИК
07. Мультипликационный эффект в Adobe Photoshop
Из этого туториала вы узнаете, как создать простой эффект мультяшного текста с помощью шаблона и стиля слоя.
ССЫЛКА НА ИСТОЧНИК
08. 3D, светящийся, ретро-эффект в Adobe Photoshop
Узнайте, как использовать смарт-объекты и стили слоя для создания трехмерного ретро-светящегося текстового эффекта в этом кратком руководстве по созданию текстовых эффектов Photoshop.
ССЫЛКА НА ИСТОЧНИК
09. Текстовый эффект Photoshop 3D Antique Metal
В этом руководстве показано, как использовать 3D-инструменты Photoshop с несколькими текстурами и фильтрами для создания собственного 3D-эффекта старинного металлического текста и добавления его к красивому фоновому изображению.
ССЫЛКА НА ИСТОЧНИК
10.
Однослойный эффект ретро в Adobe PhotoshopВ последнем обновлении Photoshop появилось несколько довольно замечательных новых функций стиля слоя, таких как несколько экземпляров стиля слоя и наложение обводки. В этом руководстве показано, как использовать эти функции для создания однослойного эффекта ретро-текста.
ССЫЛКА НА ИСТОЧНИК
11. Блестящий летний текстовый эффект Photoshop
В этом коротком уроке вы узнаете, как создать текстовый эффект блестящего лета в Photoshop, используя стили слоя в Adobe Photoshop.
ССЫЛКА НА ИСТОЧНИК
12. Стилизованная типография тюков сена в Photoshop
Для вашего дизайна на осеннюю тематику вот учебник по созданию текста из сена. Вы должны знать, как использовать 3D-функции Photoshop для создания этого текстового эффекта Photoshop.
ССЫЛКА НА ИСТОЧНИК
13. Текстовый эффект Photoshop с неоновой уличной вывеской
Создайте сюрреалистический эффект неоновых уличных вывесок с помощью Photoshop и Illustrator.
Вам нужно установить идеальный шрифт и фон, чтобы получить этот удивительный эффект.ССЫЛКА НА ИСТОЧНИК
14. Написание в песочном стиле с помощью Photoshop
Хотите придумать фон для летнего пляжа своими надписями на песке? В этом уроке вы научитесь редактировать и писать на песке. Выберите свой собственный песчаный фон, если хотите, или сообщение и другие акценты!
ССЫЛКА НА ИСТОЧНИК
15. Мягкий карбоновый текстовый эффект Photoshop
Вот современный и футуристический эффект мягкого карбонового текста в Photoshop. Текстовый эффект Photoshop преобразует любой текстовый слой, применяя набор эффектов слоя, чтобы создать современный и мягкий эффект высокой печати с великолепным наложением узора.
ССЫЛКА НА ИСТОЧНИК
16. Эффект бетонного камня
Редактируя этот файл Photoshop, вы сможете с помощью интеллектуальных слоев преобразовать любой дизайн в эффект гравированного камня и бетона.
ССЫЛКА НА ИСТОЧНИК
17. Ретро-текст в стиле «Звездных войн»
В этом уроке показано, как использовать пару стилей слоя с красивой космической текстурой и бликом на кончике кисти, чтобы создать текстовый эффект в стиле «Звездных войн».
ССЫЛКА НА ИСТОЧНИК
18. Эффектная трава Photoshop Типография
В этом уроке показано, как создать впечатляющий текстовый эффект травы в Photoshop.
ССЫЛКА НА ИСТОЧНИК
19. Текстовый эффект сверкающих бриллиантов в Adobe Photoshop
Некоторые шрифты могут значительно упростить создание определенных текстовых эффектов. Этот урок покажет вам, как использовать точечный шрифт с парой стилей слоя, чтобы добиться простого эффекта сверкающего ромба.
ССЫЛКА НА ИСТОЧНИК
20. Текстовый эффект в стиле Lego в Adobe Photoshop
В этом уроке вы узнаете, как создать реалистичный 3D-текстовый эффект без использования какого-либо 3D-программного обеспечения.
В этом уроке используется Adobe Photoshop, но вы сможете сделать это в своем любимом 3D-программном обеспечении.ССЫЛКА НА ИСТОЧНИК
Связанные бесплатные ресурсы по дизайну
Как создать стиль текстурированного 3D-текста с помощью Photoshop CS3
В этом уроке вы научитесь работать и создавать собственные крутые стили с нуля, используя Photoshop и несколько текстур. Я проверил множество руководств в Интернете и оглядываюсь назад, и в них отсутствует одна важная вещь: , почему применяются эти эффекты и как художник решил применить эти конкретные эффекты.
Сложность: Средняя
Время выполнения: 1-2 часа
Инструменты: Photoshop CS3 или новее
РЕКЛАМА:
Лучшие предложения для цифровых дизайнерских активов — InkyDeals.com. Узнать больше>>
Ресурсы:
— шрифт Starcraft
— текстура от FantasyStock
— текстура в стиле гранж
Давайте не будем тратить больше времени и слов и перейдем сразу к делу. Во-первых, давайте установим несколько рекомендаций по созданию графических стилей и эффектов.
Ярлыки вводят в заблуждение
Когда вы открываете панель «Параметры наложения», вы видите такие эффекты, как «Тень», «Внутреннее свечение», «Внешнее свечение». Но не позволяйте этим ярлыкам обмануть вас, их потенциал больше, чем кажется на первый взгляд. Вы также можете использовать Drop Shadow, чтобы добавить свечение или создать 3D-эффект для плоской формы. И это лишь малая часть того, что могут сделать эти эффекты. Читайте дальше и вы тоже узнаете, как можно выжать из них все!
«Внешность обманчива, снимите эту завесу и откройте истинный потенциал».
Эффекты 100% настраиваемые
Вы можете полностью настроить любые значения, кривые, тона, режимы наложения, цвета, интенсивность, насыщенность, непрозрачность и резкость для каждого эффекта, ничто не является случайным. Единственное, что вам нужно, это терпение и внимание к деталям.
«У тебя есть сила изменить все. У вас есть инструменты, остальное зависит от вас».
Эффекты по умолчанию ужасны
Photoshop предоставит некоторые базовые настройки, достаточные для того, чтобы вы поняли, как работает каждый эффект. Но НЕ принимайте их как должное! Просто найдя правильный рецепт для каждой настройки, вы поставите себя выше среднего дизайнера и сделаете свою работу выдающейся. Каждый раз, когда вы открываете эффекты, старайтесь найти способы улучшить свой дизайн.
«Рисуй лучше, чем вчера, и хуже, чем завтра».
Помните об этих трех вещах, и двигаться дальше с этим будет фантастическим путешествием, чтобы улучшить свои навыки Photoshop. Поверьте мне, это работает как шарм, я сделал это сам.
Вот что мы будем создавать:
Выглядит очень сложно, не так ли? Как я уже говорил ранее, не вводите в заблуждение. Каждому шагу есть логическое объяснение, и вы всему научитесь.
Начните с простого
Нет смысла начинать с прямых деталей. Сначала установите основные формы. Если это выглядит хорошо без эффектов, у вас будет прочная основа для создания эффектов. Как и в архитектуре, вам нужен прочный фундамент, иначе вся ваша конструкция рухнет.
Создайте документ 2000 x 2000 px в цветовом режиме RGB с разрешением 72 dpi. Нам нужен документ большого размера, чтобы мы могли создавать мелкие детали.
Для этого дизайна мы создадим эффект Starcraft. Скачать и установить шрифт можно по ссылке в разделе «Ресурсы».
[password=»accessnow»]
Совет
Выберите серый оттенок среднего тона с базовым эффектом Bevel & Emboss.
Как видите, настройки по умолчанию не годятся. Нам нужно что-то более сильное, с большим влиянием. Увеличьте параметр «Размер». Заметили, как края постепенно становятся более заметными? На данный момент настройка где-то около 44 пикселей будет вполне подходящей.
Нам не нужен этот мягкий округлый эффект для нашего дизайна, нам нужно что-то агрессивное, с острыми углами и прямыми линиями. Этот эффект управляется настройкой «Техника». Переключите его с «Гладкого» на «Твердое долото».
Выглядит лучше, но не совсем так. На данный момент он слишком размыт, а края недостаточно четкие. Эти атрибуты управляются настройками «Глубина» и «Высота». Вы можете играть с ними, пока они не станут более «металлическими».
Теперь у нас есть основная форма для работы!
Далее нам нужна текстура для применения к нему. Вы можете получить его из собственной галереи, купить или загрузить бесплатно с DeviantART. Я использовал один из FantasyStock (ссылка в разделе «Ресурсы»).
Откройте его в Photoshop, затем нажмите CTRL+U, чтобы обесцветить его. Когда вы используете текстуры, вам не обязательно нужны исходные цвета, только тона и формы. После того, как вы обесцветите его, нажмите CTRL + L, чтобы вызвать меню «Уровни» и увеличить контрастность до максимума, практически без средних тонов.
Некоторые значения, близкие к приведенным ниже, вполне подойдут.
После корректировки уровней выберите весь холст (CTRL+A) и перейдите в меню «Правка» > «Определить узор». Назовите этот узор «Rust» и нажмите «ОК». Я знаю, что сейчас это выглядит неловко, но потерпите меня в этом. Позже это будет прекрасно смотреться.
Теперь пришло время применить этот шаблон к нашему дизайну. Снова откройте параметры смешивания и проверьте настройку наложения узора. Нажмите на нее и выберите только что созданный узор.
Теперь вы думаете: «Боже, это выглядит ужасно». Да, но формы из текстуры хороши. Теперь нам нужно настроить их интенсивность, цвет и контраст — но по одному. Как мы решаем, спросите вы?
На самом деле ответ довольно прост. Я хочу, чтобы текстура только показывала некоторые вмятины и не мешала другим эффектам. Если вы еще не уверены, просто просмотрите его режимы наложения и непрозрачность и посмотрите, что выглядит лучше.
Точного рецепта для этого нет, это как алхимия. Просто смешайте вещи, бросьте их на стену и посмотрите, что прилипнет. В моем случае я выбрал Pin Light с непрозрачностью 20%. Нажмите OK, чтобы сохранить настройки.
Теперь мы к чему-то пришли!
Мы не можем сделать его просто черно-белым, давайте добавим к нему немного цвета. Снова откройте панель параметров наложения. Как вы уже догадались, нам нужна настройка «Наложение цвета». Установите этот флажок и щелкните его метку. Вместо этих серых, скучных цветов давайте добавим ярко-синий!
Теперь текстура не совсем видна, так что корректировка непрозрачности вполне подойдет.
Теперь, когда у нас есть базовый цвет, нам также нужны тона для теней и бликов, а стандартный Bevel & Emboss просто не подойдет.
Совет : Если вы хотите создать тени и блики для основного цвета, никогда не используйте черно-белый цвет! Всегда используйте более светлый/темный тон исходного цвета.
Откройте настройку Bevel & Emboss и измените цвет «Highlights» на ярко-голубой. Он не обязательно должен быть такого же оттенка, просто с голубым оттенком. Я выбрал голубой, потому что он выглядит насыщенным и делает текст более глянцевым.
Та же техника применима и для теней. Итак, давайте выберем темно-синий и посмотрим, что произойдет.
Давайте посмотрим поближе. Теперь текстура выглядит действительно плоской, а вмятины не слишком выделяются. В этом случае нам понадобится новый Bevel & Emboss и новый Pattern Overlay, чтобы быть поверх настройки Color Overlay, чтобы он стал видимым независимо от настройки Color Overlay.
Чтобы иметь возможность накладывать один и тот же эффект несколько раз, нам нужна установка, позволяющая полностью видеть эффекты, но полностью скрыть цвет текста. Эта функция управляется настройками «Заливка». Это позволяет вам установить прозрачность базовой формы, но эффекты по-прежнему имеют 100% непрозрачность.
Выберите «Слой» > «Дублировать слой» (CTRL+J) и щелкните и перетащите «Эффекты» над корзиной в палитре «Слои». Установите Заливку слоя на 0%.
Давайте поместим настройку «Наложение узора» на другой слой. Это означает, что нам потребуются новые настройки для него, и что Color Overlay из исходного слоя может оставаться со 100% непрозрачностью.
Давайте немного увеличим контраст и сделаем текстуру лучше. Нам понадобятся новые настройки Bevel and Emboss, но теперь мы также добавим к ним текстуру.
Откройте окно «Свойства наложения» и проверьте «Скос и тиснение» и «Текстура» , это тот, что справа под ним. Выберите вкладку «Текстура» и установите текстуру на ту, которую мы создали (по умолчанию это массив синих пузырьков) и «Глубина» на 2% — этого достаточно, чтобы текстура немного выделялась.
Настройка по умолчанию для Bevel & Emboss не подойдет, давайте добавим немного цвета этим теням и бликам! Выберите вкладку, установите «Техника» на «Долото твердо» и увеличьте глубину до 115%, чтобы увеличить резкость.
Опять же, избегайте использования Global Light, снимите этот флажок. Установите угол примерно на 60 градусов и «Высоту» на 56 градусов. Напоминаем: высота определяет резкость рельефных краев, поэтому увеличение этого значения удалит эти раздражающие размытые области.
Теперь у нас есть база для работы, поэтому давайте начнем добавлять некоторые детали. Окружающее освещение было бы отличным началом, вы так не думаете? Для этого нам понадобится градиент, который создаст тень на нижней стороне шрифта, но при этом сохранит то, что мы создали до сих пор.
Таким образом, «Наложение градиента» на «Умножение» будет идеальным. Начнем с этой идеи.
Проверьте настройку «Наложение градиента» и установите для нее значение «Умножение». Пока это выглядит так, как показано на изображении ниже (неотшлифованном) — контрастность слишком велика, а тени слишком темные. Но, как и другие параметры, он настраивается.
Нажмите на градиент, и давайте начнем создавать идеальный!
Любой объект в космосе будет иметь тень, если рядом с ним есть источник света, верно? Что ж, давайте воспользуемся этим и выделим текст с помощью Drop Shadow. Но подумайте об этом немного: эта тень не должна влиять ни на что из того, что мы сделали до сих пор, поэтому она нужна нам на самом нижнем слое: оригинале.
Мы можем продвинуть его еще дальше и сделать его еще более заметным. До сих пор мы только добавляли тени окружающей среды, но не блики. Итак, давайте добавим один из них тоже.
Чтобы добавить блик, нам понадобится гладкий цвет, который сохранит добавленные цвета и создаст более светлые тона по всему тексту. Что ж, это точное описание градиента в режиме наложения, установленном для увеличения яркости изображения.
Поскольку у нас уже есть «Наложение градиента» на самом верхнем слое, нам понадобится еще один, чтобы применить к нему эффект. Поэтому продублируйте самый верхний слой и удалите его эффекты.
Начните с нового «Наложения градиента», установленного на «Осветление цвета».
Нажмите на градиент и давайте создадим правильный.
Далее нам нужен какой-то контур, что-то, чтобы отделить текст от его тени и определить его форму. Мой голос за настройку Stroke, как вы догадались?
Но давайте не будем так оставлять, нам нужно, чтобы он немного выделялся и, как я уже говорил ранее, выделяющийся объект будет иметь тень. Inner Shadow выглядит многообещающе, вам так не кажется?
Текст металлический, верно? Что ж, давайте посмотрим на него в отраженном свете! Сверху уже слишком много света, давайте сделаем что-нибудь для нижней области. Так как нам нужен свет снизу, мы могли бы использовать Внутреннюю тень, но взята та, что из нашего текущего слоя.