Как сделать в фотошопе текст по контуру: Создание эффектов текста в Photoshop

Ввод текста по контуру объекта в Photoshop. Начальные точки ввода текста

Ввод текста по контуру объекта в Photoshop. Начальные точки ввода текста

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

Отличительными особенностями ввода текста по определённой (заданной) траектории от ввода обычного текста, является то, что мы привлекаем дополнительные инструменты воздействия на текст, а также его регулировка. И я не ошибся, сказав о регулировке вместо редактирования. И говоря об инструментах, мы подразумеваем именно инструменты. Такое действие как ввод текста по контуру, объединило два функционала — «Текст» и «Контуры». По этой самой причине они и находятся в одном разделе на панели инструментов. Давайте посмотрим на выше упомянутые дополнительные инструменты, без которых нам не обойтись:

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

Заход 1. На холсте создаём открытый контур (траекторию текста):

Затем, на панели инструментов переключаемся на режим текста:

Курсор превратился в квадратик с вертикальной чёрточкой по центру. При его наведении на контур, мы увидим, как курсор вновь изменит свою форму и будет похож на печатную английскую букву «I», перечёркнутую маленькой волнистой линией. Первое видоизменение курсора уведомило нас о том, что мы в режиме текста, ну а повторное его перевоплощение, сообщило уже об обнаружении контура. Расположим курсор на самом крайнем левом краю контура таким образом, чтобы по ощущению нам казалось, что курсор находится в той начальной точке, с которой мы начали рисовать контур. Замечательно. Сделаем щелчок и посмотрим на то, что произойдёт:

В начальной точке нашего контура (крайняя левая точка) появился квадратик с кружочком внутри. Включаем свою зрительную память «на полную катушку» и запоминаем то, что видим. Теперь попробуем начать вводить текст. Ничего не получается. Кружочек в квадратике на левом конце линии контура стал чёрным. И снова мы с помощью зрительной памяти зафиксируем то, что видим, ну и наши безуспешные действия по вводу текста конечно тоже запомним. Давайте назовём эту точку «Точка не активности сегментов регулирования» или как-нибудь по-другому, как нам нравится. А можем и вовсе никак не называть, — не в названии дело. Дело-то в том, что мы поместили курсор настолько близко к самому краю траектории, что сегментам регулирования не хватило места для того, чтобы разместиться на линии контура, так как их алгоритмы действия привязаны к начальной и конечной точкам кривой и параметрам в окошке настроек текста. Ну что же, наш первый заход на этом можно считать законченным. Очистим холст нажатием клавиши Esc, предварительно выйдя из режима текста, то есть щёлкнем по кнопке «Перо», или схватимся мышкой за слой текст «Слой 1» в окне (палитре) слоёв и, не отпуская левой кнопки мышки, перетащим его в корзинку:

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

И то, что мы видим, вновь фиксируем своей зрительной памятью:

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

И в открывшейся палитре цветов, сделаем выбор цвета на своё усмотрение:

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

а внутри кружочка (элемент сегмента регулирования) появился крестик. Избежать чувства растерянности в данной ситуации пока не удалось. Сделав мысленный акцент на словах «пока не удалось» остановимся и, щёлкнув по слою текста в палитре слоёв или по галочке на ленте верхнего меню подтвердим ввод и посмотрим на изменения:

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

Заход 3. С ощущением того, что мы с ещё большей уверенностью работаем выбранным нами пером, создадим на чистом холсте очередной новый открытый контур:

В этот раз, после переключения «контуры-текст», наведём курсор на траекторию и сделаем щелчок мышкой где-нибудь ближе к конечной точке контура:

и посмотрим, что же произойдёт в этот раз:

Мы видим уже знакомые нам сегменты регулирования. Здесь и крестик, и мигающий курсор, и кружочек с ромбиком. Давайте снова начнём вводить текст и будем делать это до тех пор, пока количество набранных на клавиатуре символов не превысит количества видимых на контуре:

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

Наши догадки подтвердились. В слоях (окно работы со слоями) текст в полном объёме, а на контуре снова лишь его часть, с разницей в местоположении, т.е. ближе к конечной точке контура. Будем считать третий наш заход завершённым и подготовимся к четвёртому заходу, очистив холст.

Заход 4. Первое наше действие в четвёртом заходе всё то же — создание траектории. На этот раз мы прицелимся в середину контура, где-то здесь:

Теперь щёлкнем мышкой в этой точке контура, активизируя ввод самого текста:

И вновь мы видим наших добрых знакомых: крестик на левом (начальном конце) контура, мигающий курсор, ромбик и кружочек. Ну что же, начнём вводить текст и пусть, снова, он будет из нескольких слов:

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

На этот раз мы видим полное соответствие видимого текста на контуре тексту в палитре слоёв.

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

Оставить комментарий

Текст в Фотошопе: практика и трюки

Разобравшись с стандартными возможностями инструмента Horisontal Type Tool в Фотошопе, перейдем к более продвинутым приемам работы. Как пустить надпись по кругу, как заполнить форму текстом, как создать абзац и выбить в нем место под фотографию? Для такой работы нам понадобится тесное содействие с векторными инструментами. Поэтому в дополнение к этой статье советую прочитать:

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

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

Как в Фотошопе пустить текст по кругу?

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

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

Теперь выбираем Horisontal Type Tool и подводим мышку к контуру. При наведении на контур курсор сменит иконку.  Теперь кликайте по контуру и пишите текст.

Написать текст мало. Его ещё нужно настроить. Как это сделать? Инструменты управления текстом, который пустили по векторному пути, интуитивно не очень понятные. Давайте разбираться.

Мы можем четко определить непонятные знаки, которые появились на контуре. Но сам инструмент Type Tool на них никак не реагирует. Инструмент Move Tool тоже не помощник. Он просто передвигает весь слой целиком.

Дело в том что мы работаем с векторным контуром. Поэтому нам нужны инструменты управления векторными контурами, а не чем то другим. Подойдут оба инструмента по работе с векторными якорями — Path Direction Tool и Direct Selection Tool.

Выберите любой из них и попробуйте подвигать надпись на контуре. Теперь мы видим что, что-то происходит. Но что именно?

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

Если выровнять текст по центру, появится третья точка. Выберите инструмент Type Tool и нажмите Centre Text на панели настроек. Теперь текст находится по центру. А боковые точки регулируют соотношения центра на оси. Это позволит разместить надпись 100% по центру оси, а не на глаз.

Передвигать рычажки можно как инструментом Path Direction Tool так и Direct Selection Tool. Однако это не все. Кликните мышкой по одному из якорей сдвиньте его внутрь окружности.

Допустим вы рисуете стикер и вам нужно 2 надписи. Одна по верху, другая по низу. Создаем 2 окружности, одна над другой. На каждой по своя надпись. Сверху и снизу. Именно таким способом я игрался со стикером для автубоса в своем блоге.

Точно так же текст пускается по неполной кривой. Выберите инструмент Pen Tool и нарисуйте неполную кривую. Нажмите ESC на клавиатуре чтобы оборвать контур. Теперь проделайте все тоже самое с инструментом Type Tool.

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

Теперь вы знаете как в Фотошопе пустить текст по кругу.

Как заполнить векторный контур текстом?

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

Я выбрал инструмент Custom Shape Tool. О нем я подробно рассказывал как в текстовом уроке для Custom Shape Tool как и в видео уроке. Из меню Custom Shape Tool я выбираю сердце. В настройках инструмента, конечно, режим Path. Просто наведите его на форму. Когда курсор изменится с обычного на «выпуглый», начинайте писать текст.

Текст внутри векторной формы подчиняется всем законам параграфа. Его можно выравнять по левой, правой стороне или по центру. Но самое интересное другое. Нарисуйте прямоугольник с режимом Add to path Area (+) Затем переключите режим на Subtract path from Area (-) и вырежте из прямоугольника небольшой кусок.

Теперь примените Horizontal Type Tool к внутненней части прямоугольника и у вас получится обтекаемый текст. В вырезанную часть можно вставить тумб. Величина обтекания легко контролируется при помощи дополнительного контура с режимом Subtract path from Area (-).

Необходимость подобного применения текста можно найти везде, как в веб дизайне так и в иллюстрации. Что говорить, даже главная страница моего блога drivealienn.ru устроена именно таким образом. Посты тумба и обтекание текстом. Макет такого блога в Фотошопе делается вышеописанным образом.

Идеальное выравнивание в меню

