Сделать векторный портрет по фотографии. Как перевести растровое изображение в векторное в фотошопе

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

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

Итак, поехали:

В этом уроке объясняется, каким образом создавать векторные иллюстрации используя Adobe Illustrator. Приводится объяснение ключевых параметров и инструментов, которое дополняется советами экспертов.

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

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

Данный видео-туториал является действительно ценным ресурсом, который объясняет как создавать векторную графику в Illustrator и какую роль в этом процессе играет рисование.

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

Узнайте, как создавать простые органические формы в Illustrator с этим простым для восприятия руководством от Верле Питерс (Veerle Pieters), графического и веб-дизайнера.

7. Добавление текстуры для векторных иллюстраций

Добавление текстуры - это отличный способ сделать Вашу векторную графику более выразительной, подчеркнуть ее перспективу. В этом очень доступном видео эксперт Illustrator Александра Сесилио (Alexandra Cecilio) демонстрирует как это сделать.

Этот туториал от Андрея Мариуса (Andrei Marius) поможет Вам создать векторный линейный график. Пошагово: начиная с простой сетки до направляющих линий, используя только панель Appearance (один из мощнейших инструментов в Adobe Illustrator) с добавлением некоторых простых фрагментов текста и тонкой штриховки.

Создание лиц

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

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

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

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

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

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

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

Джонатан Болл (Jonathan Ball), основатель Poked Studio, обьясняет как с помощью Illustrator основные геометрические фигуры превращаются в уникальных, красочных персонажей.

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

С помощью этого туториала Мэри Винклер (Mary Winkler) собирается показать Вам, как нарисовать чиби персонажа с нуля, используя Shape Builder Tool (Shift-M), Pen Tool (P), прозрачные градиенты, и многое другие инструменты Illustrator.

В руководстве описан процесс создания простого персонажа аниме от начала и до конца.

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

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

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

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

Ландшафт и окружающая среда

В этом уроке от векторного художника Андрея Мариуса (Andrei Marius) показано, как можно создать простой дизайн карты в Illustrator.

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

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

В этом пошаговом руководстве Вы изучите, как создать «электрический» текст в векторе.

Том Мак (Tom Mac) показывает, как в Illustrator создать портрет с drip-effect, используя инструмент Pen и кое-какие дополнительные методы.

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

За прошедшие годы винтажные иллюстрации и ретро-стиль стали вновь популярными в дизайне. В представленном уроке разработчик Бен Стирс (Ben Steers) делится своими методами, которые помогут Вам преобразовать векторные рисунки в ретро-стиль.

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

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

Полутон - способ воспроизведения монохромного изображения. Он базируется на специфике восприятия картины человеческим глазом для которого область изображения, заполненная крупными точками, ассоциируется с более темными тонами. И наоборот, область, заполненная точками меньшего размера, воспринимается как более светлая. Художник Крис Маквей (Chris McVeigh) покажет, как создать векторный полутон.

В этом учебном руководстве Вы изучите, как создать графический логотип Бэтмена, используя простые формы в Adobe Illustrator. Используются простые инструменты, вроде Ellipse Tool (L) и Shape Builder Tool (Shift + M).

36. Конвертируйте растровое изображение в векторное

Это учебное руководство Inkscape демонстрирует, как преобразовать растровое изображение в векторное при помощи функции Trace Bitmap.

Слайдер - популярный элемент веб-дизайна. В данном туториале показан вариант создания слайдера в векторе.

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

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

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

Приветствую всех. Наконец я решилась на очень важный для себя отзыв, в котором я хочу рассказать о своем добром друге, инструменте вдохновения и источнике множества творческих идей – программе 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х тысяч рублей. Сравним два изображения - можно заодно и оценить сходство

Цель Урока

В этом уроке мы научимся создавать векторный протрет в стиле Pop Art. Мы постараемся воспроизвести стиль одного из лучших представителей этого течения Роя Лихтенштейна (Roy Lichtenstein). Для создания эффекта растра и его тонкой настройки применим плагин для Adobe Illustrator - Phantasm CS . Для выполнения этого урока вы можете использовать любую фотографию, так почему бы вам не сделать собственный портрет в стиле Поп Арт?

Roy Lichtenstein (Октябрь 27, 1923 - Сентябрь 29, 1997) - один из знаменитейших американских художников, работающих в стиле Pop Art. Мы будем воспроизводить его стиль.

Шаг 1

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

Помещаем фотографию в рабочую область документа (File > Place…), затем нажимаем на кнопку Embed на верхней панели инструментов

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

Шаг 2

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

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

Шаг 3

При помощи Pen Tool (P) создаем контур шеи и волос.

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

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

Шаг 4

Приступаем к созданию глаз. Берем Pen Tool (P) и создаем контур, передающий очертания глаза и форму тени вокруг него (я залил этому форму красным цветом только для наглядности)

Создание глаз это самая ответственная работа, потому что человеческие глаза мы видим каждый день, и любая диспропорция сразу будет заметна. Я посоветую в этой работе опираться больше на свои чувства, чем на фотографию. Берем Ellipse Tool (L) и создаем окружность с заливкой голубого цвета и черной обводкой.

