Создание реалистичной надписи мелом в смешанной технике. Реалистичная надпись мелом на зелёной доске

Создание реалистичной надписи мелом в смешанной технике. Реалистичная надпись мелом на зелёной доске
Создание реалистичной надписи мелом в смешанной технике. Реалистичная надпись мелом на зелёной доске

В этом уроке Фотошоп показано, как создать зелёную доску и надписи на ней, сделанные мелом.

Шаг 1

Создайте новый документ в Фотошопе (Ctrl + N) размером 1000х609 пикселей. Сперва создадим фон для доски. Создайте новый слой (Ctrl + Shift + N) . Выберите инструмент Градиент (Gradient Tool) (G) : Стиль (Style) – Радиальный (Radial). Настройте градиент, как показано ниже.

Сделайте заливку холста, чтобы получить такой результат:

Шаг 2

Добавим шум, чтобы доска вы выглядела слишком гладкой. На слое с градиентной заливкой перейдите в меню Фильтр – Шум – Добавить шум (Filter – Noise – Add Noise) , используйте следующие параметры:

Количество (Amount): 1,6%
Распределение (Distribution): По гауссу (Gaussian)

Результат:

Шаг 3

Следующие несколько шагов будут посвящены созданию деревянной рамке вокруг доски. Чтобы воссоздать текстуру дерева, я решил использовать фильтр Волокна (Fibers) . Я не мог найти функцию поворота в настройках фильтра, поэтому решил создавать каждую часть рамки в отдельном документе и потом всё перенести.
Начнём с создания верхней части рамки. Создайте новый документ (Ctrl + N) высотой равной ширине первого документа. Ширина холста зависит от того, насколько толстой Вы хотите получить рамку. Размер моего первого холста был 1000х609 пикселей. Поэтому второй холст я создал размером 45х1000 пикселей. Установите цвет заливки на светло-серый, а цвет фона на тёмно-серый. Затем примените фильтр Волокна (Фильтр – Рендеринг – Волокна) (Filter – Render – Fibers) . Настройте фильтр так:

Отклонение (Variance): 3
Интенсивность (Strength): 21

Результат:

Шаг 4

Нужно придать текстуре цвет дерева. Перейдите к коррекции Цветовой тон/Насыщенность (Изображение – Коррекции – Цветовой тон/Насыщенность) (Image – Adjustments – Hue/Saturation) . Установите галочку Тонировать (Colorize) и введите следующие значения:

Тон (Hue): 19
Насыщенность (Saturation): 33
Яркость (Brightness): -20

Шаг 5

Добавьте шума к текстуре при помощи фильтра (Фильтр – Шум – Добавить шум) (Filter – Noise – Add Noise) : Количество (Amount) – 1%. Чтобы перетащить часть рамки, используйте инструмент Перемещение (Move Tool) (V) . Расположите деревянную полоску в верхней части холста.

Шаг 6

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

Шаг 7

Выберите все слои деревянной рамки в палитре слоёв. Кликните правой кнопкой на любом из них и выберите пункт Объединить слои (Merge Layers) . Затем кликните дважды на полученном слое, чтобы открыть окно стилей. Примените следующие стили:

Отбрасывание тени (Drop Shadow):

Режим наложения (Blend Mode): Умножение (Multiply); Цвет (Color): Черный
Непрозрачность (Opacity): 75%
Угол (Angle): -39; Глобальное освещение (Use Global Light): Включено
Смещение (Distance): 11 пикселей
Размах (Spread): 0%
Размер (Size): 29 пикселей
Контур (Contour): Линейный (Linear); Сглаживание (Anti-aliased): Выключено
Шум (Noise): 0%

Внутреннее свечение (Inner Glow):

Режим наложения (Blend Mode): Осветление (Screen)
Непрозрачность (Opacity): 12%
Шум (Noise): 0%
Цвет (Color): Белый
Метод (Technique): Мягкий (Softer)
Источник (Source): На краях (Edge)
Стягивание (Choke): 0%
Размер (Size): 5 пикселей