Как добиться идеального расположения надписи для кнопки меню? Конечно на глаз тоже очень прикольно, но неплохо бы задействовать более точные инструменты. Выберите инструмент Rounded Rectangle Tool. На этот раз режим инструмента Shape Layer вместо Path. Я хочу создать элемент графики, а не пустой контур.

Неплохо, осталось придумать дизайн. Добавим один из готовых стилей для веб графики, который идет с Фотошопом по умолчанию. Если вы не разбираетесь в стилях, прочитайте мою статью Как добавить стиль в Фотошопе. Ну а если нет на это времени вот быстрый экскурс. На панели настроек инструмента Custom Shape Tool выберите вкладку стилей. В ней выберете один из готовых стилей или кликните по маленькой круглой иконке и из появившегося меню выберите Web. Это загрузит готовую коллекцию стилей для веб. Я выбрал простой «стеклянный» веб стиль.

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

Но вернемся к тексту. Просто выберите инструмент Horizontal Type Text и кликните по внутренней части кнопки. Это действие фактически продублирует уже созданный контур кнопки для текста. Остается только выровнять текст по центру и настроить нужный размер. О настройках тексты я подробно писал в статье Работа с текстом в Фотошопе.

Кнопки созданы, текст написан. Но как выровнять их по центру? Дело в том что в Фотошопе нет вертикального выравнивания для текста. Нет его и в Иллюстраторе. Ни Фотошоп, ни Иллюстратор не являются программами верстки. Но не переживайте. Отсутствие вертикального выравнивания не конец жизни. Откройте панель Windows > Characters для работы с текстом. На этой панели измените параметр Set the Baseline Shift. Этот параметр сдвигает текст вверх или вниз относительно его основания. Просто сдвиньте текст вниз ближе к середине и все.

Контур и текст

Пожалуй теперь вы знаете все о работе текста вкупе с векторным контуром. Остались детали. При работе с текстом может случиться так, что векторный контур потерялся. Как его найти? Где реально проживает контур и куда он крепится. Панель слоев Layers никак не свидетельсвует о том, что текст с контурами как-то отличается от обычного текста. Слои выглядят совершенно одинакого.

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

Пожалуй теперь, вместе с уроком Инструмент Type Tool в Фотошопе, вы знаете 50% всего, что можно знать о работе с текстом. В следующих уроках я подробно разберу панель Characters и приемы работы с параграфами и панелью Paragraph.

Скачать фаил

Чтобы скачать фаил кликните по кнопке Like для Facebook. После этого появится ссылка на PSD фаил с стилекром, контурами и текстом, пущенным по кругу, обтекаемыми параграфами и прочим. Все можно посмотреть и покрутить.

Скачать фаил

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

Автор:

Как в фотошопе сделать шрифт по кругу

Как в фотошопе написать текст по кругу с помощью инструмента Контуры | DesigNonstop — О дизайне без остановки

Как в фотошопе написать текст по кругу с помощью инструмента Контуры

33

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

Шаг 1.В новом документе с помощью инструмента «Овальная область» (Elliptical Marquee Tool), удерживая Ctrl, выделяем круг.

Шаг 2.В верхнем меню выбираем «Окно» (Window) > «Контуры» (Paths) и открываем контейнер. Потом жмем на иконку в нижней части контейнера «Сделать из выделенной области рабочий контур» (Make Work Path From Selection).

Шаг 3.Получили рабочий контур. В принципе, этот результат сразу можно получить и с помощью инструмента «Элипс» (Ellipse Tool), предварительно нажав в верхнем меню иконку «Контуры» (Paths). Первые два шага пригодятся тогда, когда надо сделать надпись по контуру не круга, а более сложной фигуры.

Шаг 4.Теперь выбираем инструмент «Текст» (Type Tool), подводим курсор к контуру, и когда он стал таким, как на рисунке ниже, начинаем печатать текст.

Шаг 5.Получили такой результат. Здесь можно регулировать размер текста и межбуквенное расстояние.

Шаг 6.Нажимаем Ctrl+H, чтобы отключить линию контура. Эта же комбинация клавиш включает контур.

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

Шаг 8.В какой-то момент весь текст должен перескочить во внутреннюю часть контура.

Шаг 9.Нажимаем Ctrl+H, чтобы отключить контур. Мы получили текст, написанный по внутренней части контура.

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

После этого выбираем «Фильтр» (Filter) > «Искажение» (Distort) > «Полярные координаты» (Polar Coordinates) и далее отмечаем «Прямоугольные в полярные» (Rectangular to Polar), нажимаем ОК. На промежуточной стадии сервис предложит растрировать текст, нажимаем «Да». После этого текст будет написан по кругу.

Оцените, пожалуйста, статью! (0 голосов, в среднем: 0 из 5)

Текст по кругу в Фотошоп

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

1. Открываем наш документ. Выбираем инструмент Ellipse Tool (с указанными настройками). Рисуем круг, удерживая клавишу Shift:

2. Выбираем инструмент Type (Текст). Помещаем курсор над линией круга, пока он не примет следующий вид.

3. Печатаем наш текст, он будет распределяться по линии круга. Редакировать текст: крутить его, устанавливать положение внутри или снаружи, можно с помощью инструмента Path Selection Tool и точек управления.

Еще один вариант создания кругового текста — использование полярных координат:

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

2. Удерживая SHIFT, выбираете инструмент прямоугольное выделение. Перейдите в меню Filter> Distort > Polar Coordinates (Фильтр>Искажение>Полярные координаты) и кликните ОК когда появится подсказка, чтобы растеризовать текст.

3. Удостовертесь, что выбрана опция Rectangular to Polar (Прямоугольные в полярные), нажимаете ОК и получаете ваш текст по кругу.

Как проще всего написать текст по кругу в фотошопе?

Всем привет, дорогие друзья! Как ваше настроение? У меня прекрасное: погода супер, через две недели отпуск, день рождения и т.д. Но сейчас не об этом. Скажите, вы часто видели какой-то текст, который написан по кругу? Я думаю, что да. Ведь сегодня такие картинки часто используются, например в каких-либо логотипах и т.д.

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

1. Давайте создадим с вами новый документ, например 800*600, хотя это роли особой не играет.
2. Теперь выберите инструмент «Овальное выделение» и сделайте круг, ну то есть круглое выделение…Ну в общем вы меня поняли. 
3. Далее в верхнем меню выбираем «Окно», а затем «Контуры». Вообще это меню отвечает за отображение всех панелей в фотошопе, поэтому если у вас пропадет палитра «История» или что-нибудь еще, то вы сможете активировать ее снова в меню «Окно». 
4. Появилась новая панелька? Если нет, то посмотрите где-нибудь около панели слоев. Бывает такое, что она может быть прикреплена к ней. В общем теперь вам нужно нажать на маленькую кнопочку «Сделать выделение рабочей областью» на этой маленькой панельке. Видите, что произошло? Выделение превратилось в контур. Вот это нам и нужно. 
5. Теперь берем в руки инструмент «Текст» и подведите курсор к нашей получившемуся круглому рабочему контуру. Когда при наведении курсор изменится, это будет означать, что можно нажимать левую кнопку мыши. Нажали? Молодцы. Теперь весь текст, который вы напишите, будет идти по кругу. Конечно текст не всегда полностью совпадет с размером круга, поэтому здесь подгоняйте сами, чтобы всё уместилось как надо. 
6. Теперь можете удалить или скрыть (CTRL+H) рабочий контур, иначе он вам будет мешать, если вы захотите уменьшить или трансформировать написанное вами. Ну и конечно же вы можете поиграться со стилями слоя для вашего текста, чтобы было красивее. 

Альтернативный вариант

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

Вам нужно выбрать инструмент «Эллипс», а вверху поставить режим «контур». И теперь, когда вы нарисуете этот эллипс, то вы точно также сможете писать по кругу любые тексты.

Ну а почему бы тогда постоянно не использовать второй способ? Дело в том, что благодаря изначальному методу, мы сможем делать надписи не только по кругу, но и по квадратной области, или вообще по кривой. Вот опробуйте проделать всё то же самое, что в в первом варианте, только выделение делайте с помощью инструмента «Лассо». Что у нас получится? Клево, да? Грубовато и некрасиво у меня вышло, но это только для примера.

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

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

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

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

С уважением, Дмитрий Костин.

Как сделать текст по кругу в Photoshop

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

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

Инструмент «Прямоугольник»

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