Эта окружность будет радужной оболочкой глаза. Берем Scissors Tool (C) и разрезаем окружность в точках A and B, после чего удаляем верхнюю часть окружности.

Теперь соединим точки A and B при помощи Pen Tool (P) как это показано на рисунке ниже.

Шаг 5

Используя ту же технику, создадим зрачок.

Берем Ellipse Tool (L) и создаем блик света на поверхности глаза.

Для создания ресниц используйте Pen Tool (P), применяя к созданным кривым треугольный профиль из палитры Stroke.

Таким же образом создаем второй глаз.

Шаг 6

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

Блик на нижней губе я создал при помощи Pen Tool (P) и применил к линии подходящий профиль из палитры Stroke.

Шаг 7

При помощи Pen Tool (P) я создал брови, ноздри, а при помощи Ellipse Tool (L) родинку на щеке.

Теперь создадим складки кожи возле глаз и носа, используя Pen Tool (P) и профили из палитры Stroke.

Создаем тени на шее.

Все элементы лица у нас готовы.

Шаг 8

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

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

Теперь группируем все линии и блокируем группу в палитре слоев. Эту группу мы будем использовать в качестве шаблона. Берем Pen Tool (P) и создаем новые линии, используя шаблон, и применяем к ним различные профили, устанавливая их ширину в палитре Stroke.

Теперь шаблон может быть удален.

Шаг 9

Характерной особенностью работ Роя Лихтенштейна является утрированная имитация растра. Имея в своем распоряжении Phantasm CS, мы легко сможем повторить этот эффект и даже немного поэкспериментировать. Копируем форму лица и шеи и вставляем их вперед (Cmd/Ctrl + C; Cmd/Ctrl + F), заливаем их бордовым цветом и объединяем в одну форму, нажав на кнопу Unite из палитры Pathfinder.

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

Шаг 10

Не снимая выделения с этого объекта, переходим Effect > Phantasm CS > Halftone…. Диалоговое окно содержит множество опций позволяющих тонко настраивать эффект.

Для имитации стиля Роя Лихтенштейна я установил Grid Angle равный 45 градусам, форма точки - circle. Параметр DPI влияет на детализацию изображения, Scale, как не трудно догадаться, на величину точек. Вы можете наблюдать за изменениями эффекта, меняя параметры в диалоговом окне, это очень удобно.

Вы, наверное, заметили, что точки выступают за контур шеи, давайте скроем этот эффект. Копируем форму бордового цвета и вставляем ее вперед (Cmd/Ctrl + C; Cmd/Ctrl + F), удаляем Halftone эффект из палитры Appearance.

Теперь выделяем обе бордовые формы и нажимаем сочетание клавиш Cmd/Ctrl + 7, создавая Clipping Mask.

Портрет в стиле Pop Art готов.

Шаг 11

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

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

При помощи Phantasm CS вы можете регулировать уровни (levels) растрового изображения прямо в Adobe Illustrator без предварительной обработки в Photoshop. Кроме того что это удобно, есть еще одно преимущество, о котором речь пойдет немного позже. Выделяем фотографию и переходим Effect > Phantasm CS > Levels…, пока оставляем параметры эффекта без изменений и нажимаем на кнопку OK в диалоговом окне.

Шаг 12

12. Теперь переходим Effect > Phantasm CS > Halftone… и устанавливаем параметры эффекта в диалоговом окне.

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

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

Шаг 13

Теперь мы можем регулировать уровни растрового изображения. Откроем палитру Appearance (Window> Appearance). Мы видим, что к нашему объекту применено два эффекта Phantasm CS , которые мы можем настраивать. Открываем диалоговое окно Phantasm CS Levels, нажав на его название в палитре Appearance, управляем слайдерами слоев, наблюдая за происходящими изменениями. Получили хороший результат, жмите на кнопку OK

Шаг 14

Скроем точки, выходящие за контур головы, используя технику создания Clipping Mask, описанную в 10 шаге.

Шаг 15

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

Выделим объект с эффектами и переходим Object > Expand Appearance

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

Шаг 16

Нам осталось только создать фон. В качестве фона мы будем использовать бумажную растровую текстуру. Такие текстуры вы сможете скачать здесь (link). Вставляем текстуру в поле документа (File > Place…) и устанавливаем для нее Multiply Blending Mode в палитре Transparency.

Работает для Вас!

Сегодня мы собираемся создавать в 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%.

Результат

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

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

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

Шаг 1.

Создаем Новый документ (New Document) формата А4 размером 1000х700 рх с разрешением 300 пикс/дюйм. Заливаем фон черным цветом (Shift+F5) .

Шаг 2.

Загружаем в Фотошоп изображение девушки. Инструментом Прямоугольное выделение (Restangular Marquee Tool) выделяем область лица, шеи и руки модели. Затем инструментом Перемещение (Move) перетаскиваем выделенную область фотографии в наш рабочий документ.

