Изогнутый текст в фотошопе: Разные способы изогнуть текст в Photoshop

Содержание

Разные способы изогнуть текст в Photoshop

Тема урока: Как изогнуть текст в Фотошоп. Рассмотрим два самых актуальных варианта. Они работают и с горизонтальным, и с вертикальным инструментом группы «Текст».

Содержание:

Простой способ изменения формы текста

Как создать контур инструментом Перо

Как создать контур инструментом Произвольная фигура

Как изогнуть текст по контуру

Исправление ошибок

Как изогнуть текст функцией «Деформированный текст»

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

Функция доступна при активных:

  • инструменте «Текст» на панели инструментов;
  • текстовом слое на палитре слоев.

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

рис. 1

После этого в верхней панели инструментов станет активной такая кнопка . Это и есть функция деформирования текста. Жмем на нее.

Внимание! Фотошоп не может изогнуть текст, к которому применен стиль – жирный, курсив и т.п. система попросит снять этот стиль.

рис. 2

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

Если предыдущий пункт выполнен правильно, откроется такое окно:

рис. 3

Выберите подходящий эффект – просто щелкните по выбранной опции. Для своего примера мы выбрали «Подъем». Если вы раньше не пользовались этой функцией, параметры настроек будут нулевыми. Если пользовались – будут последние сохраненные значения, и они сразу применятся к слою для просмотра.

рис. 4

Начинаем выставлять свои настройки. У нас текст горизонтальный, поэтому и ставим отметку «Горизонтальный». Дальше экспериментируем с ползунками. Двигаем их и наблюдаем за изменением текста. Значения в окошках будут соответственно меняться.

Изменить параметры можно вписав в эти окошки величину изменения в процентах и нажать Enter. Например, 50 (плюс можно не ставить), чтобы ползунок передвинулся на 50% вправо, или минус 50 (-50), чтобы передвинуть ползунок влево на 50%.

  1. Первый ползунок отвечает за глубину неровности линии. Именно с его помощью можно изогнуть текст (рис. 4).
  2. Искажение по горизонтали и вертикали – это уже деформация надписи относительно плоскости.

рис. 5

Выставив настройки, нажмите «Ок».

Как написать текст по контуру в Photoshop

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

Контур создается векторными инструментами: «Перо», или из группы «Прямоугольник».

рис. 6

Создаем контур инструментом Перо

Этот вариант позволяет создать любую линию изгиба – произвольно или по готовому изображению.

Допустим, что у нас есть картинка, по контуру которой нужно сделать надпись.

  1. Активируем инструмент «Перо» в панели инструментов или горячей клавишей Р (русская з). Вверху установите режим инструмента «Контур». Щелчком мыши ставим первую опорную точку на рисунке.

    рис. 7

  2. Визуально определяем первую дугу линии и ставим вторую опорную точку (рис. 8). Образуется прямой отрезок (АВ). На нем примерно посередине ставим еще одну точку (С). Мышку отпускаем.
  3. С зажатой клавишей Ctrl для Windows (⌘ для Mac OS) снова мышкой зажимаем узловую точку и подтягиваем ее к краю рисунка, чтобы образовалась нужная кривая. Не страшно, если линия не легла по нужной линии. Ставьте на ней дополнительные узловые точки и подтягивайте так, как требуется.

рис. 8

Внимание! Если нужно удалить последнюю опорную точку – нажмите Delete. 

4. По такому принципу создаем контур всей линии: ставим опорную точку в п. D, образуя следующую прямую, в ее центре ставим узловую точку, потягиваем ее к контуру кривой. И так до конца линии.

рис. 9

Нажимаем Enter. Не пугайтесь, если контур станет невидимым. Он остается в палитре «Контуры» и существует независимо от слоя. Нажмите на него, чтобы сделать активным.

рис. 10

Контур создан. Как по нему написать текст читайте ниже.

Как создать контур инструментом Произвольная фигура

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

рис. 11

Вверху редактора открываем палитру фигур и выбираем подходящую. Выбрать категорию фигур можно в настройках палитры. У нас выбраны все.

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

Важно! Если режимом инструмента выбрана Фигура, то вы получите векторное изображение, залитое цветом. В палитре Слои появится новый слой, а в палитре Контуры – новый контур.

рис. 12

Если установлен режим Контур, то и получится внешнее очертание без заливки цветом. При этом новый слой создается в палитре Контуры, а в Слои – нет.