1. Для прорисовки контура годится любой инструмент, в зависимости от того, какая вас интересует геометрическая фигура. В нашем случае – круг, поэтому мы кликаем на инструмент «Прямоугольник» правой мышиной кнопкой и выбираем «Эллипс».
2. Как видите, после того, как вы это сделали, изменилась шапка программы, в ней добавились новые пункты. Например, можно выбрать тип контура, что мы и сделаем. Из трех предложенных вариаций выберите пункт «Контур».
3. Теперь рисуем наш контур. Чтобы в результате получился все-таки не эллипс, а именно круг, перед началом работы, зажмите на клавиатуре кнопку Shift. Забегая вперед, замечу, что если вам понадобится поменять положение круга, зажмите пробел и переместите контур туда, куда необходимо, после чего отпустите пробел.

Инструмент «Текст»

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

Если добавленный текст находится не под правильным углом, это легко исправить. Кликните на инструмент «Выделение контура», затем переместите курсор в любое место над текстом, чтобы значок из черной стрелки превратился в I-образную с маленькой стрелочкой сбоку. Теперь просто кликните по тексту и перетащите его по контуру, используя компьютерную мышь.

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

Как сделать обводку в фотошопе?

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

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

Мы добавим двойной контур к одному и тому же тексту. Давайте узнаем, как это сделать.

Создайте новый файл и добавьте текст

• Создайте пустой документ в Photoshop, и задайте ему размер 1000 на 500 пикселей. Для данного примера мы воспользуемся простой графикой для веб, и поэтому разрешение документа будет составлять 72ppi. Если же вы планируете пустить эту работу в печать, то не забудьте установить разрешение 300ppi;
• Теперь нужно добавить текст. Я воспользовалась бесплатным шрифтом под названием Folk. Хотя для примера подойдет любой полужирный шрифт.

Выберите инструмент «Текст», нажав клавишу T, или выберите его на панели инструментов:

