Как создать Геометрический, Векторный WPAP Портрет в Adobe Illustrator. Рисуем в фотошоп портрет в векторном стиле

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

C фотошопом я познакомилась еще в 2008 году .

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

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

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

Я использую версию СС (Creative Clouds) в англоязычной раскладке.

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

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

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

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

Иллюстрации по фото сейчас приобретают огромную популярность. Портреты в стиле ГТА, в стиле аниме, обработка поп-арт, в стиле гранж, мурчиано, и прочее. Многие хотят украсить своим рисованным изображением страничку в соцсетях или поставить в качестве аватарки для группы. А еще это отличный подарок для друзей или близких. Попробуйте, не исключено, вас увлечет эта тема, и в вас проснется настоящий художник!

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

Хочу предупредить, урок этот не для новичков. Предполагается, что такие понятия, как «режим наложения», «размытие по гауссу», «понизить прозрачность» и «мягкая круглая кисть» не вызывают у вас приступов паники.

ДЛЯ НАЧАЛА РАЗБЕРЕМСЯ С МАТЧАСТЬЮ.

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

Что такое векторный портрет?

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

Что такое "Перо" и как оно работает?

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

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

Инструмент "Перо" имеет свою отдельную палитру, которая так и называется Paths (Контуры). Как только вы начинаете что-то рисовать пером, в палитре автоматически создается временный слой, под названием Work Path. Именно в этом слое отражаются все действия, которые вы производите с инструментом. Слои с контурами в палитре Paths можно выделять, дублировать, переименовывать – точно также, как в палитре Layers (Слои).

Прежде чем рисовать портрет,

нужно потренироваться производить 2 операции с контурами.

1) Обводка контура векторной фигуры фоновым цветом.

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


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

Правой кнопкой мыши щелкаем по нарисованной нами фигуре. Выбираем из выпадающего меню Stroke path (Обводка контура).


Ставим галочку Simulate pressure (Имитировать нажим кисти).


Контур превращается вот в такую линию, широкую посредине и сужающуюся на концах. У меня был выбран коричневый цвет, поэтому линия окрашивается коричневым.


Рабочий слой с этой загогулиной создан в палитре контуров (Paths).


Его можно удалить, нарисованная линия остается в палитре слоев (Layers).


2) Заливка векторной фигуры фоновым цветом.

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


Чтобы закрасить нарисованную нами фигуру каким-либо цветом, нужно нажать кнопку Fill path with foreground color (Залить фоновым цветом).Она находится на палитре Paths внизу слева и выглядит как белый кружок.


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


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


Вот и вся премудрость.

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

НА ЭТОМ СО СКУЧНОЙ ТЕОРИЕЙ ЗАКАНЧИВАЕМ, ПЕРЕХОДИМ К ПРАКТИКЕ.

Специально для этого отзыва я нарисовала портрет по одной из своих старых фотографий.

Для рисунка стоит брать фотки хорошего качества, с отличным освещением. Я выбрала эту.

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

Для этого заходим во вкладку Image - Adjustments - Posterize (Изображение - Коррекция - Постеризовать). Подвигайте ползунок так, чтобы на фото явственно обозначились света, полутени и тени. Можно размыть изображение Filters - Blur - Gaussian blur (Размытие по гауссу), чтобы сгладить неровности.


ВАЖНО! Каждую деталь своего будущего портрета я создаю на новом прозрачном слое. Это позволяет в любой момент внести коррективы.

Итак, создаем первый слой, назовем его «Контур головы».

Заливаем его бежево-розовым цветом, похожим на оттенок нашей кожи.

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

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


На новом слое прорисовываем отдельные выбившиеся из прически волоски, чтобы волосы выглядели естественно. Рисуем произвольные линии, которые обводим тем же цветом, что и вся прическа (Stroke path). Для получения незамкнутого контура нужно щелкнуть на свободном пространстве с зажатым Сtrl.


Теперь начинается самое интересное.

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

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

Вначале создаем новый пустой слой, назовем его «Cредние тона». Обводим перышком все пятна, которые создают среднюю тень. Это глазницы, боковые части лица, часть щеки. Заливаем цветом. Я выбрала вот такой – серо-бежевый. Поскольку источник освещения во время фотографирования находился справа, левая щека у меня получилась более темной. Значит, тень в этом месте будет более широкой.

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