Шаг 8

Мы закончили работать над рамкой, теперь займёмся поверхностью доски. Её нужно сделать немного гранжевой и добавить текстуру. Загрузите этот набор гранжевых кистей и импортируйте их в Фотошоп. Создайте новый слой (Ctrl + Shift + N) между фоновым и слоем с рамкой. Инструментом Пипетка (Eyedropper Tool) (I) определите наиболее тёмный оттенок зелёного и обрисуйте зелёную область, как показано ниже. Понизьте Непрозрачность (Opacity) этого слоя до 40%.



Шаг 9

Добавим больше оттенков на поверхность доски. Создайте новый слой над слоем с гранжевыми кистями. Установите цвета по умолчанию (D) и примените фильтр Облака (Фильтр – Рендеринг – Облака) (Filter – Render – Clouds) . Затем примените фильтр Размытие в движении (Фильтр - Размытие - Размытие в движении) (Filter - Blur - Motion Blur) с такими параметрами:

Угол (Angle): 18 градусов
Смещение (Distance): 100 пикселей

Установите Режим наложения (Blending Mode) этого слоя на Умножение (Multiply) и понизьте Непрозрачность (Opacity) до 30%.

Шаг 10

В этом шаге мы займёмся созданием старых следов от постоянного стирания надписей губкой. Создайте новый слой поверх слоя из предыдущего шага. Выберите инструмент Кисть (Brush Tool) (B) , и выберите кисть «Watercolor Loaded Wet Flat Tip».

Понизьте Непрозрачность (Opacity) кисти до 30% и чёрным цветом сделайте несколько мазков на зелёной поверхности. Некоторые участки нужно обрисовать 2-3 раза, чтобы они были темнее других.

Установите Непрозрачность (Opacity) этого слоя на 10%.

Шаг 11

Создайте ещё один слой и повторите процесс, но на этот раз используйте белую кисть, а Непрозрачность (Opacity) слоя – 5%. Вы должны закончить с таким результатом:

Шаг 12

Найдите красивый рукописный шрифт и напишите на доске что-нибудь инструментом Горизонтальный текст (Horizontal Type Tool) (T) . Я, например, использовал шрифт «Christopher Hand ». Понизьте Непрозрачность (Opacity) слоя с надписями до 10%. Получатся оставшиеся следы от мела, которые не были хорошо стёрты.

Шаг 13

Теперь мы добавим нормальные надписи на доске. Напишите что-нибудь и установите Непрозрачность (Opacity) текста на 70%. Затем выберите одну из этих кистей. К текстовому слою добавьте пиксельную маску (Слой – Слой-маска – Показать все) (Layer – Layer Mask – Reveal All) . Чёрным цветом обрисуйте надписи, чтобы зелёная поверхность была немного видна сквозь них. Это поможет создать реалистичный вид, вид мел оставляет после себя неоднородный след.



Шаг 14

Я решил, что доске не помешает объёмность и перспектива. Добавьте в нижнюю часть доски небольшую полочку, на которой будет лежать мел. Используйте метод, описанный ранее, и не забудьте о применении стилей и Внешнее свечение (Outer Glow) .

Шаг 15

В этом шаге мы будем создавать губку для стирания мела. Выберите инструмент и в настройках установите Радиус (Radius) на 1 пиксель. Создайте фигуру и расположите её на полочке, созданной в предыдущем шаге. Преобразуйте этот прямоугольник в смарт-объект (Слой – Смарт-объект – Преобразовать в смарт-объект) (Layer – Smart Object – Convert to Smart Object) . Работа со смарт-объектом всегда удобнее, так как Вы сможете изменить настройки применённых фильтров или вовсе удалить их.
Установите цвета по умолчанию (D) и примените фильтр Облака с наложением (Фильтр – Рендеринг – Облака с наложением) (Filter – Render – Difference Clouds) .