• В панели параметров, которая должна появиться в самом верху окна, выставите размер 280 pt (если используете другой шрифт, то размер может быть другим). Установите светло-синий цвет (#0099ff):

Чтобы изменить цвет текста в Фотошопе, кликните по цветному квадратику в панели опций, после чего откроется палитра цветов:
Как только разберетесь с настройками, переведите фокус ввода на документ и напишите какой-нибудь текст:
После этого кликните по какому-нибудь другому слою или по галочке на панели опций:

Создаем стиль слоя

• Теперь к только что созданному красивому тексту в Фотошопе нужно применить стиль «Обводка». Кликните по слою с текстом, и удостоверьтесь, что он выделен. Затем нажмите на иконку «Добавить стиль слоя» в самом низу панели. В выпадающем списке нужно выбрать «Обводка»:

Перед вами откроется диалоговое окно с настройками стиля. Не забудьте поставить галочку возле параметра «Просмотр», чтобы видеть изменения, которые вы вносите. Установите размер 5px.

Переключите «Положение» на «Внутри».

Режим наложения оставляем «Нормальный», а «Непрозрачность» на 100%. В качестве цвета выбираем белый:

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

Нажмите по названию стиля «Обводка», который находится рядом. Установите размер 8px. Выставите «Положение» на «Снаружи».

Режим наложения оставляем на «Нормальный», а уровень непрозрачности на 100%. В качестве цвета выставляем светло-синий (#0099ff8):

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

Пока что не нажимайте «ОК». В меню с левой стороны нажмите по стилю «Тень». Давайте добавим небольшую тень того же цвета, что и текст, но так, чтобы она была слегка смещена. Режим наложения устанавливаем на «Умножение». Цвет используем все тот же — #0099ff8. Такая тень будет выглядеть привлекательнее, чем увесистая черная.

Уровень непрозрачности ставим на 100%.
В рамках данного примера подойдет любой угол отбрасывания тени.
Смещение выставляем на 10px.
Размах на 10%
Размер на 10%:

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

Данная публикация является переводом статьи «How To Make A Double Stroke Text Effect In Photoshop» , подготовленная редакцией проекта.

Добавляем в фотошопе текст на неровную поверхность / Creativo.one

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

На создание этого эффекта меня вдохновили различные стили слоя, доступные на Envato Market.

Скачать архив с материалами к уроку

1. Сохраняем карту смещения

Открываем текстуру ткани в Photoshop и переходим File – Save As (Файл – Сохранить как), пишем название файла Displace Map и сохраняем его.

2. Настраиваем карту смещения

Шаг 1

Жмем правой кнопкой по фоновому слою и выбираем Convert to Smart Object (Преобразовать в смарт-объект).

Шаг 2

Переходим Image – Adjustments – Hue/Saturation (Изображение – Коррекция – Цветовой тон/Насыщенность) и устанавливаем параметр Saturation (Насыщенность) на -100.

Шаг 3

Переходим Filter – Blur – Gaussian Blur (Фильтр – Размытие – Размытие по Гауссу) и устанавливаем Radius (Радиус) на 2.

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

Шаг 4

Переходим File – Save (Файл – Сохранить), чтобы сохранить изменения, которые мы внесли в файл Displace Map.

3. Меняем цвет текстуры

Шаг 1

Открываем оригинал текстуры ткани, активируем инструмент Color Replacement Tool (Замена цвета) и устанавливаем цвет переднего плана на #d7ba80.

На верхней панели параметров инструмента устанавливаем Mode (Режим) на Color (Цветность), Sampling (Проба) на Contiguous (Смежные пиксели) и Tolerance (Допуск) на 100%.

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

Благодаря этому, мы изменили цвет текстуры.

Шаг 2

Дублируем фоновый слой и преобразовываем копию в смарт-объект.

4. Улучшаем цвет текстуры

Шаг 1

Дважды кликаем по копии фонового слоя, чтобы применить стиль слоя Color Overlay (Наложение цвета) со следующими настройками:

• Color (Цвет): #fde8bd
• Blend Mode (Режим смешивания): Divide (Разделение)

В результате цвет текстуры стал ярче.

Шаг 2

В нижней части панели слоев жмем на кнопку Create new fill or adjustment layer (Создать новую заливку или корректирующий слой) и выбираем Selective Colors (Выборочная коррекция цвета).

Шаг 3

Из выпадающего меню Colors (Цвета) выбираем Yellows (Желтые) и настраиваем:

• Cyan (Голубой): -30
• Magenta (Пурпурный): -16
• Yellow (Желтый): -47
• Black (Черный): -21

Шаг 4

Далее из выпадающего меню выбираем Blues (Голубые) и меняем значения, как показано ниже:

• Cyan (Голубой): -100
• Magenta (Пурпурный): -35
• Yellow (Желтый): -100
• Black (Черный): -16

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

5. Добавляем текст

Шаг 1

Шрифтом Cookie Regular пишем текст белого цвета и устанавливаем его Size (Размер) на 150 pt.

Шаг 2

Преобразовываем текстовый слой в смарт-объект и устанавливаем его Fill (Заливка) на 0.

6. Стилизуем текст

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

Шаг 1

Добавляем стиль слоя Bevel and Emboss (Тиснение):

• Style (Стиль): Pillow Emboss (Контурное тиснение)
• Size (Размер): 8
• Активируем Anti-aliased (Сглаживание)
• Highlight Mode (Режим подсветки): Linear Light (Линейный свет)
• Color (Цвет): #929292
• Opacity (Непрозрачность): 50%
• Shadow Mode (Режим тени): Color Burn (Затемнение основы)
• Color (Цвет): #434343
• Opacity (Непрозрачность): 27%

Шаг 2

Добавляем стиль слоя Color Overlay (Наложение цвета):

• Color (Цвет): #bdadb1
• Blend Mode (Режим смешивания): Linear Burn (Линейный затемнитель)

Шаг 3

Добавляем стиль слоя Drop Shadow (Тень):

• Blend Mode (Режим смешивания): Linear Burn (Линейный затемнитель)
• Color (Цвет): #707070
• Opacity (Непрозрачность): 20%
• Снимаем флажок с Use Global Light (Глобальное освещение)
• Angle (Угол): 90
• Distance (Расстояние): 3
• Size (Размер): 5

В результате мы стилизовали текст.

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

7. Применяем фильтры Blur (Размытие) и Displace (Смещение)

Шаг 1

Выбираем смарт-объект с текстом и переходим Filter – Blur – Gaussian Blur (Фильтр – Размытие – Размытие по Гауссу). Устанавливаем Radius (Радиус) на 1. Это сделает эффект более мягким и аккуратным.

Шаг 2

Теперь переходим Filter – Distort – Displace (Фильтр – Искажение – Смещение). В результате появится диалоговое окно.

Horizontal Scale (Масштаб по горизонтали) и Vertical Scale (Масштаб по вертикали) отвечает за интенсивность эффекта. Высокое значение позволит создать более волнистые складки, а низкое – более аккуратные.

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

Displacement Map (Схема искривления) устанавливаем на Stretch to Fit (Растянуть), Undefined Areas (Неопределенные области) на Repeat Edge Pixels (Повторить граничные пиксели) и жмем ОК.

Шаг 3

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

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

Шаг 4

Запомните, что вы в любой момент сможете подкорректировать настройки фильтра Displace (Смещение), если дважды кликните по нему в списке смарт-фильтров и повторно примените с новыми значениями.

8. Настраиваем резкость фона

Это опциональный шаг, и вы можете его пропустить. Но если вы хотите получить более качественный результат, выбираем копию фонового слоя, затем переходим Filter – Sharpen – Smart Sharpen (Фильтр – Резкость – Умная резкость) и применяем следующие параметры:

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

Заключение

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

Затем мы настроили цвет текстуры и создали текст.

После этого использовали фильтр Displace (Смещение) и применили к тексту карту смещения, чтобы он соответствовал складкам на ткани.

И, наконец, увеличили резкость фона.

Автор: Rose

6. Текст на круговом контуре

Adobe Illustrator 10 или более поздние версии Программа Illustrator прекрасно справляется с расстановкой текста по окружности. Но иногда вам хочется, чтобы текст на нижней половине окружности был расположен правильно, а не вверх ногами. И иногда вы хотите, чтобы текст изгибался и растягивался вместе с кривой. Первая техника показывает, как создавать текст по окружности так, чтобы литеры всегда располагались верхней частью кверху. По этой технике литеры остаются также недеформированными. По второй технике используется искажение Envelope (Огибающая), чтобы разместить текст по дуге таким образом, чтобы текст растягивался и деформировался. Неискаженный круговой текст 1. Выделите инструмент «Эллипс», нажмите клавишу Shift и создайте окружность, которая определяет внутреннюю базовую линию вашего текста. 2. Выделите инструмент «Контур» и щелкните на верхней анкерной точке окружности. Введите только тот текст, который должен показываться на верхней половине окружности. Текст для нижней половины окружности будет вводиться на следующем шаге. Текст из одних заглавных букв выглядит лучше, чем текст с буквами из верхнего и нижнего регистров, потому что в нем нет букв с верхними или нижними выносными элементами, которые перерезают дугу, формирующую буквы. 3. Выберите команду Select > All (Все), чтобы выделить текст, который вы только что ввели. Выберите команду Window > Туре > Paragraph (Абзац), чтобы отобразить на экране палитру Paragraph (Абзац). Щелкните на кнопке Align Center (Выравнивать по центру), чтобы центрировать текст по верхней половине окружности. 4. Сохраняя текст еще выделенным, выберите инструмент «Выделение». Захватите верх вертикального луча, который появляется в середине текста. и протащите его прямо вниз, нажимая в это время клавиши Shift + Option/Alt. Когда вы достигнете нижней точки окружности, отпустите кнопку мыши и затем клавиши Shift + Option/Alt. Теперь вы создали копию текста. 5. Выделите инструмент path type (Текст контура) и выберите команду Select > All, чтобы выделить текст, дубликат которого вы только что поместили внизу окружности. Замените этот текст новым текстом, который должен быть на нижней половине окружности. Не тревожьтесь, если этот новый текст накладывается на текст верхней половины окружности. 6. Выберите команду Select > All, чтобы выделить весь текст внизу. Выберите команду View (Просмотреть) > Туре (Шрифт) > из меню палитры Character (Символ), чтобы отобразить на дисплее палитру Character, и затем выберите из меню палитры команду Show Options (Показать опции). Щелкните на кнопках Base Line Shift (Сдвиг базовой линии) на палитре Character, чтобы передвинуть текст таким образом, чтобы буквы касались окружности своими верхними частями. 7. Введите, если нужно, дробную величину в зависимости от размера и дизайна текста. В этом примере сдвиг базовой линии равен -6,5 пункта. 8. Выберите инструмент «Выделение» и выделите обе окружности с их текстом. Щелкните на кнопке Font Size (Размер шрифта), чтобы скорректировать размер текста так, чтобы он укладывался вокруг окружности. Вы можете корректировать также межбуквенный пробел, чтобы выровнять буквы по окружности. В этом примере трекинг был установлен на 40. 9. Скорректируйте, если нужно, положение текста на окружности. Используйте инструмент выделения, чтобы перетащить вертикальный луч. Выберите команду Illustrator > Preferences (Предпочтительные установки) > Туре & Auto Tracing (Текст и автослежение) (OS X) или Edit > Preferences > Type & Auto Tracing (Mac OS и Windows) и включите опцию Type Area Select (Выделить область текста), чтобы облегчить выделение текста. В этом примере плохо смотрелся интервал между двумя буквами L, так что он был слегка уменьшен. 10. Для того чтобы добавить окантовку, выделите инструмент «Эллипс». Позиционируйте инструмент в центральной точке окружностей текста. При нажатых клавишах Option/Alt перетащите его из центральной точки наружу. Нажмите клавишу Shift, чтобы заставить объект стать окружностью. Отпустите кнопку мыши и затем клавиши Option/Alt. Повторите этот шаг столько раз, сколько вам нужно окантовок. Искаженный текст по окружности 1. Пользуясь инструментом «Текст», создайте текст, который должен появиться на верхней половине окружности. 2. Выделите текст инструментом «Выделение». Выберите команду Object (Объект) > Envelope Distort (Искажение по огибающей) > Make with Warp (Сделать с искривлением), чтобы открыть диалоговое окно Warp Options (Опции искривления). Щелкните на кнопке Preview (Предварительный просмотр) и используйте установки, показанные на иллюстрации. Щелкните на ОК. 3. Выберите команду Edit (Редактировать) > Сору (Копировать) и затем Edit > Paste in Front (Вставить впереди), чтобы создать точный дубликат огибающего текста. Вы будете на следующих нескольких шагах редактировать текст по этой копии. 4. Сохраняя контур еще выделенным, выберите команду Object > Envelope Distort (Искажать форму по образующей) > Reset with Warp (Переустановить с искривлением). Щелкните на кнопке Preview и замените значение Bend (Изогнуть) на -100 %. Щелкните на ОК. Пусть вас не тревржит, если дуги текста накладываются друг на друга: вы приведете это в порядок на следующих шагах. 5. Пользуясь меню View, включите опцию Smart Guides (Умные направляющие). Пользуясь инструментом «Выделение», захватите нижнюю дугу за верхний край и передвигайте его до тех пор, пока он не прикрепится к краю верхней дуги. 6. Выберите команду Object > Envelope Distort > Edit Contents (Редактировать содержание) для того, чтобы отредактировать верхний текст. Используйте инструмент «Текст», чтобы выделить текст, и введите новый текст для нижней части окружности. 7. Если вы хотите иметь пробелы между фрагментами текста на обеих половинах окружности, поставьте в начале и в конце нижнего фрагмента текста буквы, нарисованные без обводки и без заливки, а лишь использующие пробел, который не будет работать. В этом примере в начале и в конце фразы «OF APPROVAL» помещены буквы О. Эти буквы О залиты и обведены цветом None. 8. Добавьте рамки, если желательно, и вы закончили. Вы можете также изменять цвет, гарнитуру шрифта и размер текста, следуя указаниям, данным на шаге 6.

Обводка текста в GIMP • Уроки GIMP для начинающих

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

Что же такое «обводка»? А обводка представляет собой создание линии определенной толщины по заранее выбранному (намеченному) узору. Таким образом, в нашем уроке Gimp мы создадим обводку текста, а узором нам послужит контур нашей сделанной надписи.

Шаг 1. Запускаем GIMP. И создаем новое изображение через меню «Файл — Создать новое изображение».

Шаг 2. На панели инструментов выбираем инструмент «Текст» и создаем любую надпись

Вы также можете легко изменить шрифт и его размер. Для данного урока будем использовать шрифт Sans Bold и размер 80px.

Далее изменим цвет шрифта, для этого щелкаем по цвету переднего плана и выбираем цвет 009500

854
Шаг 3. Щелкаем правой кнопкой мыши по слою с текстом  и из выпадающего меню выбираем «Альфа-канал в выделение». Вокруг текста должна появиться «муравьиная дорожка».

Шаг 4. Теперь переходим в «Выделение — Увеличить» и вводим значение 3.

Шаг 5. Далее создаем новый слой через меню «Слой — Создать слой» или мышкой щелкаем по пиктограмме «Создать новый слой».

Шаг 6. Закрашиваем выделение черным цветом.

Шаг 7. Теперь остается только переместить слой с черным цветом под слой с зеленым текстом. Для этого щелкаем по пиктограмме «Опустить слой вниз»

Все выше описанные действия можно повторить быстрее с помощью дополнительного плагина гимп под названием «Эффекты слоя». Чтобы сделать обводку, выделяем слой с текстом и переходим в меню «Layer Effects — Stroke». В открывшемся диалоговом окне задаем толщину линии «Size» и ее цвет «Color» и далее нажимаем ОК.

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

Автор урока: Антон Лапшин

пользовательских фигур в качестве текстовых рамок в Photoshop

Шаг 1. Выберите инструмент Custom Shape Tool

.

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

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

Шаг 2: Выберите форму

Выбрав инструмент Custom Shape Tool, щелкните эскиз формы для предварительного просмотра на панели параметров в верхней части экрана:

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

Это открывает средство выбора формы Photoshop , которое отображает маленькие эскизы всех пользовательских форм, из которых мы можем выбирать. Чтобы выбрать фигуру, просто щелкните ее миниатюру. Я выберу форму сердца. После того, как вы выбрали форму, нажмите Enter (Win) / Return (Mac), чтобы закрыть окно выбора формы:

Выбор формы сердца, щелкнув по его миниатюре.

Шаг 3. Выберите опцию «Пути»

В крайнем левом углу панели параметров находится ряд из трех значков, каждый из которых представляет различные типы фигур, которые мы можем нарисовать. Photoshop дает нам выбор рисования обычных форм, контуров или фигур на основе пикселей. Чтобы использовать фигуру в качестве контейнера для нашего текста, мы хотим нарисовать путь, который по сути является контуром фигуры. Мы разместим наш текст внутри контура. Щелкните по середине из трех значков, чтобы выбрать параметр Paths :

Щелкните параметр «Пути» (средний из трех значков).

Шаг 4: Нарисуйте свою форму

Выбрав параметр «Контуры» на панели параметров, щелкните внутри документа и перетащите фигуру. Вы увидите, что ваша фигура выглядит как тонкий контур при перетаскивании. Вы можете удерживать нажатой клавишу Shift во время перетаскивания, чтобы форма сохраняла свой первоначальный вид, пока вы ее рисуете. Если вам нужно изменить положение фигуры при ее рисовании, удерживайте нажатой клавишу пробела , перетащите фигуру в нужное место в документе, затем отпустите клавишу пробела и продолжайте перетаскивание.Здесь я нарисовал свою форму сердца в правом верхнем углу изображения:

Щелкните и перетащите фигуру в документ. Он появится в виде контура.

Шаг 5. Измените форму, поверните или переместите траекторию (необязательно)

Если вам нужно изменить форму или повернуть контур (контур формы) или переместить его в другое место, самый простой способ сделать это — перейти к меню Edit в строке меню в верхней части экрана. и выбрав Free Transform Path .Вы также можете нажать Ctrl + T (Win) / Command + T (Mac), чтобы быстро выбрать ту же команду с помощью сочетания клавиш:

Перейдите в Edit> Free Transform Path.

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

Я собираюсь немного повернуть форму сердца, чтобы изогнутая левая сторона проходила лучше с расположением цветов:

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

Нажмите Введите (Win) / Верните (Mac), когда вы закончите, чтобы принять изменения и выйти из команды Free Transform Path:

Теперь контур выглядит повернутым.

Шаг 6. Выберите инструмент «Текст»

Теперь, когда у нас есть путь, мы готовы добавить текст! Выберите инструмент Type Tool на панели инструментов:

Выберите инструмент «Текст».

Шаг 7. Выберите шрифт

Выберите шрифт, который хотите использовать для текста, на панели параметров. В своем дизайне я буду использовать Palatino Italic, размер шрифта 12 pt:

.

Выберите шрифт на панели параметров.

Чтобы выбрать цвет для текста, я нажимаю образец цвета на панели параметров:

Щелкните образец цвета, чтобы выбрать цвет для текста.

Откроется палитра цветов Photoshop . Я выберу темно-зеленый цвет в палитре цветов, чтобы он соответствовал цвету цветов на моем изображении. После того, как вы выбрали цвет, нажмите OK, чтобы закрыть палитру цветов:

.

Выберите цвет текста в палитре цветов.

Шаг 8: Откройте панель абзацев

Нажмите на панели символов / абзацев, чтобы переключить значок справа от образца цвета на панели параметров:

Значок переключателя открывает и закрывает панели «Символ» и «Абзац».

Это открывает панели Photoshop Character и Paragraph , которые по умолчанию скрыты. Выберите панель Paragraph , щелкнув вкладку ее имени в верхней части группы панелей:

Щелкните вкладку панели «Абзац».

Шаг 9: Выберите вариант «Выровнять по центру»

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

Выберите параметр «Выровнять по центру».

Шаг 10: Добавьте свой текст

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

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

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

По мере ввода текст остается в границах фигуры.

Продолжайте добавлять текст, пока не заполните область фигуры:

Теперь фигура заполнена текстом.

Шаг 11. Нажмите на галочку, чтобы принять текст.

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

Щелкните галочку, чтобы принять текст.

Теперь текст добавлен и красиво заполняет область формы, но мы все еще можем видеть контур пути вокруг него:

Контур вокруг текста остается видимым.

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

Путь будет виден, когда текстовый слой активен.Чтобы скрыть это, выберите другой слой.

И на этом мы закончили! Добавленный мной текст, возможно, не принесет мне каких-либо литературных наград, но теперь мы увидели, насколько легко использовать пользовательские формы Photoshop в качестве контейнеров для текста:

Окончательный результат.

Пластиковый стиль текста — Планета Photoshop

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

1. Откройте Photoshop и выберите «Файл»> «Создать». Задайте имя документа «Пластик».Установите ширину 650 пикселей, высоту 1000 пикселей, разрешение 72 точек на дюйм, цветовой режим RGB и нажмите OK.

2. Нажмите «D» на клавиатуре, чтобы сбросить цвета переднего плана и фона. Перейдите в Edit> Fill и установите Contents на использование Foreground Color. Убедитесь, что для параметра Mode установлено значение Normal, а для параметра Opacity установлено значение 100%. Щелкните ОК.

3. Нажмите «T» на клавиатуре, чтобы выбрать инструмент «Текст». Перейдите в Окно> Персонаж; и в окне настроек установите семейство шрифтов на «BPreplay»; стиль шрифта на «Полужирный»; размер 180pt, отслеживание до 50 и метод сглаживания Smooth.Щелкните эскиз цвета и в окне выбора цвета установите цвет на #FFFFFF. Щелкните ОК.

4. Щелкните холст и введите «Планета». Перейдите в Layer> Duplicate Layer и задайте имя «Planet front». Щелкните ОК.

5. Скройте слой «Планета спереди» и выберите слой «Планета» (мы делаем это, чтобы работать было удобнее).

Перейдите в Layer> Layer Style> Stroke и примените следующие настройки:

Отметьте эффект «Bevel & Emboss» и примените следующие настройки:

По-прежнему в настройках «Bevel & Emboss», щелкните маленькую стрелку рядом с миниатюрой Gloss Contour.Из списка миниатюр выберите контур «Кольцо».

Теперь проверьте эффект Contour в окне Layer Style. Установите диапазон 53% и установите флажок Anti-aliased.

Щелкните миниатюру контура (откроется окно редактора контура).

Щелкните в любом месте линии, чтобы создать новую точку.

Установите значение входа на 75% и значение выхода на 89%

Повторим этот процесс еще два раза.Щелкните в любом месте на линии, чтобы создать новую точку, и установите значение ввода на 50% и значение на выходе на 67%. Снова щелкните по линии и установите для этой новой точки значение ввода 32% и значение вывода 77%. Щелкните OK в редакторе контуров и еще раз щелкните OK в окне Layer Style.

6. Выберите слой «Планета спереди» и сделайте его видимым, щелкнув пустое место со значком глаза рядом с именем слоя. ВНИМАНИЕ !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!

Перейдите в Layer> Layer Style> Inner Glow и примените следующие настройки:

Теперь проверьте эффект Bevel & Emboss и примените следующие настройки:

По-прежнему в настройках «Bevel & Emboss», щелкните маленькую стрелку рядом с миниатюрой Gloss Contour.Из списка миниатюр выберите контур «Скатный откос — восходящий».

Теперь проверьте эффект Contour в окне Layer Style. Установите диапазон на 94% и установите флажок «Сглаживание».

Щелкните маленькую стрелку рядом с миниатюрой Contour и из списка миниатюр выберите контур «Valley — High». Щелкните ОК.

Выберите инструмент «Текст» (T). Щелкните эскиз цвета в параметрах панели текстовых инструментов и в окне выбора цвета установите цвет на # FF0000.Щелкните ОК.

Не снимая выделения со слоя «Планета спереди», нажмите и удерживайте клавишу Control (Command) на клавиатуре и щелкните по слою «Планета». Перейдите в Layer> New> Group From Layers и установите имя «Red». Щелкните ОК.

7. Перейдите в Layer> Duplicate Group и установите имя «Голубой». Щелкните ОК.

Щелкните и перетащите по холсту, чтобы разместить новую группу под «красной» группой, как показано.

Разверните группу слоя, щелкнув маленькую стрелку рядом с названием группы.

Щелкните слой «Планета спереди», удерживайте клавишу Control (Command) на клавиатуре и щелкните слой «Планета». Перейдите в Layer> Layer Style> Clear Layer Style.

Щелкните слой «Планета спереди», чтобы выбрать только этот слой, и перейдите в Слой> Стиль слоя> Наложение цвета. Щелкните эскиз цвета и в окне выбора цвета установите цвет # 58D3FC. Щелкните ОК.

По-прежнему в окне «Стиль слоя» проверьте эффект «Атлас» и примените следующие настройки:

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

Проверьте эффект Inner Glow в окне Layer Style и примените следующие настройки:

Теперь щелкните эффект Bevel & Emboss в окне Layer Style и примените следующие настройки:

Все еще находясь в эффекте Bevel & Emboss, щелкните эскиз контура, чтобы открыть редактор контуров. Щелкните в любом месте на линии, чтобы создать новую точку.

Установите входное значение на 90% и выходное значение на 91%.Отметьте опцию «Угол».

Повторим этот процесс еще несколько раз. Щелкните в любом месте на линии, чтобы создать новую точку, и установите значение ввода на 80%, значение вывода на 95% и отметьте опцию «Угол». Снова щелкните по линии и установите для этой новой точки значение ввода 66% и значение вывода 42%. Снова щелкните по линии и установите новую точку на входное значение 56% и выходное значение 99% и отметьте опцию «Угол». Теперь щелкните нижнюю левую точку и установите значение ввода 42% и значение вывода 45%.Нажмите ОК в редакторе контуров.

Отметьте эффект «Контур» в окне «Стиль слоя» и примените следующие настройки:

Теперь мы будем работать над Контуром этого эффекта, как мы это делали на последних шагах. Для этого щелкните миниатюру контура, чтобы открыть редактор контуров. Щелкните верхнюю правую точку и установите значение ввода на 92%, а значение вывода на 100%.

Как и раньше, мы повторим этот процесс еще несколько раз.Щелкните в любом месте на линии, чтобы создать новую точку и установить значение ввода 74% и значение вывода 93%. Снова щелкните по линии и установите для этой новой точки значение ввода 62% и значение вывода 82%. Снова щелкните по линии и установите для новой точки значение ввода 50% и значение вывода 65%. Снова щелкните по линии и установите для новой точки значение ввода 29% и значение вывода 44%. Снова щелкните по линии и установите для новой точки значение ввода 25% и значение вывода 15%.Последний раз; щелкните по линии и установите для новой точки значение ввода 13% и значение вывода 47%. Нажмите ОК в редакторе контуров. Нажмите ОК в окне «Стиль слоя».

8. Щелкните слой «Планета», чтобы сделать его активным. Перейдите в Layer> Layer Style> Color Overlay. Щелкните эскиз цвета и в окне выбора цвета установите цвет # 58D3FC. Щелкните ОК.

Проверьте эффект Inner Glow в окне Layer Style и примените следующие настройки:

Проверьте эффект обводки и примените следующие настройки:

Теперь щелкните эффект Bevel & Emboss в окне Layer Style и примените следующие настройки:

По-прежнему находясь в эффекте Bevel & Emboss, щелкните маленькую стрелку рядом с миниатюрой Gloss Contour и из списка миниатюр выберите контур «Ring — Double».

Отметьте эффект «Контур» в окне «Стиль слоя» и примените следующие настройки:

По-прежнему находясь в эффекте «Контур», щелкните маленькую стрелку рядом с миниатюрой «Контур» и из списка миниатюр выберите контур «Неглубокий склон — долина». Щелкните ОК.

9. Как видите, создавать пластиковые стили в Photoshop легко, если вы знаете, как обрабатывать контурные кривые. Теперь мы создадим еще два стиля, изменив цвета и контурные кривые лицевого текста.Как и раньше, мы продублируем группу слоев, очистим стили и применим новые. Итак, давайте начнем с нажатия на группу «Голубой», чтобы выбрать ее, и перейдем к Layer> Duplicate Group. Установите имя «Серый» и нажмите «ОК».

Щелкните и перетащите по холсту, чтобы разместить новую группу под «красной» группой, как показано.

Щелкните слой «Планета спереди», удерживайте клавишу Control (Command) на клавиатуре и щелкните слой «Планета».Перейдите в Layer> Layer Style> Clear Layer Style.

Щелкните слой «Планета спереди», чтобы выбрать только этот слой, и перейдите в Слой> Стиль слоя> Наложение цвета. Щелкните эскиз цвета и в окне выбора цвета установите цвет # B9B9B9. Щелкните ОК.

Проверьте эффект Inner Glow в окне Layer Style и примените следующие настройки:

Теперь щелкните эффект Bevel & Emboss в окне Layer Style и примените следующие настройки:

Все еще находясь в эффекте Bevel & Emboss, щелкните эскиз контура, чтобы открыть редактор контуров.Щелкните в любом месте на линии, чтобы создать новую точку.

Установите входное значение на 89% и выходное значение на 6%.

Опять же, повторим этот процесс еще шесть раз. Щелкните в любом месте на линии, чтобы создать новую точку. Установите входное значение на 76% и выходное значение на 100%. Снова щелкните по линии и установите для этой новой точки значение ввода 62% и значение вывода 5%. Снова щелкните по линии и установите для новой точки значение ввода 49% и значение вывода 100%.Еще три раза; щелкните в любом месте на линии, чтобы создать новую точку, и установите значение ввода на 36% и значение вывода на 5%. Снова щелкните линию и установите для этой новой точки значение ввода 24% и значение вывода 100%. Снова щелкните по линии и установите для новой точки значение ввода 10% и значение вывода 5%. Теперь щелкните нижнюю левую точку и установите значение ввода 0% и значение вывода 100%. Нажмите ОК в редакторе контуров.

Отметьте эффект «Контур» в окне «Стиль слоя» и примените следующие настройки:

По-прежнему находясь в эффекте «Контур», щелкните маленькую стрелку рядом с миниатюрой «Контур» и из списка миниатюр выберите контур «Неглубокий склон — долина».Щелкните ОК.

10. Щелкните слой «Планета», чтобы сделать его активным. Перейдите в Layer> Layer Style> Color Overlay. Щелкните эскиз цвета и в окне выбора цвета установите цвет # C3C3C3. Щелкните ОК.

Проверьте эффект Inner Glow в окне Layer Style и примените следующие настройки:

Проверьте эффект обводки и примените следующие настройки:

Теперь щелкните эффект Bevel & Emboss в окне Layer Style и примените следующие настройки:

По-прежнему находясь в эффекте Bevel & Emboss, щелкните маленькую стрелку рядом с миниатюрой Gloss Contour и из списка миниатюр выберите контур «Ring — Triple».

Отметьте эффект «Контур» в окне «Стиль слоя» и примените следующие настройки:

По-прежнему находясь в эффекте «Контур», щелкните маленькую стрелку рядом с миниатюрой «Контур» и из списка миниатюр выберите контур «Неглубокий склон — долина». Щелкните ОК.

11. Теперь мы сделаем последний, используя только предопределенные контуры, чтобы вы могли увидеть, как добиться красивого пластического эффекта с настройками контуров по умолчанию.Опять же, мы дублируем группу слоев, очищаем стили и применяем новые. Итак, давайте начнем с нажатия на стрелку рядом с названием «Серой» группы, чтобы свернуть ее, и перейдем в Layer> Duplicate Group. Установите имя «Розовый» и нажмите «ОК».

Щелкните и перетащите по холсту, чтобы разместить новую группу под «серой» группой, как показано.

Щелкните слой «Планета спереди», удерживайте клавишу Control (Command) на клавиатуре и щелкните слой «Планета».Перейдите в Layer> Layer Style> Clear Layer Style.

Щелкните слой «Планета спереди», чтобы выбрать только этот слой, и перейдите в Слой> Стиль слоя> Наложение цвета. Щелкните миниатюру цвета и в окне выбора цвета установите цвет на # FC58EB. Щелкните ОК.

Проверьте эффект Inner Glow в окне Layer Style и примените следующие настройки:

Щелкните эффект Bevel & Emboss в окне Layer Style и примените следующие настройки:

По-прежнему находясь в эффекте Bevel & Emboss, щелкните маленькую стрелку рядом с миниатюрой Gloss Contour и из списка миниатюр выберите контур «Terraced».

Отметьте эффект «Контур» в окне «Стиль слоя» и примените следующие настройки:

По-прежнему находясь в эффекте «Контур», щелкните маленькую стрелку рядом с миниатюрой «Контур» и из списка миниатюр выберите контур «Неглубокий склон — долина». Щелкните ОК.

12. Щелкните слой «Планета», чтобы сделать его активным. Перейдите в Layer> Layer Style> Color Overlay. Щелкните миниатюру цвета и в окне выбора цвета установите цвет на # FC58EB.Щелкните ОК.

Проверьте эффект Inner Glow в окне Layer Style и примените следующие настройки:

Проверьте эффект обводки и примените следующие настройки:

Теперь щелкните эффект Bevel & Emboss в окне Layer Style и примените следующие настройки:

По-прежнему находясь в эффекте Bevel & Emboss, щелкните маленькую стрелку рядом с миниатюрой Gloss Contour и из списка миниатюр выберите контур «Terraced».

Отметьте эффект «Контур» в окне «Стиль слоя» и примените следующие настройки:

По-прежнему находясь в эффекте «Контур», щелкните маленькую стрелку рядом с миниатюрой «Контур» и из списка миниатюр выберите контур «Неглубокий склон — долина». Щелкните ОК.

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

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

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

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

---

Шаг 1

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

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

Щелкните Изображение> Коррекция> Обесцветить, чтобы сделать его черно-белым.

Сохраните слегка размытое изображение в оттенках серого как файл PSD на жесткий диск, а затем закройте его в Photoshop.

---

Шаг 2

Снова откройте исходное фоновое изображение в Photoshop.

Создайте текст с помощью инструмента «Текст».

Карты смещения

можно применять только к растеризованным слоям или смарт-объектам. Щелкните правой кнопкой мыши текстовый слой на панели «Слои» и выберите «Преобразовать в смарт-объект».

---

Шаг 3

Щелкните «Фильтр»> «Искажение»> «Смещение». Установите горизонтальный и вертикальный масштаб на 10, карту смещения для растягивания по размеру и неопределенные области для повторения краевых пикселей и нажмите ОК.

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

---

Шаг 4

Установите для заливки вашего текстового слоя значение 0% на панели «Слои». Дважды щелкните текстовый слой на панели «Слои», чтобы открыть диалоговое окно «Стиль слоя».

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

Используйте цвет # 86A8CB для Color Overlay.

---

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

Поскольку ваш текст является смарт-объектом, вы можете дважды щелкнуть фильтр «Смещение» и изменить интенсивность или дважды щелкнуть миниатюру слоя, чтобы открыть и отредактировать текст.

---

Удалось ли вам применить эту технику в своей работе? Делитесь своей версией в комментариях.

Как сделать портрет из шрифта в Photoshop

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

Шаг 1. Выберите изображение

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

Шаг 2: Добавьте свой текст

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

Больше после прыжка! Продолжайте читать ниже ↓
Члены бесплатной и премиальной версии видят меньше рекламы! Зарегистрируйтесь и войдите в систему сегодня.

Шаг 3: Дублирование и размытие

Вы собираетесь использовать фильтр «Смещение», чтобы текст обтекал контуры изображения. Но если вы просто используете необработанное изображение, детали сделают текст неровным. Вместо этого продублируйте изображение Линкольна и используйте Фильтр> Размытие по Гауссу, чтобы скрыть все мелкие детали, оставив только свет и тень. Затем сохраните изображение.

Шаг 4: вытесняющий фильтр

Дублируйте текстовый слой — он может вам понадобится позже — и выберите «Слой»> «Растрировать»> «Тип».Это превратит текст в обычный пиксельный слой. Затем выберите «Фильтр»> «Искажение»> «Смещение» и установите горизонтальный масштаб на 0 и вертикальный масштаб на значение около 5 (в противном случае смещение будет слишком большим). Когда вы нажмете ОК, вы увидите стандартный диалог Открыть: выберите файл, который вы только что сохранили.

Шаг 5: Смещенный текст

Вот результат действия «Смещение» текста: вы можете увидеть, как он перекатывается по контурам лица Линкольна. Обратите внимание, что здесь я скрыл размытый слой Линкольна, открыв оригинал под ним.

Шаг 6: Загрузите текст

Загрузите растеризованный текстовый слой как выделение, удерживая Command / Ctrl и щелкая по его миниатюре на панели слоев. Затем скройте слой с растрированным текстом. Затем переключитесь на исходный слой Линкольна и используйте Command / Ctrl J, чтобы создать новый слой из этого выделения. Добавьте новый слой под текстом и залейте его черным цветом.

Шаг 7: Сделайте светлее

Поскольку часть слоя Линкольна была чисто черной, текст, сделанный из этой области, невидим на черном фоне.Если у вас такое изображение, откройте «Коррекция»> «Уровни» и перетащите черный ползунок под «Уровни вывода» вправо, чтобы сделать чистый черный текст ярче и сделать его разборчивым.

Шаг 8: Готовый результат

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

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

Вот видео, показывающее эту технику!

Как обернуть текст по кругу с помощью Adobe Illustrator

В сегодняшнем руководстве для начинающих я продемонстрирую, как обернуть текст по кругу с помощью Adobe Illustrator. Этот метод также позволит вам обвести текст вокруг любого другого объекта или формы, которые вам нравятся. Для этого мы будем использовать инструмент «Текст на контуре».

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

Обтекание текста по кругу с помощью Illustrator

Чтобы обернуть текст вокруг круга в Illustrator, просто возьмите Type на инструменте Path Tool и щелкните круг, вокруг которого вы хотите разместить текст. Это поместит текст по периметру круга, который вы можете редактировать по своему вкусу.

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

Теперь возьмите Type on a Path Tool на панели инструментов слева от экрана.

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

По умолчанию Illustrator размещает текст по внешнему периметру круга. Мы собираемся изменить это так, чтобы текст был утоплен на полпути по периметру. Для этого перейдите к Type -> Type on a Path -> Type on a Path Options . В меню включите Preview и установите Align to Path на Center .Теперь продолжайте и нажмите OK для завершения.

Теперь вы можете повернуть текст вдоль контура, взяв инструмент Direct Selection Tool (A) , щелкнув и перетащив тонкую синюю линию, выходящую из края круга.

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

Возьмите инструмент Type Tool и измените текст дублированной копии на то, что вы хотите, чтобы нижняя половина текста была, затем вернитесь к Type в меню Path Options и установите флажок с надписью Флип . Идите вперед и нажмите ОК . Это должно обернуть ваш текст вокруг внутренней части круга.

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

И с этим все готово! Мы успешно обернули текст вокруг внешнего и внутреннего краев круга с помощью Adobe Illustrator!

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

_{Logos By Nick LLC является участником программы Amazon Services LLC Associates, партнерской рекламной программы, предназначенной для предоставления сайтам средств зарабатывать рекламные сборы за счет рекламы и ссылок на Amazon.com. Как партнер Amazon я зарабатываю на соответствующих покупках. Прочтите раскрытие информации об аффилированных лицах здесь.}

Эффект реалистичного хрома и глянцевого пластика

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

Для этого эффекта я использовал шрифт Helvetica Rounded Bold, но вы можете использовать любой закругленный шрифт, какой захотите.Вот некоторые другие похожие бесплатные шрифты: Junegull, Zorque и You’re away. Этот эффект будет лучше смотреться на закругленных шрифтах, но использование других шрифтов также может принести некоторые интересные результаты.

Светоотражающий эффект хрома

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

Начните с рабочей области 290 × 230. Нарисуйте синий (# 0080FF) и черный градиент, как показано на изображении ниже, чтобы подчеркнуть технический вид эффекта:

Теперь введите две буквы размером 200 пикселей (в данном примере «TE»).

Выберите текстовый слой и примените к нему COLOR OVERLAY LAYER STYLE .

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

Это одна из самых важных частей эффекта.Здесь мы придадим буквам округлый объем. Используя почти вертикальный источник света и очень резкий GLOSS CONTOUR PROFILE , мы получим некоторые реалистичные искаженные глянцевые блики. Чтобы создать этот контур, вы должны нажать на образец профиля GLOSS CONTOUR и начать играть с редактором кривых. Поскольку объяснение здесь слишком длинное, вы можете загрузить контур и загрузить его в PRESET MANAGER , выполнив следующие действия:

1) Перейдите к РЕДАКТИРОВАТЬ> УПРАВЛЕНИЕ ПРЕДУСТАНОВКАМИ…

2) Щелкните раскрывающееся меню ПРЕДУСТАНОВЛЕННЫЙ ТИП и выберите КОНТУРЫ .Группа контуров загрузится в окно PRESET MANAGER .

3) Нажмите кнопку ЗАГРУЗИТЬ и найдите файл контуров (PRChrome.shc), который вы только что загрузили, загрузите его и затем нажмите ГОТОВО .