рис. 13

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

Пишем текст по созданному контуру

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

  1. Если форму вы создавали в режиме Фигура, в палитре слоев сделайте этот слой активным. Если работали в режиме Контур – активируйте его в палитре Контуры, и будет видна только линия, по которой изогнется надпись.

рис. 14

2. Берем инструмент Текст. Писать по волне начнем слева, поэтому ставим выравнивание по левому краю. По листочку надпись распределим от центра, поэтому выравнивание ставим по центру.

3. Подводим курсор к созданному контуру достаточно близко, чтобы он изменил свой вид на такой .

4. Щелкаем мышкой в том месте, откуда будет распределяться текст. У нас это: в случае с волной – слева, а на листочке ‒ в предполагаемом центре надписи.

рис. 15

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

Меняем положение изогнутого текста и исправляем ошибки

Поменять положение помогут инструменты группы Стрелка. Изначально курсор этого инструмента имеет вид стрелочки. Для перемещения текста лучше из них выбрать «Выделение контура». Сразу он выглядит так: . Рядом с контурной линией он меняет вид на такой  или такой . Направление треугольничка указывает, в какую сторону можно перемещать написанное. Зажмите курсор мышкой  и двигайте вдоль контурной линии.

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

рис. 16

Исправляем ошибки

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

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

рис. 17

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

  1. Выделяем текст. Открываем палитру «Символ»: идем в меню Окно, выбираем Символ.
  2. Выделяем текст.
  3. Откройте список значений трекинга символов и выберите подходящее. Можно просто вписать цифру в окошко, нажать Enter.
  4. Согласитесь с изменениями, нажав на галочку в верхней панели.
  5. Если эти действия не помогли – поставьте дополнительные пробелы между буквами в тех местах, где их нужно рассоединить.

Итог

Детально предусмотреть все моменты в одном уроке невозможно. Если остались вопросы – задавайте в комментариях.

Изогнуть текст в Фотошоп можно и деформацией слоя. Но мы категорически не советуем это делать. Слой придется растрировать, а результат получается не лучшего качества:

Как написать текст по кругу, кривой и контуру

Продолжаем создавать текст. Наводим текстовый курсор на линию контура и кликаем по ней. На контуре появляется мигающий курсор в виде перпендикулярного отрезка.

pishem-tekst

Теперь печатаем текст. Желательно вводить текст с таким расчётом, чтобы его длина не превышала длину линии, т.е. надо сразу подбирать размер шрифта в пикселах что-бы весь текст уместился в нужном месте. В противном случае придётся корректировать размер текста, а это лучше сделать несколько позже. Теперь надо обратить внимание на указатели в начале и в конце текста, на рисунке вниу они обведены красными кружками.

ограничители текста на контуре

Эти указатели можно перемещать, и, соответственно, переместится также и текст. Для перемещения ограничителей начала и конца текста надо выбрать инструмент «Выделение контура» (Path Selection Tool).

Инструмент выделение контура

При подводе курсора к тексту он снова изменит свой вид на такой:

курсор перемещения текста

Если мы наведём курсор на начальный ограничитель, зажмём левую клавишу мыши и переместим его вдоль линии, то текст переместится за ним. Появится расстояние между текстом и конечным ограничителем. Однако, если мы изменим режим выравнивания текста, например выберем «выравнивание к правому краю», то текст «прилипнет» к правому ограничителю. Это я показал на рисунке:

текст по курсорам

При желании мы можем перевернуть текст вверх ногами. Для этого надо подвести курсор к тексту, он примет следующую форму:

курсор перемещения текста

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

переворот текста

Не забываем, что для перемещения ограничителей и переворота текста должен быть активным не инструмент «Текст», а инструмент «Выделение контура» (Path Selection Tool)!!

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

Текст вокруг

Если мы захотим «опрокинуть» текст, то все буквы окажутся внутри овала, а начало и конец текста поменяются местами.

буквы внутри овала

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

Деформация текста в фотошоп: подробное описание функции

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

Стандартные опции

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

деформация текста в фотошоп

Кроме этого можно получить интересные эффекты в диалоговом окне под названием «Деформировать текст» (Create Warped Text), которое появляется на верхней панели над рабочей областью сразу после активации соответствующего пункта меню.

деформация текста в фотошоп

Это простейшие деформации, которые представлены набором характерных изменений из выпадающего списка Стиль (Style).