Разрешение первоначального фото достаточно большое, поэтому уменьшаем размер изображения с помощью инструмента Трансформирование (Ctrl+T) до размеров нашего холста.

Шаг 3

Далее вырезаем профиль и руку девушки с фона инструментом Перо (Pen Tool) . После закрытия контура нажимаем ПКМ (правую кнопку мыши) и в выпадающем меню выбираем опцию «Образовать выделенную область» (Select) . Инвертируем выделение (Ctrl+Shift+I) и нажимаем Delete . Фон удален. Снимаем выделение (Ctrl+D) . Вот такой результат должен получиться у вас:

Шаг 4.

Дублируем слой с девушкой (Ctrl+J) и обесцвечиваем его (Shift+Ctrl+U) . Затем идем в Фильтр-Размытие-Размытие при малой глубине резкости (Filter > Blur > Lens Blur) .

В диалоговом окне вводим следующие настройки:

Источник в Карте глубины (Depth Map) ставим на Прозрачность (Transparency) .

Форму в Диафрагме (Iris) выставляем на Шестиугольник (6), Радиус – 10, Кривизна листа – 0, Поворот – 0, Распределение (Distribution) – Равномерное (Uniform) .

Шаг 5.

После того, как вы сохранили документ, скрываем видимость этого черно-белого слоя (глазик возле иконки слоя).

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

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

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

Каждый отпечаток кисти выполняем на отдельном Новом слое (Ctrl+N) . Цвет кисти не важен, потому что потом линии примут фотографический вид.

У меня получилось 27 слоев с отпечатками кисти черного цвета.

Шаг 6.

Теперь спускаемся на самый первый слой с отпечатком кисти вниз палитры слоев. Идем в Фильтр-Искажение-Смещение (Filter > Distort > Displace) . Оставляем Масштаб по горизонтали и вертикали (Horizontal and Vertical Scale) – 10. Затем в Схеме искривления (Displacement Map) ставим – Растянуть (Stretch to Fit) , а в Неопределенных областях (Undefined Areas) обозначаем – Повторить граничные пикселы (Repeat Edge Pixels) .

После выставления всех значений нажимаем Ок (Да), и в следующем открывшемся диалоговом окне выбираем файл с вашей сохраненной Картой смещения. Кликаем по файлу и нажимаем Открыть. Фильтр применен к первому слою с узором.
Теперь аналогичное действие проделываем со всеми слоями узорных кистей. Для облегчения работы пользуемся горячими клавишами (Ctrl+F) , т.е. каждый раз, переходя на следующий слой с отпечатком кисти, нажимаете это сочетание клавиш.

Шаг 7.

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

Шаг 8

Теперь создадим Обтравочные маски (Clipping Masks) от слоев с профилем девушки к слоям-отпечаткам.

Стоя на самом верхнем слое с девушкой, зажимаем Alt, и наводим курсор между слоем с лицом и слоем-отпечатком. При появлении значка черного и белого кружка, нажимаем ЛКМ , тем самым создав Обтравку (появится стрелочка вниз от верхнего слоя к слою-отпечатку). Далее действуем по такой же схеме с остальными копиями-слоями с девушкой. Вы увидите результат лишь после завершения создания всех обтравочных масок.

Шаг 9.

Встаем на самый верхний слой с отпечатком. Двойным щелчком мыши по миниатюре слоя открываем окно Стилей слоя (Layer Style) . Вводим следующие параметры для опции «Тиснение»: глубина – 123, направление – вверх, размер – 3 рх, смягчение – 0 рх, угол – 140.

Теперь копируем этот стиль слоя на все слои с отпечатками (щелчок ПКМ по миниатюре слоя, в выпадающем меню выбираем – Скопировать стиль слоя). Встаем на слой со следующим отпечатком и опять щелкаем ПКМ , но теперь выбираем- Вклеить стиль слоя.

После того, как вы сделали тиснение на всех слоях с кистями, могут проявиться нежелательные участки, выходящие за пределы профиля девушки. Чтобы от них избавиться, выделяем оригинальный слой с моделью (зажимаем Ctrl , и кликаем по иконке слоя). Затем инвертируем выделение (Ctrl+Shift+I) , и поочередно проходимся по всем слоям-отпечаткам, нажимая клавишу Delete.

Шаг 10

И, наконец, подкорректируем наше финальное изображение. Для этого создаем Новый слой (Ctrl+N) выше фонового черного слоя. Инструментом Радиальный градиент (Radial Gradient) заполняем слой по направлению от светло-коричневого #bc8d74 к прозрачному.

Шаг 11

Скрываем видимость фонового слоя и слоя с градиентом (глазик напротив иконки слоя). Встаем на самый верхний слой с девушкой. Нажимаем сочетание клавиш Ctrl+Shift+Alt+E . Это действие объединит все видимые слои в одном слое. Теперь инструментами Осветлитель (Dodge Tool) и Затемнитель (Burn Tool) придадим немного объема изображению. Места, которые находятся ближе к нам – светлее, и, наоборот, темнее дальние участки лица.

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