4) Перейдите в окно стиля слоя BEVEL AND EMBOSS и щелкните маленькую стрелку слева от образца GLOSS CONTOUR . Появится раскрывающееся окно с новым загруженным профилем.Просто выберите его, и вы готовы перейти к следующему шагу.

Добавление тени всегда обязательно при моделировании трехмерных объектов.

А теперь позвольте волшебству начаться. Эффект SATIN отлично подходит для имитации отражений. С помощью этих настроек мы имитируем искаженное отражение по краям каждой буквы.

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

И, наконец, вишенка наверху: отражение фона, на котором расположены буквы.

Это приятный штрих, потому что он позволяет вам согласовать цвет фона (в данном случае синий # 0080FF), чтобы лучше интегрировать буквы в окружение.

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

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

1) Дублируйте хромированный текстовый слой.

2) Щелкните глазком видимости слоя, чтобы скрыть слой хрома. Выделите новые повторяющиеся слои и перейдите в меню СЛОЙ> СТИЛЬ СЛОЯ> ЧИСТЫЙ СТИЛЬ СЛОЯ.

3) Выберите новый дублирующий слой и перейдите в меню СЛОЙ> РАСТЕРИЗОВАТЬ> ТИП. Текст на слое будет преобразован в графику и больше не будет доступен для редактирования.