Эксперименты с изменением текста

Все эффекты имеют ось симметрии, относительно которой можно задать дополнительные характеристики.

deformacija_texta_v_fotoshop

Ползунков в диалоговом окне всего три. Изгиб (Bend) влияет на интенсивность искривления. Здесь же можно изменить силу искажения по горизонтали или вертикали (Horizontal Distortion, Vertical Distortion).

Для примера приведу деформацию текста волной.

деформация текста в фотошоп

Еще пример простой деформации текста по форме флага.

деформация текста в фотошоп

Это простейшие изменения, которые применяются для примитивной работы с текстом.

Деформация текста по контуру

Более универсально написание текста по произвольной кривой. Такая деформация актуальна, когда необходимо вписать текст в изгиб контура имеющейся картинки.

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

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

Делается это с помощью инструмента «Свободное перо» (Freeform Pen Tool), выбрать его можно на основной панели инструментов или с помощью горячей клавиши «P».

deformacija_texta_v_fotoshop

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

deformacija_texta_v_fotoshop

Когда контур будет задан, выберите инструмент «Текст», наведите курсор на созданный контур в том месте, где предполагается начало текста.

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

deformacija_texta_v_fotoshop

Для изменения контура, выберите инструмент «Выделение контура» (Path Selection Tool), нажмите на контур, на нем появятся маленькие черные квадратики, эти замки можно перемещать, деформируя контур и текст, который по нему написан.

deformacija_texta_v_fotoshop

Как наклонить текст в Фотошопе

как наклонить текст в фотошопе


Создание и редактирование текстов в Фотошопе – дело не сложное. Правда, есть одно «но»: необходимо иметь определенные знания и навыки. Все это Вы можете получить, изучая уроки по Фотошопу на нашем сайте. Этот же урок мы посвятим одному из видов обработки текста – наклонному начертанию. Кроме того, создадим изогнутый текст по рабочему контуру.

Наклонный текст

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

Способ 1: палитра Символ

Об этой палитре подробно рассказано в уроке по редактированию текста в Фотошопе. Она содержит различные тонкие настройки шрифтов.

Урок: Создаем и редактируем тексты в Фотошопе

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

Наклонный текст через палитру Символ в Фотошопе

Способ 2: Наклон

В данном способе используется функция свободного трансформирования под названием «Наклон».

1. Находясь на текстовом слое, нажимаем сочетание клавиш CTRL+T.

Свободное трансформирование в Фотошопе

2. Кликаем ПКМ в любом месте холста и выбираем пункт «Наклон».

Пункт меню Наклон в Фотошопе

3. Наклон текста производится при помощи верхнего или нижнего ряда маркеров.

Наклон текста в Фотошопе

Изогнутый текст

Для того чтобы сделать изогнутый текст, нам понадобится рабочий контур, созданный при помощи инструмента «Перо».

Урок: Инструмент Перо в Фотошопе — теория и практика

1. Рисуем Пером рабочий контур.

Рабочий контур в Фотошопе

2. Берем инструмент «Горизонтальный текст» и подводим курсор к контуру. Сигналом к тому, что можно писать текст, является изменение вида курсора. На нем должна появиться волнистая линия.

Изменение вида курсора в Фотошопе

3. Ставим курсор и пишем необходимый текст.

Изогнутый текст в Фотошопе

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

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

Изогнутый текст в Фотошопе Мы рады, что смогли помочь Вам в решении проблемы.
Изогнутый текст в Фотошопе Опишите, что у вас не получилось. Наши специалисты постараются ответить максимально быстро.
Помогла ли вам эта статья?
ДА НЕТ

Деформация текста в фотошопе

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

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

Итак, выберите инструмент Текст, напишите какую-нибудь надпись  и выберите на панели параметров Создать деформированный текст:

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

Параметр Изгиб/Степень влияет на силу искривления.

Искажение по горизонтали и вертикали дополнительно меняют вашу надпись в горизонтальной и вертикальной плоскости соответственно.

Пример искажения в форме Волны:

Или вот избитая тема из Звездных Войн:

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

Текст по Контуру

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

У меня пока нет урока по контурам (но я планирую это исправить), поэтому если испытываете сложность с таким инструментом, можно посмотреть на других сайтах, информации полно.

Итак, чтобы написать текст вдоль контура — выберите Перо и создайте произвольную кривую, которая будет будущей надписью.

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

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

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

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