Шаг 16

Губке всё ещё не хватает освещения и текстуры. Добавим ещё пару фильтров. Сначала примените фильтр Аэрограф (Фильтр – Штрихи – Аэрограф) (Filter – Brush Strokes – Sprayed Strokes) .

Длина штриха (Stroke Length): 20
Радиус разбрызгивания (Spray Radius): 25
Направление штрихов (Stroke Direction): Вертикально (Vertical)

Количество (Amount): 1,96%
Распределение (Distribution): Равномерно (Uniform)
Монохромный (Monochromatic): Включено

Результат:

Шаг 17

Теперь поработаем над верхней частью губки. Инструментом Прямоугольник с закруглёнными углами (Rounded Rectangle Tool) (U) создайте тёмно-серую фигуру над основанием губки, преобразуйте её в смарт-объект и примените фильтр шума.

Шаг 18

К обоим слоям губки примените стиль Отбрасывание тени (Drop Shadow) .

Шаг 19

В завершении добавьте пару кусочков мела.

В Фотошопе. Инструментом Crop Tool (C) обрежьте изображение, чтобы избавиться от закругленных углов и чёрного фона.

Перейдите к коррекции Levels (Image ? Adjustments ? Levels) и измените значения, как показано ниже. Это сделает поверхность доски темнее.

Шаг 2

Загрузите в общую библиотеку шрифт «Blokletters », перейдите в меню Window ? Character и настройте шрифт, как показано ниже. Напишите «Back to School» на доске. Надпись должна состоять из двух слоёв. Смотрите на второй скриншот ниже.

Шаг 3

Выберите инструмент Brush Tool (B), откройте палитру кистей (Window ? Brush) и настройте, как показано ниже.

Шаг 4

Скройте текстовые слои, кликнув на иконке глаза.

Кликните правой кнопкой на текстовом слое и выберите пункт Create Work Path.

Выберите инструмент Direct Selection Tool, установите основной цвет на белый и создайте новый слой поверх остальных. Назовите его «Chalk».

Кликните правой кнопкой мыши на контуре и выберите пункт Stroke Path.

В появившемся окне выберите Brush. Это значит, что контур будет обведён кистью, которую мы настроили ранее.

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

Шаг 5

Для обводки каждой буквы нужно создавать контур и выделять его инструментом Direct Selection Tool.

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

Я использовал следующие цвета:

S - #f5989d

c - #fff799

h - #bd8cbf

o - #fdbd89

o - #79bcde

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

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

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

Конвертируйте текст в кривые при помощи комбинации клавиш CMD/Ctrl+Shift+O, затем кликните правой кнопкой по тексту и выберите Ungroup/Разгруппировать, чтобы разделить надпись на отдельные буквы.

Растяните выделение поверх каждого слова или группы слов и нажимайте CMD/Ctrl+G, чтобы сгруппировать их.

Выделите первую группу слов и в меню выберите Effect > Distort & Transform > Free Distort/Эффект>Исказить и трансформировать>Произвольное искажение. Поднимите нижнюю правую точку выше, чтобы исказить группу текста.

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

Возьмемся за следующую группу из нашего текста. Выделите ее и в меню выберите Object > Transform > Shear/Объект>Трансформировать>Наклон. Укажите угол, совпадающий с углом скоса предыдущей группы.

Нарисуйте тонкий прямоугольник под текстом и примените к нему трансформацию Shear/Наклон, повторив угол наклона текста. Дублируйте прямоугольник и обрамите им вторую группу текста. Инструментом Pen/Перо нарисуйте треугольник, чтобы заполнить пустое пространство в правом верхнем углу.

Выделите третью группу текста и в меню выберите Effect > Apply Free Distort/Эффект>Применить произвольное искажение, чтобы применить эффект с теми же параметрами, что мы выбрали ранее.

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