4) Переименуйте новый слой как хотите.Теперь у вас должен быть слой BACKGROUND , слой с текстовым эффектом Chrome (сейчас скрыт) и новый растеризованный текстовый слой.

Нажмите CTRL KEY ( COMMAND KEY на Mac) и щелкните указателем мыши на миниатюре предварительного просмотра нового слоя, чтобы загрузить выделение:

Теперь перейдите в меню EDIT> STROKE и установите WIDTH: 4px , COLOR: # 000000 (BLACK) , LOCATION: CENTER и нажмите OK. Перейдите в меню ВЫБРАТЬ> ВЫБРАТЬ , чтобы деактивировать выбор. Мы увеличили буквы на два пикселя (два пикселя внутри выделения и два пикселя вне выделения), чтобы придать этому эффекту инкапсулированный вид.

Дублируйте новый слой и переименуйте его в TE SHADOW или как вам угодно. Затем переставьте слои так, чтобы слой TE SHADOW располагался ниже слоя TE PLASTIC .

Выберите слой TE PLASIC .Перейдите в меню СТИЛИ СЛОЯ и выберите ЦВЕТ НАДПИСИ . Используйте светло-серый цвет, чтобы имитировать отражение окружающей среды на белых буквах.

Теперь добавьте BEVEL AND EMBOSS , используя настройки, показанные на изображении ниже. Обратите внимание на то, что блики белые или почти белые, а остальная часть тела буквы — светло-серая, но буквы по-прежнему выглядят чисто белыми. Если бы мы закрасили буквы в чистый белый цвет, а не в светло-серый, объем букв был бы незаметен, что привело бы к плоскому мутному освещению.