Следующий слой – «Блики». У меня это световое пятно на лбу и на носу.


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

Потом тем же макаром прорисовываем светотеневой рисунок на волосах .

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


Абсолютно тот же алгоритм для рисования губ и носа .

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


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

  • понизить прозрачность слоя (вкладка Opaсity (Прозрачность);
  • изменить цвет слоя с помощью стиля слоя Color overlay (Наложение цвета). Для этого нужно дважды щелкнуть по иконке слоя, и выбрать в меню соответствующий пункт. Цвет набираете пипеткой, щелкая по слою с вашим изображением, которое служит у нас черновиком-трафаретом.

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


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

На глазах я остановлюсь более подробно.

Глаза – зеркало души, самая важная часть портрета, которая первым делом приковывает к себе внимание. Некрасиво, когда глаза выглядят как голубые или коричневые кружкИ (а этим часто грешат новички, рисующие портреты по фото). Поэтому мы должны придать им глубину и объем с помощью нескольких слоев и совмещения режимов наложения.

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


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


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


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


Теперь фокус-покус. Слой с белыми и рыжими пятнами переводим в режим наложения Soft light (Мягкий свет). Глаза обретают ту самую глубину и объем. Можно несколько раз продублировать слои с пятнышками, чтобы свечение было более ярким и более мягким. Для уменьшения эффекта просто понижайте прозрачность слоя.

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


Но ресниц-то у нас пока и нет! Не беда, нарисуем! Я не стала возиться, и скачала готовый набор кистей из инета. Девушки, не вздумайте использовать их для придания густоты ресницам на своих фотографиях – готовые кисти-ресницы выглядит неестественно! Но для портрета пойдет.


Наш портрет почти готов.

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

Для этого создаем тени под нижней губой и на носу. Сразу оговорюсь, не нужно рисовать их черным цветом! Это выглядит очень грубо. Так, на крыльях носа тень будет розовая (потому что там падает отсвет от щек), а тень под губой – бордовая (рефлекс от малиновой помады). На прозрачном слое максимально мягкой кисточкой рисуем тень соответствующего оттенка, потом переводим в режим наложения Soft light или Multiply и понижаем прозрачность до 10-15 процентов. Вуаля!

Теперь осталось только разобраться с задним фоном.

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

Инструментом "Эллипс" рисуем круг, помещаем поверх него выбранный рисунок, и прикрепляем его к фигуре с помощью Cliping mack (с зажатым Alt кликнуть между слоями).

Для пущего праздничного антуражу я кинула на волосы блестки (которые тоже скачала из инета). Готово!


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

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

Ну и в скобках сообщаю, стоимость такой работы составляет около 2х тысяч рублей. Сравним два изображения - можно заодно и оценить сходство

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

Ресурсы:

Конечный результат:

Шаг 1

Для своих работ лучше делать снимки своих родных или друзей. Это самый простой способ получить нужную позу. Я буду использовать фотографию своей сестры (Photo.png).

Создайте новый документ (Ctrl + N) формата А4 в портретном режиме. Вставьте фотографию в этот документ и удалите фон, например, инструментом Ластик (Eraser Tool) (E). В качестве фона на нашем рисунке можно использовать какой-нибудь узор.

Шаг 2

Мы создадим векторный портрет посредством наложения нескольких блоков кожи, линий и прочих деталей. Создайте новый слой (Ctrl + Shift + N) и назовите его «Skin». Для основы кожи выберите цвет #FAE0AF. Инструментом Перо (Pen Tool) (P) нарисуйте контур по краю силуэта девушки.

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

Шаг 3

Создайте новый слой «Skin lines» и выберите тёмно-коричневый цвет в качестве основного. Выберите инструмент Кисть (Brush Tool) (B) и установите размер на 3 пикселя. Мы воспользуемся контуром слоя «Skin» для создания всех линий на теле и черт лица. В палитре контуров кликните на иконке Выполнить обводку контура кистью (Stroke path with brush). Эта иконка находится справа от иконки заполнения.

Используя инструмент Перо (Pen Tool) (P) и функцию обводки контура кистью нарисуйте губы, нос, глаза, челюсть, брови, и другие черты лица. Чтобы линии обводки были тоньше, нужно понизить размер кисти. Инструментом Ластик (Eraser Tool) (E) с жёсткими краями подотрите лишние участки линий.

Шаг 4

Инструментом Перо (Pen Tool) (P) нарисуйте волосы и залейте их чёрным цветом. Для создания отдельных локонов, используйте более тонкую кисть.

Шаг 5

Создайте новый слой под слоем «Skin line». Нарисуйте губы и глаза. Затем понизьте непрозрачность кисти и нарисуйте веснушки.

Шаг 6

Создайте новый слой поверх остальных и назовите его «Wear». Инструментом Перо (Pen Tool) (P) нарисуйте майку девушки цветом #E31F40. Линии для майки создайте на отдельном слое «Wear line». Для линий нужно заранее настроить кисть: задайте ей белый цвет и размер в несколько пикселей.

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

Шаг 7

Перейдите на слой «Skin», затем нажмите Ctrl + Shift + N, чтобы открыть меню создания нового слоя. Установите галочку на функции Использовать предыдущий слой для создания обтравочной маски (Using Previous Layer to Create Clipping Mask), назовите слой «Skin Shadow» и установите Режим наложения на Умножение (Multiply). Нажмите ОК и в палитре слоёв появится новый слой. Он будет ограничен пределами тела. На нём мы и нарисуем тени.

Выберите тот цвет, что имеет кожа тела. Нарисуйте векторные тени при помощи инструмента Перо (Pen Tool) (P). Расположите источник света в том же месте, где он находится на оригинальной фотографии. Я работал со светом, исходящим справа.

Шаг 8

Создайте новый слой «Wear Shadow» и создайте тёмные участки майки. Если они покажутся Вам слишком тёмными, Вы можете понизить Непрозрачность (Opacity) слоя.

Шаг 9

Из извлеките все файлы. Откройте файл «Logo.png» в Фотошопе в отдельном документе. Инструментом Перемещение (Move Tool) (V) перенесите его в основной документ и поместите под слой «Wear Shadow». Для логотипа автоматически будет создана обтравочная маска.

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

Шаг 10

Над слоем «Wear line» создайте новый слой и инструментом Перо (Pen Tool) (P) нарисуйте светлые участки майки и тела. Используйте оригинальную фотографию для определения источника света, как мы делали это при создании теней. Установите Непрозрачность (Opacity) этого слоя на 40%.

Шаг 11

Вставьте татуировки в наш документ и расположите их на теле девушки над слоем «Wear». Установите Режим наложения татуировок на Умножение (Multiply). Инструментом Ластик (Eraser Tool) (E) сотрите участки татуировок, которые выходят за пределы тела.

Шаг 12

Создайте копию слоя «Body» (Ctrl + J). Выберите оригинальный слой и перейдите к коррекции Цветовой тон/Насыщенность (Изображение > Коррекции > Цветовой тон/Насыщенность) (Image > Adjustments > Hue/Saturation). Понизьте Яркость (Lightness) до -100, чтобы превратить тело девушки в чёрный силуэт.

На слое с чёрным силуэтом активируйте инструмент Свободное трансформирование (Ctrl + T), кликните правой кнопкой мыши и выберите режим Искажение (Distort). Измените форму тени так, чтобы она падала на заднюю стену. Нажмите Enter, чтобы применить изменения. После этого примените фильтр Размытие по Гауссу (Фильтр > Размытие > Размытие по Гауссу) (Filter > Blur > Gaussian Blur) со значением 35 пикселей. Понизьте Непрозрачность (opacity) этого слоя до 20%.

Примечание: Если коррекция Цветовой тон/Насыщенность ( Hue/Saturation) не будет открываться, то, скорее всего, Вам нужно растрировать слой.

Шаг 13

Создайте новый слой с непрозрачностью 40% поверх остальных. Выберите инструмент Градиент (Gradient Tool) (G) и залейте холст обычным чёрно-белым градиентом слева направо (белый цвет должен быть справа). В результате у нас получится натуральное освещение.

Шаг 14

Над слоем с чёрно-белым градиентом создайте ещё один слой и сделайте градиентную заливку от красного к жёлтому, чтобы создать тёплую цветовую атмосферу. Понизьте непрозрачность слоя до 35%.

Шаг 15

Поверх всех слоёв создайте корректирующий слой Цветовой тон/Насыщенность (Hue/Saturation). Понизьте параметр Насыщенность (Saturation) до -18%.

What You"ll Be Creating

Этот учебник был первоначально опубликован в ноябре 2012 года как учебник Tuts + премиум. Теперь он доступен бесплатно для просмотра. Хотя в этом учебнике не используется последняя версия Adobe Illustrator, методы описанные здесь и процесс по-прежнему актуальны.

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

Чтобы создать замечательные портреты, рассмотрите одну из наших удивительных Кистей волос для Адобе Иллюстратор от GraphicRiver . Или привлеките помощь профессионала по дизайну, чтобы получить собственные портреты от Envato Studio.

1. Подготовим документ

Шаг 1

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

Затем я размещаю свои слои, как показано на панели Слои ниже. В слое "BG" я разместила Прямоугольник (M) залитый белым цветом, поверх стокового изображения, с 50% Непрозрачности. Это делается для того, чтобы края моих форм были более заметными по сравнению со стоковым изображением, когда я просматриваю их.

Шаг 2

Я часто использую палитру "Оттенки кожи" по умолчанию от Адобе Иллюстратор. Вы можете отыскать ее, нажав на раскрывающееся меню в панели Образцы> Меню библиотек образцов> Оттенки кожи. Для Кавказской кожи я выбираю четыре основные палитры, чтобы я могла смешивать их, для создания нескольких тонов. Кожа - это не один цвет: различные оттенки зависят от участков поверхности лица / кожи, о которых речь пойдет позднее. Клацнув по папке слева от палитры, вы можете автоматически добавить эти цвета в панель Образцы.

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

2. Воспроизведем кожу

Шаг 1

Для начальных форм затенения кожи я воспользовалась тем самым тоном кожи как основой и обвела участки света на лице с помощью Пера (P) . Затем я создала Составной контур (Control-8) с первым набором форм и применила Обработка контуров> Минус верхний с дубликатом основной формы кожи.

Я пользуюсь одним и тем же процессом несколько раз. После этого, я применила к формам Режим наложения Умножение, Непрозрачность 10% , а затем Сгруппировала их (Control-G).

Шаг 2

Используя немного более темный тон кожи, я воспроизвожу участки тени с помощью Пера (P) . Снова, после того, как один набор создан, я добавляю его к своему Составному контуру (Control-8). Затем каждый Составной контур устанавливается в Режим наложения Умножение, Непрозрачность 10%, а затем Группируется вместе (Control-G).

Шаг 3

Как вы, возможно, заметили, формы выходят за пределы основной формы. Я скопировала базовую форму и Сгруппировала обе группы теней кожи (Control-G) , а затем создала Обтравочную маску (Control-7). Все будущие фигуры для затенения кожи будут добавлены к этой Обтравочной маске , чтобы сохранить края чистыми.

Шаг 4

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

Шаг 5

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

Вместо этого Сгруппируйте каждый набор фигур вместе (Control-G). Для каждого установите Режим наложения Осветление, Непрозрачность 15%.

Шаг 6

Есть области, в которых находятся самые глубокие тени, чем где-либо. Как правило, это участки, где кожа изгибается (веки, губы, складки носа), и еще у волос, вдоль носа, чтобы выделить его, и вокруг ноздрей. Эти формы гораздо темнее и устанавливаются в Режим наложения Умножение, Непрозрачность 15%.

Шаг 7

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

Следующий находится на плече. К этим формам применен Режим наложения Умножение, Непрозрачность 60%. Я добавила цвет к щеке над другим затенением кожи, тогда как плечо находится под затенением кожи.

Шаг 8

Чтобы изменить общую основу затенения кожи, я собираюсь добавить градиенты под созданные формы затенения кожи. Дублируйте оригинальную форму основы и сначала добавьте прозрачный радиальный градиент с градиентом света. Пользуясь инструментом Градиент (G), переместите градиенты поверх лица и плеча / руки. Они установлены на Режим наложения Осветление, Непрозрачность 30%.

Шаг 9

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

Шаг 10

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

Верхушка носа обычно более розовая. Поэтому, примените красный радиальный градиент, установленный на Режим наложения Цвет, Непрозрачность 20% , чтобы добавить намек на нос.

Чтобы сделать скулы более выделенными, добавьте затенение под ними. Я добавила больше цвета в скулы с помощью фиолетового прозрачного радиального градиента. Примените к нему Режим наложения Цвет, Непрозрачность 10%.

Шаг 11

3. Воспроизведем губы

Шаг 1

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

Затем я пользуюсь градиентами, чтобы добавить цвет к губам. Я применила розовый прозрачный радиальный градиент на трех формах, созданных для губ: один для общей формы губ, а один для верхней и нижней губ. Они перекрывают один другой в центре, чтобы помочь затемнить эту область, которая находится в тени. Затем мы применим к ним Режим наложения: Затемнение основы, Непрозрачность 40%.

Шаг 2

Я использовала коричневый прозрачный радиальный градиент, чтобы добавить тени и складки к губам. Эти формы установлены на режим Режим наложения: Затемнение основы, Непрозрачность 50%.

Из-за контраста, созданного с помощью этих фигур, я добавила дополнительное затенение к лицу с таким же градиентом. Примените к ним Режим наложения: Затемнение основы, Непрозрачность 100%.

Шаг 3

С помощью инструмента Карандаш (N) и светло-розового прозрачного радиального градиента добавьте основной свет к губам. Инструмент Карандаш (N) позволит вам добавить много форм гораздо быстрее, чем Перо (P). Затем установите эти формы на Режим наложения Перекрытие, Непрозрачность 30%.

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

Шаг 4

Я хочу, чтобы губы выглядели более розовыми, а не красно / оранжевыми, поэтому я дублирую форму, которая охватывает всю область губ, и добавляю синий прозрачный радиальный градиент. Установите их в Режим наложения Рассеянный свет, Непрозрачность 100% . Это поможет "нейтрализовать" красный / оранжевый тон.

3. Воспроизведем глаза

Шаг 1

Пользуясь подобной теорией, я собираюсь немного "нейтрализовать" красные / оранжевые тона на глазных яблоках, используя голубой радиальный градиент. Установим для него Режим наложения Цвет и Непрозрачность 30%.

Затем я добавлю основной свет к глазному яблоку, используя градиент света для кожи, установленный на Режим наложения Осветление, Непрозрачность 40%.

Шаг 2

Я добавляю розовый оттенок к ватерлинии с помощью прозрачного розового радиального градиента, установленного на Режим наложения Цвет, Непрозрачность 100%.

Затем добавьте толстый и темный градиент в углы глаз, установленный на

Шаг 3

С помощью золотисто-коричневого цвета заливки инструментом Карандаш (N), добавьте затенение вокруг ватерлинии и углов глаз. Эти фигуры устанавливаются на Режим наложения Умножение, Непрозрачность 10%.

Затем светло-розовым цветом добавьте основной свет с помощью инструмента Карандаш (N), примените к нему Режим наложения Экран, Непрозрачность 40%.

Шаг 4

Я собираюсь применить Обтравочную маску (Control-7) для радужки. Сначала дублируйте наибольшую форму для глазного яблока. Затем создайте ровный круг инструментом Эллипс (L).

Для создания Обтравочной маски: сначала дублируйте радужку, а затем Обтравочная маска содержит эту маску радужки, с дублированной формой глазного яблока. Это даст вам одну Обтравочную маску в другой. Скоро вы увидите выгоду.

Шаг 5

Я добавлю детали к глазам с помощью панели Оформление . Я использовала для радужки средний коричневый. Первую заливку установлено на 60% Непрозрачности , а вторую, снизу на Создать параллельный контур -1 pt и 100% Непрозрачности . Это придаст радужке мягкий край.

Зрачок создается из двух темно-коричневых заливок. Для одной из них - Создать параллельный контур на -12 pt с Режимом наложения Умножение, Непрозрачность 40%. Для последующей Создать параллельный контур на -13 pt и с Режимом наложения Умножение, Непрозрачность 80%. Это опять для того, чтобы создать мягкий край.

Шаг 6

Затем дублируйте его, увеличьте с помощью инструмента Градиент (G) и снизьте к низу радужной оболочки. Это придаст небольшую тень в верхней части радужки.

Затем на дно радужки нанесите зеленый или оранжевый радиальный градиент. Это придаст золотисто-коричневый тон для глаз.

Шаг 7

Дублируйте и примените Создать параллельный контур -1 pt и залейте темно-коричневым радиальным градиентом. Далее перейдите в Эффект> Исказить и трансформировать> Зигзаг и примените показанные ниже настройки. Если бы мы не применили обе Обтравочные маски, эффект зигзага перекрывал бы веки и глаза. После этого перейдите на панель Стили графики, выберите Новый стиль графики и примените его к другому глазу, чтобы у вас были одинаковые эффекты по обеим сторонам.

Шаг 8

Пользуясь Пером (P) и темно коричневой заливкой, нарисуйте фигуры вокруг глаз и складки век. Это поможет построить основу для ресниц и определить веки. Эти фигуры установлены на Режим наложения Умножение, Непрозрачность 30%.

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

Шаг 9

Используя градиент для осветления кожи, добавьте рефлексы вдоль ватерлинии и над зрачком. Для них Режим наложения Осветление, Непрозрачность от 70% до 100%.

Шаг 10

Ресницы добавляются с помощью кисти Width Profile 1 , созданной в предыдущем уроке. Обе ресницы имеют темно-коричневый цвет обводки, но верхним нужен Режим наложения Умножение, Непрозрачность 70% , а нижним - Режим наложения Умножение, Непрозрачность 40% .

5. Воспроизведем волосы

Шаг 1

Прежде чем начать добавлять волосы, я хочу создать эскиз идеи. Для эскиза я воспользуюсь инструментом Кисть-Клякса (Shift-B). Создадим Новый слой выше и ниже основных элементов портрета, чтобы нарисовать волосы сверху и под портретом. Я решила, что в этом случае, я собираюсь заполнить волосами все негативное пространство.

Шаг 2

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

Пользуясь инструментом Прямоугольник со скругленными углами, создайте форму и примените инструмент Прямое выделение (A) , чтобы выделить конечные точки формы. Затем воспользуйтесь инструментом Свободное трансформирование (E), чтобы уменьшить размер формы в конце, для создания конического эффекта. Я хочу добавить к портрету массу зеленых волос.

Шаг 3

Поскольку мы не можем включить градиент или Обтравочную маску в Художественную кисть, я собираюсь создать градиентный эффект с помощью Перехода. Дважды дублируйте коническую форму. Примените Свободное трансформирование (Е), чтобы уменьшить размер формы сверху. Для большей формы, установите 0% Непрозрачность. Затем создайте Переход (Control-Alt-B) с обеими формами с параметром Заданное число шагов 4 pt. Установите Режим наложения Умножение.

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

Конечный результат:

Шаг 1

Для своих работ лучше делать снимки своих родных или друзей. Это самый простой способ получить нужную позу. Я буду использовать фотографию своей сестры (Photo.png).

Создайте новый документ (Ctrl + N) формата А4 в портретном режиме. Вставьте фотографию в этот документ и удалите фон, например, инструментом Ластик (Eraser Tool) (E). В качестве фона на нашем рисунке можно использовать какой-нибудь узор.

Шаг 2

Мы создадим векторный портрет посредством наложения нескольких блоков кожи, линий и прочих деталей. Создайте новый слой (Ctrl + Shift + N) и назовите его «Skin». Для основы кожи выберите цвет #FAE0AF. Инструментом Перо (Pen Tool) (P) нарисуйте контур по краю силуэта девушки.

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

Шаг 3

Создайте новый слой «Skin lines» и выберите тёмно-коричневый цвет в качестве основного. Выберите инструмент Кисть (Brush Tool) (B) и установите размер на 3 пикселя. Мы воспользуемся контуром слоя «Skin» для создания всех линий на теле и черт лица. В палитре контуров кликните на иконке Выполнить обводку контура кистью (Stroke path with brush). Эта иконка находится справа от иконки заполнения.

Используя инструмент Перо (Pen Tool) (P) и функцию обводки контура кистью нарисуйте губы, нос, глаза, челюсть, брови, и другие черты лица. Чтобы линии обводки были тоньше, нужно понизить размер кисти. Инструментом Ластик (Eraser Tool) (E) с жёсткими краями подотрите лишние участки линий.

Шаг 4

Инструментом Перо (Pen Tool) (P) нарисуйте волосы и залейте их чёрным цветом. Для создания отдельных локонов, используйте более тонкую кисть.

Шаг 5

Создайте новый слой под слоем «Skin line». Нарисуйте губы и глаза. Затем понизьте непрозрачность кисти и нарисуйте веснушки.

Шаг 6

Создайте новый слой поверх остальных и назовите его «Wear». Инструментом Перо (Pen Tool) (P) нарисуйте майку девушки цветом #E31F40. Линии для майки создайте на отдельном слое «Wear line». Для линий нужно заранее настроить кисть: задайте ей белый цвет и размер в несколько пикселей.

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

Шаг 7

Перейдите на слой «Skin», затем нажмите Ctrl + Shift + N, чтобы открыть меню создания нового слоя. Установите галочку на функции Использовать предыдущий слой для создания обтравочной маски (Using Previous Layer to Create Clipping Mask), назовите слой «Skin Shadow» и установите Режим наложения на Умножение (Multiply). Нажмите ОК и в палитре слоёв появится новый слой. Он будет ограничен пределами тела. На нём мы и нарисуем тени.

Выберите тот цвет, что имеет кожа тела. Нарисуйте векторные тени при помощи инструмента Перо (Pen Tool) (P). Расположите источник света в том же месте, где он находится на оригинальной фотографии. Я работал со светом, исходящим справа.

Шаг 8

Создайте новый слой «Wear Shadow» и создайте тёмные участки майки. Если они покажутся Вам слишком тёмными, Вы можете понизить Непрозрачность (Opacity) слоя.

Шаг 9

Из этого архива извлеките все файлы. Откройте файл «Logo.png» в Фотошопе в отдельном документе. Инструментом Перемещение (Move Tool) (V) перенесите его в основной документ и поместите под слой «Wear Shadow». Для логотипа автоматически будет создана обтравочная маска.

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

Шаг 10

Над слоем «Wear line» создайте новый слой и инструментом Перо (Pen Tool) (P) нарисуйте светлые участки майки и тела. Используйте оригинальную фотографию для определения источника света, как мы делали это при создании теней. Установите Непрозрачность (Opacity) этого слоя на 40%.

Шаг 11

Вставьте татуировки в наш документ и расположите их на теле девушки над слоем «Wear». Установите Режим наложения татуировок на Умножение (Multiply). Инструментом Ластик (Eraser Tool) (E) сотрите участки татуировок, которые выходят за пределы тела.

Шаг 12

Создайте копию слоя «Body» (Ctrl + J). Выберите оригинальный слой и перейдите к коррекции Цветовой тон/Насыщенность (Изображение > Коррекции > Цветовой тон/Насыщенность) (Image > Adjustments > Hue/Saturation). Понизьте Яркость (Lightness) до -100, чтобы превратить тело девушки в чёрный силуэт.

На слое с чёрным силуэтом активируйте инструмент Свободное трансформирование (Ctrl + T), кликните правой кнопкой мыши и выберите режим Искажение (Distort). Измените форму тени так, чтобы она падала на заднюю стену. Нажмите Enter, чтобы применить изменения. После этого примените фильтр Размытие по Гауссу (Фильтр > Размытие > Размытие по Гауссу) (Filter > Blur > Gaussian Blur) со значением 35 пикселей. Понизьте Непрозрачность (opacity) этого слоя до 20%.

Примечание: Если коррекция Цветовой тон/Насыщенность ( Hue/Saturation) не будет открываться, то, скорее всего, Вам нужно растрировать слой.

Шаг 13

Создайте новый слой с непрозрачностью 40% поверх остальных. Выберите инструмент Градиент (Gradient Tool) (G) и залейте холст обычным чёрно-белым градиентом слева направо (белый цвет должен быть справа). В результате у нас получится натуральное освещение.

Шаг 14

Над слоем с чёрно-белым градиентом создайте ещё один слой и сделайте градиентную заливку от красного к жёлтому, чтобы создать тёплую цветовую атмосферу. Понизьте непрозрачность слоя до 35%.

Шаг 15

Поверх всех слоёв создайте корректирующий слой Цветовой тон/Насыщенность (Hue/Saturation). Понизьте параметр Насыщенность (Saturation) до -18%.

Сегодня мы собираемся создавать в Photoshop собственный «векторный» портрет, который вы сможете легко использовать в качестве персонального аватара в Фейсбуке, Скайпе или даже на собственном сайте.
Хотя мы и будем использовать изображение с бесплатного ресурса, чтобы сделать портрет, вы можете сделать то же самое с вашим собственным фото, просто убедитесь, что это изображение в высоком разрешении и довольно большого размера, так чтобы вы могли увидеть детали, тени и различить изменения цвета. Теперь, когда вы узнали немного важной информации, запускаем Photoshop и давайте начинать.
Есть тысячи причин, по которым Photoshop является одним из наиболее предпочтительных графических программ для графических дизайнеров. Программа мощная, что позволяет создавать и манипулировать изображениями так, как вы считаете нужным, не говоря уже о различных доступных эффектах и фильтрах. Photoshop может использоваться для многих целей, которые включают создание ваших портретов. Векторные и пиксельные портреты настолько популярны, что даже есть приложения, которые быстро делают всю работу за вас. Однако вы можете сделать то же самое в Photoshop и даже создать прикольное сочетание цветов, чтобы придать своему портрету собственный уникальный вид.

Предварительный просмотр результата

Детали урока

Программа : Adobe Photoshop CS5 (версии, начиная с CS3, тоже подойдут)
Предполагаемое время выполнения : 90 минут
Уровень сложности : Средний

Источники

Шаг 1

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

Шаг 2

Создаем новый слой, чтобы начать работать с кожей. Используем цветовую пипетку, чтобы выбрать нужный оттенок кожи. В этом случае мы использовали цвет #ffe0c7.Теперь, когда нужный цвет выбран, используем инструмент Pen Tool , чтобы обвести лицо и шею, как показано здесь.

После того, как у нас есть обводка кожи, мы можем залить её цветом.

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

Шаг 3

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

Шаг 4

Еще раз создаем новый слой, на который мы нанесем основной цвет одежды. Принимайте во внимание только доминантные цвета. Например, топ будет залит цветом #3c6844

Шаг 5

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

Заливаем наш путь цветом переднего плана.

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

Шаг 6

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

Шаг 7

Создаем новый слой для зрачка и радужки. Временно скрываем слой с глазом и используем инструмент Elliptical Marquee Tool , чтобы получить радужку правильной формы.

Заливаем радужку цветом #7b7648.

Теперь заливаем зрачок цветом #000000 и блики света цветом #ffffff.

Шаг 8

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

Заливаем его и продолжаем, пока у нас не появится форма носа.

Шаг 9

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

Шаг 10

Делаем цветом переднего плана цвет #e6756d, создаем новый слой. Обводим только контур верхней губы.

Заливаем верхнюю губу нужным цветом.

Заканчиваем с губами, используя цвет #f47f78 для нижней губы.

Шаг 11

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

Заливаем отдельные тени цветом #dd8561, затем снижаем непрозрачность до 20%.

Шаг 12

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

Шаг 13

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

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

Снижаем непрозрачность до 50%.

Шаг 14

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

Снижаем непрозрачность до 50% и меняем режим слоя на Soft Light .

Шаг 15

Обводим края волос там, где вы видите необходимость большего количества теней.

Создаем новый слой и заливаем эти области цветом #4b1b11. Меняем непрозрачность слоя до 16% и режим слоя на Multiply .

Шаг 16

Меняем цвет переднего плана на #ffad95, чтобы добавить румянец на щеки. Обводим область румянца и создаем новый слой.

Заливаем фигуры и устанавливаем непрозрачность слоя 24%.

Шаг 17

Обводим контур теней на веках и создаем новый слой.

Заливаем фигуру цветом #ea98c8 и снижаем непрозрачность до 35%.

Шаг 18

Добавляем блики на кожу, обведя те области на нашей фотографии, где кожа светлее всего.

Заливаем их цветом #ffffff и снижаем непрозрачность до 20%.

Результат

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

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

Загрузка...
Top