Откройте палитру Appearance/Оформление и кликните по по эффекту Free Distort/Произвольное искажение. Переместите верхнюю левую точку так, чтобы создать параллель прямоугольнику. Затем переместите нижнюю правую точку обратно на оригинальную позицию.

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

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

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

Нарисуйте прямоугольник вокруг работы. Укажите ему отсутствие заливки и обводку в 7pt. Копируйте (CMD/Ctrl+C) прямоугольник, затем вставьте копию на передний план (CMD/Ctrl+F). Удерживая ALT, масштабируйте копию, сделав ее меньше. Снизьте толщину обводки до 2pt.

Выделите одно из самых больших слов, копируйте его (CMD/Ctrl+C), затем укажите объекту тонкую белую обводку с закругленными углами и выравнивание внутрь.

В меню выберите Object > Expand Appearance/Объект>Разобрать оформление, затем кликните по группе правой кнопкой и выберите Ungroup/Рагруппировать, чтобы разбить группу на отдельные символы.

Поочередно выделяйте каждую букву и нажимайте кнопку Minus Front/Минус в палитре Pathfinder/Обработка контура. После этого у вас должны остаться только внутренние части букв.

Сгруппируйте все что осталось, смените для них цвет обводки на белый, затем нажмите CMD/Ctrl+B, чтобы вставить на задний план ранее скопированный текст.

Где-нибудь в документе нарисуйте маленький черный квадрат. Нажмите CMD/Ctrl+C и CMD/Ctrl+F, чтобы создать копию, затем уменьшите копию в половину оригинала (включите Smart Guides/Быстрые направляющие, чтобы сделать все точно). Укажите меньшей фигуре белый цвет заливки, выделите оба объекта и перетащите их в палитру Swatches/Образцы.

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

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

Выделите все элементы типографики, сгруппируйте их и снизьте opacity/непрозрачность примерно до 15%.

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

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

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

Откройте отсканированную работу в Adobe Photoshop и в меню выберите Image > Adjustments > Invert/Изображение>Коррекция >Инвертировать. После этого выберите в меню Image > Adjustments > Desaturate/Изображение>Коррекция>Обесцветить, чтобы убрать цветность из работы.

В меню выберите Image > Adjustments > Levels/Изображение>Коррекция>Уровни и переместите бегунок светлых оттенков к началу гистограммы.

Шаг 1

Откройте Adobe Illustrator и инструментом Горизонтальный текст ( ",this,event,"320px");">Horizontal Type Tool) (T) напишите «2013». Я использовал шрифт «Pistilli Roman ».

Шаг 2

Из этого набора выберите завитки и создайте орнамент вокруг цифр.





Шаг 3

Создайте новый документ в Фотошопе (Ctrl + N) размером 2880х1800 пикселей. Вставьте в него изображение чёрной доски.

Шаг 4

Перенесите орнамент в этот документ. Затем создайте слой и залейте его чёрным цветом. Объедините оба слоя (Ctrl + E).

Шаг 5

Установите Режим наложения на Светлее (Lighter Color).

Шаг 6

К слою надписи примените фильтр Наклонные штрихи (Angled Strokes):

Баланс направлений (Direction Balance)
Длина штриха (Stroke Length)
Резкость (Sharpeness)

Шаг 7

Добавьте маску и чёрной кистью с непрозрачностью 30% обрисуйте надпись.

Шаг 8

К надписи примените следующие стили:

Внешнее свечение: Режим – Осветление.

Отбрасывание тени: Режим – Светлее.

Шаг 9

Установите Режим наложения слоя надписи на Растворение (Dissolve).

Шаг 10

Создайте копию всех слоёв. Объедините их (Ctrl + E) и примените фильтр Размытие по Гауссу ( ",this,event,"320px");">Gaussian Blur Filter) со значением 5 пикселей. Установите Режим наложения на Мягкий свет ( ",this,event,"320px");">Blending Mode – Soft Light) и понизьте непрозрачность до 50%. Создайте ещё одну копию надписи и установите её Режим наложения на Осветление (