Перейдите в окно КОНТУР , расположенное прямо под флажком BEVEL AND EMBOSS , и скопируйте настройки, показанные на изображении ниже. Стиль слоя CONTOUR очень полезен для точной настройки бликов.

Последний шаг — добавить небольшой стиль слоя INNER SHADOW . Это добавит эффекту немного больше объема.

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

Создание инкапсулированного эффекта

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

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

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

Узнайте, как замаскировать пластиковые буквы на следующем шаге

Начнем с процесса маскировки. Сначала щелкните значок с хромированным текстом СЛОЙ ВИДИМОСТИ , чтобы он снова стал видимым, и выберите слой TE SHADOW .

С помощью инструмента RECTANGULAR MARQUEE выделите верхнюю половину букв и перейдите в меню EDIT> CLEAR.

Перейдите в меню ВЫБРАТЬ> ВЫБРАТЬ , чтобы деактивировать выбор.

На предыдущем шаге слой TE SHADOW был обрезан наполовину. Теперь давайте воспользуемся этим слоем для создания маски для окончательного эффекта: выберите слой TE PLASTIC и перейдите в меню СЛОЙ> СОЗДАТЬ МАСКУ ДЛЯ ОБРЕЗКИ.

Пластиковый текст замаскирован с помощью слоя TE SHADOW .

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

Выберите слой TE SHADOW . Перейдите в окно стиля слоя DROP SHADOW и установите параметры, показанные на изображении ниже:

Давайте добавим несколько штрихов к этому эффекту.Крошечный скос сделает этот эффект более реалистичным.

Добавьте новый слой и назовите его TINY BEVEL или как хотите.

Установите ЦВЕТ ФОНА на белый. Затем выберите инструмент КАРАНДАШ и кончиком в 1 пиксель нарисуйте линию на верхней границе пластикового текста:

С помощью КИСТИ вы можете нарисовать небольшой блик в нижней части буквы E:

.

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

Другие примеры, созданные с этим эффектом.

Деформация текста для соответствия формам с помощью Illustrator

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

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

1. Теперь для нашего руководства мы интегрируем текст в форму сердца.Это напоминает прошлые ностальгические эпохи, когда искаженный текст и типографское искусство были в моде. Итак, первый шаг — создать наше Сердце. Используя инструмент «Перо» (ярлык P), нарисуйте свое сердце на артборде. Для этого вам, вероятно, понадобятся 3 точки привязки сверху, по одной с обеих сторон и одна снизу. Раскрасьте его так, как хотите. Просто посмотрите на изображение ниже.

2. Сделайте резервную копию своего сердца, нажав CTRL + C и CTRL + V на клавиатуре. Скройте и заблокируйте это в палитре слоев для использования позже.

3. Затем, используя Pen Tool, мы разделим наше сердце. Сначала убедитесь, что вы установили для заливки нулевую заливку, а для обводки установили толщину 5 пунктов белого цвета. Затем начертите две линии (с небольшим изгибом, если хотите) через сердце. Убедитесь, что концы выходят за форму сердца.

4. После этого используйте инструмент выбора, чтобы выбрать обе линии, которые вы создали. Затем перейдите в Object -> Path -> Outline Stroke.

5.После этого выделите все свои формы на артборде, просто перетащив их, выделив все формы. Затем перейдите в окно поиска пути и найдите параметр «Минус передний». Это должно разрезать сердце на три части.

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

7. Теперь мы готовы ввести текст. Просто используйте текстовый инструмент и просто введите текст, который вы хотите вписать в сердце.Если возможно, используйте необычный креативный шрифт. В нашем примере мы поместим одно слово поверх сердца, а другое — ниже.

8. Сначала переместите верхний текст на задний план, щелкнув его правой кнопкой мыши, чтобы вызвать контекстное меню и выбрав Упорядочить -> На задний план.

9. Затем с выделенным текстом и верхней формой сердца перейдите в Object -> Envelope Distort -> Make with Top Object.

10. Отлично! Теперь вы можете видеть, что мы исказили текст в форме верхнего сердца.

11. Продублируйте процесс для нижнего текста и средней формы сердца.

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

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

14. Вы также можете попробовать добавить в текст градиентные цвета.