Портрет из геометрических фигур в фотошопе: Полигональный дизайн. Создаём полигональный портрет в Фотошоп

Полигональный дизайн. Создаём полигональный портрет в Фотошоп

Многие из нас пускали слюни при виде этих изображений и задавались лишь одним вопросом: «Как такое сделать?». Сейчас речь пойдет о них, да-да, это те самые изображения, составленные из множества крошечных геометрических форм, которые, объединяясь, формируют абстрактное изображение. Сегодня мы откроем вам тайну: с помощью каких инструментов и действий можно добиться такого эффекта, используя приложения Illustrator и Photoshop.

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

Ну что, готовы?

Тогда вперёд!

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Откройте полученное изображение SVG в Illustrator. Вы увидите произведение искусства во всей его векторной красе!

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

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

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

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

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

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

Трудно предположить, что это прекрасное изображение создается так просто!

Полигональный портрет
или low poly — популярный арт-прием при обработке фотографий.
Сочетание Photoshop и Illustrator даст вам наиболее четкий и быстрый результат.
Если у вас нет Иллюстратора, вполне можно использовать Inkscape или Xara.
На самом деле, когда вы поймете принцип, вы сможете использовать любой инструмент.
Но автоматика вам не помощник. Ни один скрипт не даст и половины хорошего результата.
Ваш мозг, глаза и руки — вот самое главное.

Как сделать полигональный портрет в Фотошопе

Для тех, кто не ищет легкий путей — читайте дальше!

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

01. Выберите правильный образ.

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

02. Подтяните цвета и контраст.

Забросьте фото в Фотошоп, добавьте цвета и контраста. Вам нужно подобрать достаточно высокий
уровень контраста, чтобы потом проще было подбирать цвет полигонов. Однако не переборщите с
цветностью и контрастом. Не более, чем на 30%!

03. Уменьшите качество.

Если ваше фото слишком большое, уменьшите разрешение. 1000px по длинной стороне вполне
достаточно. Это поможет вам в дальнейшем подбирать цвета. Меньше пикселей — проще найти цвет.

04. Не забывайте работать на разных слоях.

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

05. Делаем цветной фон.

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

06. Пробуем линию.

Линия яркого желтого цвета будет смотреться заметно на большинстве фонов. Толщина линии —
примерно 0,5 пунктов. В Фотошопе можно использовать Полигональное Лассо.

07. Начинаем с малого.

Самый простой способ — начать с глаз. Увеличьте фото по максимуму и обведите линией.
Излишняя аккуратность вам здесь не понадобится. Просто обведите форму. Обведите части глаза
и соедините всё вместе. В итоге у вас должна получиться единая сетка.

08. Обведите другие части лица.

Отдельно нос, второй глаз. Пользуйтесь зумом для ускорения навигации по фотографии.

09. Забудьте о незаконченных линиях.

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

10. Разделите волосы.

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

11. Продолжаем.

Да, это довольно кропотливая работенка) Поэтому когда закончите всё обводить — передохните!
Следующая часть ещё тяжелее.

12. Соединяем линии.

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

13. Полигонизируем!

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

14. Баланс полигонов.

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

15. Конвертируем в Live Paint.

Поздравляю! Вы сделали всю сетку. Самая трудная часть позади. Теперь всё выделите кроме фона и
нажмите Object > Live Paint > Make. Теперь можно покрасить сетку заливкой цветом.

16. Раскрашиваем.

Увеличьте глаз фотографии и выберите цвет с помощью пипетки. Залейте треугольник цветом.
И постарайтесь не попасть банкой в линию! И изучите хоткеи, если ещё не сделали этого.

17. Убираем сетку.

После того, как завершите процесс раскраски, переведите положение цвета обводки (stroke) в
положение None. Теперь проверьте всю картинку и поищите полигоны, которые забыли раскрасить.

18. Добавьте от себя по вкусу!

Вот и всё! Теперь у вас есть офигенный полигональный портрет. Теперь вы можете его немного
кастомизировать. Придайте ему индивидуальности — отколите пару полигонов, примените другие эффекты.

Хотите больше узнать о полигональной графике? Для чего она используется? Как сделать что-то в этой технике? Да? Тогда вы настоящий дизайнер, готовый развиваться, и расти как профессионал!

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

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

Что такое полигональная графика?

Полигон
(от греч. polýgonos – многоугольный), полигональная линия (математическая), ломаная линия, составленная из конечного числа прямолинейных отрезков (звеньев). Под полигоном также понимают замкнутую ломаную линию, т. е. многоугольник.

Где используются полигоны?

Ответ очевиден – в цифровой графике, конечно же! Это своего рода разновидность цифрового искусства. Изначально полигональная графика появилась в 3D моделировании для создания видеоигр. Благодаря низкому разрешению у таких объектов была высокая скорость рендеринга. Также отображение в виде каркаса позволяет экономить ресурсы компьютера и облегчает работу с моделью. Затем уже она стала популярна и в так называемой 2D графике.

В какой программе можно создавать полигональные изображения?

Если вы работаете в 3D, то для вас будет вполне естественно делать это в 3D max, Maya, или Cinema 4D. Последнее ПО настолько дружелюбно, что в нем может рисовать даже ребенок. В целом, полигональная графика достаточно проста в создании, особенно если сравнивать с архитектурной визуализацией или фотореалистичным рендерингом. Она напоминает ранние дни компьютерного моделирования и анимации с налетом современных техник. А так как ретро стиль всегда в моде, практически все дизайнеры создают ее с помощью старых приемов.

Как вы уже знаете, 3D модели создают с помощью полигонов. Чем больше полигонов, тем более детализованной будет модель. Во время финальной обработки (рендеринга) объекта он приобретает «гладкий» вид. Чем меньше полигонов вы используете на стадии моделирования, тем более абстрактным будет результат. Для выраженного эффекта можно отключить функцию сглаживания в настройках рендеринга, и тогда вы получите четкие грани. Здесь все зависит от эффекта, которого вы хотите достичь. Использование низкополигональной техники совсем не означает, что сцена будет простой. Вы можете использовать сложные текстуры, реалистичные настройки отражений и преломлений в окружающей среде и т. д. Полигональные фигуры очень напоминают оригами и сейчас находятся на пике популярности в графическом дизайне.

Также можно создавать полигональные шедевры в таких программах как Adobe Illustrator, CorelDraw и даже Adobe Photoshop. Эти программы, в отличие от специфичных 3D пакетов, хорошо знакомы большинству дизайнеров.

Историческая справка

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

Выдающиеся примеры

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

Уроки

В этом уроке вы создадите мозаику в Adobe Illustrator, состоящую из полигонов. В этом несложном деле поможет бесплатный плагин – Scriptographer и ваше воображение.

Здесь вы научитесь создавать векторную полигональную мозаику из растрового изображения при помощи бесплатного веб инструмента Triangulator и Adobe Illustrator.

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

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

Заключение

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

По материалам сайта: www.onextrapixel.com

Векторные фигуры для фотошопа. Как нарисовать геометрические фигуры в Photoshop четырьмя способами. Google в помощь

1 голос

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

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

Рисуем сами

В Adobe Photoshop есть несколько инструментов, которые позволяют нарисовать фигуры. Вот только некоторые из них таят кое-какие секреты. Сейчас я вам о них поведаю. Итак, я Если хотите научиться делать как у меня на рисунке, то рекомендую статью , нет ничего проще, чем сделать такой же.

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

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

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

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

Эллипс зажатая кнопка Shift превращает в круг.

Также в списке есть такая фигура как многоугольник. Вы сами определяете число сторон. Вписывать можно любое значение – 3, чтобы вышел треугольник, 7, 10 и так далее.

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

Произвольная фигура

У нас осталась произвольная фигура. Что это такое?

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

Чтобы используйте сочетание клавиш Ctrl+T.

Как добавить новые

Добавить новые фигуры не составит труда. Очень много бесплатных фигур можно скачать с сайта photoshop-master.ru

. Здесь около 400 наборов с фигурами – люди, узоры, пауки, абстракция, машины, стулья, огонь, цветы и многое другое.

Покажу как их устанавливать на примере «Медиа», они мне пригодятся в будущем. Итак, скачиваю файл.

Достаточно подождать 15 секунд. Никакой предварительной регистрации не требуется.

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

Теперь откройте фигуры в программе фотошоп и нажмите на гайку в правой части. В открывшемся списке выберите «Загрузить фигуры».

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

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

Помимо фигур, вам могут пригодиться еще и кисти. Их также можно скачать на сайте Photoshop-master

.

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

Нажимаете на гайку и выбираете «Загрузить».

Поработайте с ними самостоятельно. Здесь нет ничего сложного. Они немного отличаются от фигур.

Google в помощь

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

Если вы делаете работу для себя, то в принципе, можно было бы пользоваться и Яндексом, но если проект создается в коммерческих целях, то Google очень пригодится. Откройте «Инструменты», далее «Права на использование» и выберете нужный тип – использование или использование и изменение.

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

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

Если вы хотите узнать побольше о программе, могу посоветовать вам курс «
Photoshop с нуля в видеоформате

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

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

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

На панели инструментов есть группа однородных инструментов (быстрая клавиша U
). Туда входят: прямоугольник, прямоугольник со скругленными краями, эллипс, многоугольник, линия и произвольная фигура
.

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

Что такое произвольная фигура?

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

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

Как использовать?

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

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

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

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

После этого, откройте меню фигур. Вы увидите такие 4 команды:

Выбрав «Загрузить…»
, откроется диалоговое окно, в котором нужно указать путь до файла с расширением csh,
например, так:

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

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

А если вы загрузили несколько наборов, удалили какие-либо отдельные фигуры, использовав команду «Удалить…»
, вообщем, сделали набор под себя, то можете его сохранить командой «Сохранить произвольные…»
. В будущем его можно будет загрузить в том же виде или передать кому-нибудь через интернет.

Последняя команда «Восстановить произвольные…»
позволяет все вернуть по умолчанию.

Обратите внимание, что в этом же меню есть огромный список: Животные, Стрелки, Природа, Объекты и т.д. Это стандартные наборы, которые нам любезно предоставили разработчики фотошопа.

Второй способ
установки с дополнительным преимуществом

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

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

Для этого необходимо скопировать файл с расширением csh
в системную папку фотошопа «Custom Shapes»

, обычно у нее такой адрес: C:\Program Files\Adobe\Adobe Photoshop CS5\Presets\Custom Shapes.

Заметили ошибку в тексте — выделите ее и нажмите Ctrl
+ Enter
. Спасибо!

Помощь сайту

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

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

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

Заранее благодарен, Дмитрий.

QR-код для установки:

Если Вам понравился материал, скажите свое «спасибо», поделитесь ссылками с друзьями в социальных сетях!
Спасибо!

Фигура и слой-фигура в Photoshop / Creativo.one

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

Затем, в следующем уроке, мы рассмотрим, как рисовать фигуры более сложной формы с помощью инструмента «Произвольная Фигура». Большинство людей считают, что программа Photoshop используется только для обработки изображений, и если бы вы попросили их порекомендовать вам хороший графический редактор, то в большинстве случаев ответ был бы «Adobe Illustrator».

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

Инструменты группы «Фигуры»

В программе Photoshop представлено шесть инструментов, позволяющих нарисовать фигуры, — «Прямоугольник» (Rectangle Tool), «Прямоугольник со скругленными углами» (Rounded Rectangle Tool), «Эллипс» (Ellipse Tool), «Многоугольник» (Polygon Tool), «Линия» (Line Tool) и «Произвольная фигура» (Custom Shape Tool). Они расположены в одном месте на панели инструментов.

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

Все шесть инструментов группы «Фигуры» расположены в одном месте на панели инструментов

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

Выбираем инструмент «Прямоугольник»

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

Все шесть инструментов группы «Фигуры» можно выбирать прямо на панели настроек (после того, как один из них выбран на панели инструментов)

Выбор параметра «Слой-фигура»

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

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

Для того чтобы нарисовать векторные фигуры, выберите параметр «Слой-фигура» (Shape Layers)  на панели настроек. Это первый из трех значков, расположенных ближе к левому краю (средний значок — параметр «Контур» (Paths) и правый – параметр «Заливка пикселями» Fill Pixels):

Для рисования векторных фигур выбираем параметр «Слой-фигура»

Выбор цвета для фигуры

После выбора параметра «Слой-фигура» нам нужно выбрать цвет для нашей фигуры. Мы сделаем это, нажав на значок образца цвета, расположенный справа от слова «Цвет»(Color) на панели настроек:

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

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

В цветовой палитре выбираем цвет для фигуры

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

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

Как вы уже, возможно, догадались, исходя из названия, инструмент «Прямоугольник» (Rectangle Tool) позволяет нам рисовать четырехсторонние прямоугольные фигуры. Просто кликните кнопкой мыши в окне документа для определения начальной точки фигуры и затем, удерживая кнопку мыши нажатой, протяните курсор мыши по диагонали, чтобы закончить рисовать фигуру. По мере перемещения курсора  вы будете видеть тонкие очертания будущей фигуры:

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

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

Программа заполнит фигуру цветом, как только вы отпустите кнопку мыши

Рисование фигуры от центра

Если вам нужно нарисовать прямоугольник (или другую фигуру) от центра, а не от угла, установите курсор в окне документа для определения центра будущего прямоугольника и, удерживая кнопку мыши, начните протягивать курсор и рисовать фигуру, как обычно. При этом нажмите клавишу Alt (Win) / Option (Mac) и продолжайте ее удерживать нажатой по мере перемещения курсора. Нажатие этой клавиши указывает программе на то, что фигуру требуется рисовать от центра. Этот прием работает со всеми инструментами группы «Фигура», а не только с инструментом «Прямоугольник»:

Для того чтобы нарисовать фигуру от центра, по мере перемещения курсора удерживайте нажатой клавишу Alt (Win) / Option (Mac)

Рисование квадратов

Также с помощью инструмента «Прямоугольник» мы можем рисовать квадраты. Для того чтобы нарисовать квадрат, установите курсор в окне документа и начните его протягивать, рисуя прямоугольную фигуру. Как только вы начали это делать, нажмите клавишу  Shift и продолжайте ее удерживать нажатой по мере перемещения курсора. Нажатие клавиши Shift преобразует фигуру в квадрат, независимо от того, в каком направлении вы перемещаете курсор. Вы можете также добавить нажатие клавиши Alt (Win) / Option (Mac) для того, чтобы квадрат рисовался от центра (таким образом, вы нажимаете и удерживаете нажатым сочетание клавиш Shift+Alt (Win) / Shift+Option (Mac)):

Для того чтобы нарисовать квадрат, при работе инструмента «Прямоугольник» нажмите и удержите клавишу Shift

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

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

Параметры инструментов группы «Фигуры»

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

Например, параметр «Произвольно» (Unconstrained) выбран по умолчанию, и он отвечает за обычный режим работы инструмента «Прямоугольник», позволяя нам рисовать прямоугольные фигуры любого размера и с любым соотношением сторон. Параметр «Квадрат» (Square) позволяет нам рисовать квадраты, но мы это можем сделать, просто нажав и удержав клавишу Shift по мере перемещения курсора. Параметр «От центра» (From Center)  отвечает за рисование фигуры от центра, но опять, мы это можем сделать, нажав и удержав клавишу Alt (Win) / Option (Mac):

Нажмите на маленькую стрелку, чтобы просмотреть дополнительные параметры для инструмента «Прямоугольник»

Слой-фигура

Прежде чем мы перейдем к остальным инструментам группы «Фигуры», давайте посмотрим на панель слоев. Как вы помните, в начале урока мы изучили, что для рисования векторных форм в программе Photoshop необходимо выбрать параметр «Слой-фигура» на панели настроек. И теперь после того как я нарисовал фигуру, мы можем увидеть, что на панели слоев появился слой фигуры (слой типа Shape), который программа назвала «Фигура 1» (Shape 1). Каждая новая векторная фигура, которую мы нарисуем, будет размещена на отдельном слое, который выглядит иначе, чем обычный слой, состоящий из пикселей. С левой стороны слоя находится иконка образца цвета, которая отображает текущий цвет заливки нашей фигуры, а справа от иконки цвета – миниатюра векторной маски:

Слои фигур имеют иконку образца цвета с левой стороны, а справа от нее – миниатюру векторной маски

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

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

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

Из цветовой палитры выбираем другой цвет

Далее я нажму кнопку ОК для закрытия цветовой палитры, и цвет моего квадрата изменится с красного на голубой:

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

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

Белая область на векторной маске представляет область на слое, где цвет виден

Чтобы нам было легче увидеть, как программа Photoshop отображает векторную фигуру, мы можем временно отключить векторные маски, нажав и удержав клавишу Shift и при этом кликнув по миниатюре векторной маски:

Удержите нажатой клавишу Shift и кликните по векторной маске для ее отключения

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

После выключения векторной маски видно, что весь слой заполнен цветом

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

Документ после повторного включения векторной маски

Теперь, после того как мы познакомились со слоями фигур, давайте рассмотрим другие фигуры, которые можно нарисовать в программе Photoshop с помощью инструментов группы «Фигуры».

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

Инструмент «Прямоугольник со скругленными углами» (Rounded Rectangle Tool) очень похож на инструмент «Прямоугольник» за исключением того, что он позволяет нам рисовать прямоугольники с закругленными углами. Мы регулируем степень закругления углов, используя параметр «Радиус» (Radius)  на панели настроек. Чем большее значение радиуса мы вводим, тем круглее становятся углы. В моем случае, я введу значение параметра «Радиус», равное 50 пикселям:

Используйте параметр «Радиус» для определения степени закругления углов

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

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

Когда вы отпустите кнопку мыши, программа Photoshop закончит рисовать фигуру и заполнит ее цветом:

Когда вы отпустите кнопку мыши, фигура заполнится цветом

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

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

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

Маленькое значение радиуса меньше скругляет углы

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

Все вышесказанное означает, что рисование прямоугольников со скругленными углами, по сути, является методом проб и ошибок. Если вам не нравится закругление углов фигуры, после того как вы ее нарисовали, нажмите сочетание клавиш Ctrl+Z (Win) / Command+Z (Mac) для быстрой отмены действия, затем введите новое значение радиуса на панели настроек и начните заново рисовать прямоугольник.

Так же как и в случае с инструментом «Прямоугольник», с помощью инструмента «Прямоугольник со скругленными углами» можно рисовать закругленные квадраты. Просто нажмите и удержите нажатой клавишу Shift после того как вы начали рисовать фигуру, и ваш закругленный прямоугольник примет форму закругленного квадрата. Нажмите и удержите в нажатом состоянии клавишу Alt (Win) / Option (Mac), чтобы нарисовать фигуру от центра.

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

Инструменты «Прямоугольник» и «Прямоугольник со скругленными углами» имеют одинаковые дополнительные параметры

Инструмент «Эллипс»

Инструмент «Эллипс» (Ellipse Tool) позволяет нам рисовать эллипсы и круги. Так же как и при работе с инструментами «Прямоугольник» и ««Прямоугольник со скругленными углами», кликните кнопкой мыши в окне документа для определения начальной точки фигуры и затем, удерживая кнопку мыши нажатой, протяните курсор мыши, чтобы закончить рисовать фигуру:

Рисуем эллипс с помощью инструмента «Эллипс»

Отпустите кнопку мыши, чтобы закончить рисовать фигуру и заполнить ее цветом:

Эллис заполнился цветом

Нажмите и удержите нажатой клавишу Shift, после того как вы начали работать с инструментом «Эллипс», чтобы нарисовать идеально ровный круг. Нажатие клавиши Alt (Win) / Option (Mac) позволит вам нарисовать фигуру от центра:

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

Нажатие маленькой стрелки на панели настроек приведет к открытию параметров инструмента «Эллипс», которые схожи с параметрами инструментов «Прямоугольник» и «Прямоугольник со скругленными краями». Единственное отличие состоит в том, что с помощью параметра инструмента «Эллипс» можно рисовать круги, а не квадраты:

Инструмент «Эллипс» имеет практически те же самые параметры, что и инструменты «Прямоугольник» и «Прямоугольник со скругленными краями»

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

Инструмент «Многоугольник» (Polygon Tool) более интересен для нас с точки зрения возможностей рисования фигур. Если с помощью инструмента «Прямоугольник» мы можем рисовать только четырехугольные прямоугольники, то инструмент «Многоугольник» позволяет нам рисовать многоугольники с таким числом сторон, какое мы пожелаем. Далее мы рассмотрим, как с помощью это инструмента можно нарисовать даже звезды.

Укажите число сторон, которое вам требуется для многоугольника, в окошке параметра «Стороны» (Sides) на панели настроек. По умолчанию значение параметра «Стороны» равно 5, но вы можете ввести любое число от 3 до 100:

Воспользуйтесь параметром «Стороны», чтобы указать программе Photoshop, сколько сторон будет иметь ваша многоугольная фигура

Как только вы укажете число сторон, установите курсор в окне документа и начните его протягивать для рисования многоугольной фигуры. Программа Photoshop всегда рисует многоугольные фигуры от центра, поэтому вам не нужно удерживать нажатой клавишу Alt (Win) / Option (Mac). Нажатие и удержание клавиши Shift после того, как вы начали рисовать многоугольник, позволит вам ограничить число углов для вашей фигуры и поместить ее на экране именно так, как требуется:

Инструмент «Многоугольник» незаменим тогда, когда нам нужно нарисовать другую фигуру, а не четырехугольник

Указав число сторон равное 3, мы можем с легкостью нарисовать треугольник:

Простой треугольник, нарисованный с помощью инструмента «Многоугольник»

А вот представлен многоугольник с числом сторон равным 12:

Многоугольник с двенадцатью сторонами

Рисование звезд с помощью инструмента «Многоугольник»

Для того чтобы нарисовать с помощью инструмента «Многоугольник» звезду, нажмите на маленькую стрелку на панели настроек для открытия перечня параметров инструмента «Многоугольник» и выберете параметр «Звезда» (Star):

Из списка параметров инструмента «Многоугольник» выбираем «Звезда»

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

Пятиконечная звезда, нарисованная с помощью инструмента «Многоугольник»

Изменив значение параметра «Стороны» на 8, мы получим восьмиконечную звезду:

Определите число вершин звезды с помощью параметра «Стороны»

Мы можем нарисовать фигуру, похожую на взорвавшуюся звезду, увеличив остроту лучей звезды с помощью параметра «Глубина лучей» (Indent Sides By). По умолчанию, значение этого параметра равно 50%, я увеличу значение до 90%:

Увеличим значение параметра «Глубина лучей» до 90%

И вот какая у меня получилась звезда со значением параметра «Глубина лучей», равным 90%. Я также увеличил число вершин звезды до 16:

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

По умолчанию, вершины звезд имеют острые углы, но мы можем их скруглить, выбрав параметр «Сгладить внешние углы» (Smooth Corners):

Выбираем параметр «Сгладить внешние углы»

Ниже представлена пятиконечная звезда с выбранным параметром «Сгладить внешние углы»:

Параметр «Сгладить внешние углы» смягчает угловатость звезд

Мы можем также скруглить углы у оснований лучей звезды, выбрав параметр «Сгладить внутренние  углы» (Smooth Indents):

Выбираем параметр «Сгладить внутренние  углы»

И снова, наша звезда выглядит совершенно по-другому:

Нарисованная звезда с выбранным параметром «Сгладить внутренние  углы»

Инструмент «Линия»

И, наконец, мы рассмотрим инструмент «Линия» (Line Tool), который является последним инструментом группы «Геометрические фигуры». Он позволяет нам рисовать прямые линии и стрелки. Установите нужную толщину линии в пикселях, введя значение в окошко параметра «Толщина» (Weight) на панели настроек. В моем случае, я введу значение, равное 16 пикселям:

Воспользуйтесь параметром «Толщина» для определения толщины линии

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

Удерживайте нажатой клавишу Shift для рисования горизонтальных или вертикальных линий

Для того чтобы на концах линии задать стрелки, нажмите на значок маленькой стрелки на панели настроек для выбора параметров «Стрелки» (Arrowheads). Программа Photoshop позволяет нам добавлять стрелки в начале линии, в конце или одновременно на обоих концах. Если вы хотите, чтобы у вас появилась стрелка в том направлении, в котором вы рисуете линию, что более логично, выберите параметр «Конец» (End). Убедитесь, что вы выбрали этот параметр прежде, чем начали рисовать линию, поскольку программа не позволит нам вернуться назад и задать стрелку после того, как линия будет нарисована:

Для того чтобы добавить стрелку в том направлении, в котором линия рисовалась, выберите параметр «Конец»

Ниже представлена линия, похожая на нарисованную мной предыдущую линию, но со стрелкой на конце:

С помощью инструмента «Линия» легко рисовать стрелки

Если установленный по умолчанию размер стрелки вас не устраивает, вы можете изменить его, используя параметры «Ширина» (Width) и «Длина» (Length). Мы можем также добавить стрелке изгиб, воспользовавшись параметром «Кривизна» (Concavity). По умолчанию, значение данного параметра равно 0%. Я увеличу его до 50%:

Увеличьте значение параметра «Кривизна», чтобы изменить форму стрелки

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

Стрелка со значением параметра «Кривизна», равным 50%

Скрытие контура вокруг фигуры

Если вы внимательно посмотрите на нарисованную вами фигуру (независимо от того, какой инструмент группы «Фигуры» вы использовали), то, скорее всего, увидите вокруг нее тонкий контур, который иногда может вызвать раздражение. Контур вокруг фигуры появляется всякий раз, когда выделена векторная маска фигуры, а она выделяется по умолчанию всегда после того, как мы нарисуем новую фигуру.

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

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

И вот мы закончили! Мы рассмотрели основы работы со слоями фигур и пятью инструментами группы «Фигуры» в программе Photoshop! В следующем уроке мы изучим, как создавать фигуры более сложной формы с помощью инструмента «Произвольная фигура» (Custom Shape Tool).

Автор: Steve Patterson

Перевод: Ксения Руденко

Источник:

photoshopessentials.com

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

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

Что такое растровое и векторное изображение и чем они отличаются

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

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

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

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

Простой пример, как растр перевести в вектор

Итак, вектор состоит из геометрических фигур. Photoshop обладает инструментами для создания контуров. Контур и есть геометрическая фигура. Чтобы сделать векторное изображение в Фотошопе, нужно создать контур изображения. Помогут нам в этом инструменты группы «Выделение»/Select
: «Прямоугольное выделение»/Rectangular Marquee Tool
, «Эллиптическое выделение»/Elliptical Select Tool
,** «Волшебная палочка»/Magic Wand Tool, **«Быстрое выделение»/Quick Selection Tool
и «Перо»/Pen tool
.

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

Открываем растровое изображение в фотошопе (самый распространенный формат растрового изображения — JPG). Очень легко поддаются обработке логотипы, контурные рисунки, эскизы. Чтобы получить векторный эскиз портрета, сначала можно преобразовать портрет в эскиз с помощью «Галереи фильтров»
, либо использовать готовый поп-арт. О том, как работать с «Галереей фильтров»
и быстро создавать поп-арт из фото, мы рассказывали в предыдущих статьях. Для этого примера мы возьмем готовый поп-арт-портрет. Умышленно мы подготовили его из фото не самого лучшего разрешения. Поэтому векторный вариант покажет нам заметную разницу.

Чтобы работать с контурами, вам нужно вызвать закладку «Контуры»/Path
на палитру слоёв. Для этого зайдите в меню «Окно»/Window
и отметьте пункт «Контуры»/Path
. Закладка появится на палитре слоёв.

Изображение имеет 4 цвета (фон не считаем). Берём инструмент «Волшебная палочка»/Magic Wand Tool
и выделяем первый цвет. Чтобы выделить все участки, рассредоточенные островками по изображению, удерживайте Shift
.

Когда первый цвет выделен, выбираем инструмент «Лассо»/Lasso
либо «Прямоугольная область»/Rectangular Marquee Tool
и, не снимая выделения, щёлкаем правой клавишей мыши. В контекстном меню выбираем «Образовать рабочий контур»/Make Work Path
.

В диалоговом окне указываем максимальное сглаживание «Допуск»/Tolerance
(от 1 до 10; чем ниже цифра, тем лучше повторятся контуры). Жмём Ok
.

На закладке «Контур»
появится первый контур. На изображении он будет заметен в виде кривых с точками. Их можно выровнять и подогнать с помощью инструмента «Выделение узла»/Direct Selection Tool
. Этим инструментом выделяем точку и либо корректируем кривую, перемещая усик точки, либо подвигаем саму дугу.

На закладке «Контур»
меняем название контура. Для этого щёлкаем по нему двойным щелчком и в диалоговом окне изменяем имя.

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

Получив контуры, остаётся создать вектор. Переходим на закладку «Слои»/Layer
на палитре слоёв, создаём новый слой Shift+Ctrl+N
. Основной цвет задаём тот, в который окрасим первый контур.

Возвращаемся на закладку «Контур»
, становимся на первый контур. В главном меню в пункте «Слои»/Layers
выбираем «Новый цвет заливка»/New Fill Layer
— «Цвет»/Solid Color
. В открывшемся окне жмём Ok
.

Теперь, перейдя на закладку «Слои»/Layers
, вы увидите на новом слое первый векторный слой.

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

На этом всё. Способ достаточно простой.

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

Еще больше о Photoshop — на курсах .

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

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

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

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

Результат

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

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

Цель Урока

В этом уроке мы научимся создавать векторный протрет в стиле 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.

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

В этом уроке испанский художник Даниэль Кабаллеро (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%.

Рисуем геометрический портрет в Adobe Illustrator

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

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

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

Цель

Шаг 1

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

Шаг 2

Создайте новый документ в Adobe Illustrator размером 600 X 480 px.
Вот так мы организуем слои:

• Верхний слой мы назовем “Draw”- здесь мы разместим нашу иллюстрацию.
• Под слоем “Draw” расположите слой “Sketch”.
• Ниже расположите слой “Photo” — сюда мы поместим фотографию
• В самом низу расположите слой “Background” нарисуйте в нем квадрат такого же размера, как и документ (600 X 480px) и заполните его серым цветом.

Шаг 3

Заблокируйте слой «Background» и слой «Photo». На слое «Sketch» при помощи инструмента “Кисть-клякса” (Blob Brush Tool (Shift + B)) нарисуйте скетч, используя контуры фотографии. Попробуйте сделать все линии прямыми, так как мы будем рисовать геометрический портрет.

Шаг 4

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

Шаг 5

Измените непрозрачность слоя со скетчем на 30% и заблокируйте его.

Теперь начнем рисовать формы, используя инструмент «Перо» (Pen Tool (P)). Используя обводку черного цвета размером 1pt, нарисуйте волосы при помощи прямых линий.

Шаг 6

Нарисуйте половину футболки, копируйте ее (Ctrl+С/Cmnd + C) и вставьте сверху (Ctrl+F/Cmnd + F).

Отразите копию по горизонтали, используя инструмент «Зеркальное отражение» (Reflect Tool (O)).

Выберите два контура, затем перейдите в Обработка контуров (Pathfinder) > Объединение (Unite option). Почти все элементы в этой иллюстрации будут создаваться таким же способом: копируем, отражаем и объединяем.

Шаг 7

Теперь нарисуйте шею при помощи инструмента «Многоугольник» (Polygon Tool).
Сначала нарисуйте восьмиугольник и оставьте только его верхнюю половину.
Используйте инструмент «Масштаб» (Scale Tool (S)), чтобы немного видоизменить форму.
Уменьшите расстояние между точками внизу формы.
Копируйте форму и вставьте копию сверху, немного изменив ее размер.

Расположите форму на нужном месте.

Шаг 8

Похожим способом мы нарисуем форму для головы. Нарисуйте восьмиугольник и выберите только верхнюю часть. Передвиньте контуры и немного измените форму при помощи инструмента «Масштаб» (Scale Tool (S)).

Дублируйте форму для головы, измените ее размеры и расположите копию, как показано на рисунке ниже (чтобы получилась форма для шеи). Затем перейдите в «Обработку контуров» (Pathfinder) > Минус верхний (Minus Front).

Шаг 9

Чтобы создать детали вы можете использовать уже созданные формы. Например, чтобы создать детали для шеи, вы можете дублировать и изменить форму для лица. Затем дублируйте базовую форму шеи и перейдите в Pathfinder > Intersect.

Шаг 10

Добавьте еще деталей нашей иллюстрации при помощи инструмента «Перо» ( Pen Tool (P)) и инструментов для создания форм. Не забудьте изменять формы при помощи «Обработки контуров».

Шаг 11

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

Шаг 12

Теперь добавим другие детали лица: глаза, нос и рот.

Чтобы нарисовать губы мы будем использовать шестиугольник. Видоизмените его при помощи инструмента «Масштаб» (Scale Tool). Затем нарисуйте прямоугольник и расположите его посередине. Перейдите в «Обработку контуров» (Pathfinder) > Минус верхний (Minus Front). Копируйте форму и вставьте ее сверху, немного видоизмените, чтобы создать верхнюю губу. Измените контуры сверху при помощи инструмента “Прямое Выделение” (Direct Selection Tool (A)).

Шаг 13

Форму для глаз мы начнем с создания восьмиугольника и инструмента «Ластик» (Eraser Tool (Shift + E)) (чтобы удалить нижнюю часть формы). Скопируйте нашу форму немного сдвиньте ее вниз. Дублируйте основную форму и нажмите «Минус верхний» (Minus Front) на панели контуров (Pathfinder). Это будет тень для глаза. Дублируйте ее еще раз, чтобы создать ресницы. Для добавления дополнительных деталей нарисуйте маленький восьмиугольник на радужной оболочке и создайте нижнее веко. Так как глаза смотрят в одном направлении, мы можем дублироватьпросто дублировать один глаз.

Шаг 14

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

Шаг 15

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

Теперь наша иллюстрация выглядит так.

Шаг 16

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

Шаг 17

При помощи инструмента “Переход” (Blend Tool (W)) сделайте переход от светлого цвета к темному для кожи.

Перейдите Объект (Object) > Переход ( Blend) > Параметры перехода ( Blend Options) и измените параметры для заданного числа шагов (Specified Steps). Измените значение на «5» и нажмите «OK».

Шаг 18

Затем перейдите в Объект (Object) > Разобрать (Expand). Можете сохранить цвета в панели образцов и добавить их в новую папку.

Назовите как-нибудь группу и сохраните ее.

Вот наша палитра цветов, для глаз и деталей измените значение для заданного числа шагов (Specified Steps) на 2 (вместо 5).

Шаг 19

Нарисуйте линию в центре иллюстрации. Выберите слой с волосами и заблокируйте его. Затем выберите линию и перейдите в Объект( Object )> Контур (Path) > Разделить нижние объекты (Divide Objects Below). Таким образом мы разрежем все контуры, которые находятся под линией.

Теперь мы можем разблокировать слой с волосами.

Шаг 20

Добавлять цвета вы можете используя инструмент «Пипетка» (Eyedropper Tool (I)). Кликните, чтобы выбрать цвет и удерживайте Alt, чтобы добавить цвет.

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

Шаг 21

Чтобы создать бороду, нарисуйте маленький прямоугольник при помощи Rectangle Tool (M). Копируйте прямоугольники, пока не получите желаемый результат.

Шаг 22

Можете добавить несколько мелких деталей.

Результат

Источник: iam.designer

Как создать абстрактный геометрический фотоколлаж

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

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

Посмотреть геометрический фотоколлаж в полном размере

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

Мы начнем в Adobe Illustrator, чтобы сделать шаблон для наших геометрических фигур. Создайте новый документ, затем выберите инструмент «Эллипс». Удалите цвет заливки, но оставьте черный контур, затем кликните мышью в рабочей области и введите значения 500 пикселей для ширины и высоты:

Создайте еще один эллипс, но на этот раз вдвое меньше первого, ширина и высота — 250 пикселей. Используйте «Смарт-направляющие», чтобы точно выровнять по верхнему краю оба круга:

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

Выберите две маленьких окружности и нажмите Ctrl + C, чтобы скопировать их, а затем Ctrl + F, чтобы вставить. Удерживая клавишу Shift, поверните эти фигуры на 90 градусов:

Скопируйте и вставьте один круг, а затем, используя «Смарт-направляющие», выровняйте эту фигуру по центру композиции:

Выберите инструмент «Многоугольник» и кликните в рабочей области, чтобы вызвать окно параметров. Введите 250 пикселей и измените количество сторон на 3, чтобы создать треугольник:

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

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

Выберите все (Ctrl + A) и скопируйте все фигуры, которые образуют геометрическую композицию. Вставьте композицию в документ Photoshop, поверх этой крутой фотографии. Нажмите Ctrl + I, чтобы инвертировать цвета и сделать линии белыми:

Активируйте инструмент «Волшебная палочка», а затем при выбранном слое линий кликните внутри первой геометрической фигуры, чтобы выделить ее:

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

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

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

Продолжайте планомерно, один за другим заполнять сегменты геометрической композиции частями фонового изображения. Чтобы ускорить процесс, используйте горячие сочетания клавиш: W – «Волшебная палочка», M – «Перемещение», Ctrl+ C и Ctrl+ V — скопировать и вставить. А также включите режим «Привязка» из меню «Вид», чтобы вам проще было собирать фрагменты дизайна вместе:

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

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

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

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

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

РедакцияПеревод статьи «How To Create Abstract Geometric Photo Collage Art»

Как нарисовать треугольник в Фотошопе: равносторонний, равнобедренный, прямоугольный

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

Рисуем треугольник

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

Метод 1: используем инструмент “Многоугольник”

1. На боковой панели программы выбираем требуемый инструмент.
2. С помощью “Многоугольника” можно нарисовать равносторонний треугольник и другие правильные фигуры. Для этого в появившейся верхней строке параметров указываем требуемое количество сторон (в нашем случае – 3).Также, если необходимо, можно настроить цвет заливки, обводку и прочие параметры.
3. Переходим на холст и зажав левую кнопку мыши создаем фигуру, размер и наклон которой в момент рисования можно менять. Получаем такой треугольник согласно выставленным нами параметрам. В вашем случае результат может быть другим.Если фигуру требуется видоизменить, сделать это можно с помощью функции “Свободное трансформирование”, которая запускается нажатием комбинации клавиш Ctrl+T.

Метод 2: пользуемся “Лассо”

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

1. Чтобы не пришлось все отмерять на глаз, включим показ сетки через меню “Просмотр” – “Показать” – “Сетку”.
2. Также для большего удобства можно использовать направляющие. В результате получаем примерно такой рабочий холст, напоминающий клетчатую бумагу с разметкой.
3. Выбираем на панели инструментов “Прямолинейное лассо”.
4. Создаем с помощью лассо выделение в виде равнобедренного треугольника. Для этого щелкаем в нужном месте на холсте, где хотим поставить первую точку, далее размещаем указатель там, где требуется зафиксировать вторую точку. Затем снова делаем клик и идем к третьей вершине фигуры, после чего замыкаем выделение, щелкнув снова по первой точке.Когда все готово, показ сетки можно отключить, так как она дальше не понадобится. Делается это путем выбор той же команды, что и для ее активации (в меню “Просмотр”). Также можно убрать направляющие.
5. Теперь щелкаем правой кнопкой мыши в любом месте холста, после чего в открывшемся списке команд выбираем “Выполнить заливку” или “Выполнить обводку” – зависит от того, что требуется сделать с выделением.
   • Если выбрана заливка, откроется окно, в котором мы можем выставить параметры заполнения (основной/фоновый/настраиваемый цвет и т.д.). Дополнительные настройки: режим наложения и непрозрачность.
   • При выборе обводки требуется указать ее ширину в пикселях, а также цвет и расположение (внутри, снаружи или по центру). Вспомогательные настройки те же, что и для заливки.
   • Примечание: Данные команды можно комбинировать: т.е. сначала выполнить заливку, затем – обводку (или наоборот).
6. В зависимости от выбранного варианта получаем один из треугольников ниже (выделение можно снять с помощью горячих клавиш Ctrl+D):
   • залитый цветом;
   • обведенный по контуру;
   • закрашенный с обводкой.

Заключение

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

[Низкополигональный эффект] Создание геометрического портрета в Photoshop

Хотите узнать, как можно круто оживить любую фотографию? Создайте низкополигональный эффект! Просто соединяя многоугольники вместе, вы можете создавать красивые портреты и многое другое! Хотя это можно сделать в Illustrator, сегодня вы узнаете, как создать этот низкополигональный эффект в Photoshop. Давай начнем!

Программное обеспечение: Adobe Photoshop CS6 Extended

Сложность: Продвинутый

Время выполнения: 4 часа

изображений, используемых в этом учебном пособии

Фотография из студии модного искусства красивой элегантной футуристической леди: 40572217 © Джордж Майер

Настройка изображения

Шаг 1

Откройте изображение в Photoshop.Если вы новичок, используйте симметричный портрет, чтобы с ним было намного проще работать. Установите разрешение на 150 dpi , чтобы вы работали с более высоким разрешением. Дублируйте изображение, чтобы можно было работать только с копией для эффекта low poly. Перейдите в View> Show> Grid , чтобы отобразить сетку. Также убедитесь, что установлен флажок View> Snap To> Grid . Это поможет держать формы близко друг к другу без пропусков.

Создание многоугольных фигур

Шаг 2

Выберите инструмент Polygonal Lasso Tool (L) .Убедитесь, что опция Anti-Alias ​​ не отмечена на верхней панели инструментов, потому что это поможет сохранить твердость ваших краев. Затем создайте форму треугольника.

Шаг 3

Теперь перейдите к Filter> Blur> Blur Average. Это поможет заполнить треугольник сплошным цветом в цветовом диапазоне выбранной области. Чтобы сэкономить время на создание большего количества треугольников и форм, вы можете избежать ручного выбора среднего размытия, нажав Control-F после создания формы с помощью инструмента Polygonal Lasso Tool (L). Это автоматически применит к выделению последний фильтр.

Шаг 4

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

Шаг 5

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

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

Когда вы закончите, ваше изображение должно выглядеть так.

Увеличение яркости цветов

Шаг 6

Теперь, когда портрет покрыт фигурами, мы можем добавить фон. Используйте инструмент Magic Wand Tool (W), , чтобы выбрать белый фон, и нажмите Удалить, , чтобы избавиться от него.После этого залейте новый слой позади женщины светло-серым цветом (# dddfe1).

Шаг 7

Выберите инструмент «Градиент » (G ) и установите для него параметр «Цвет переднего плана — Прозрачный». Цвета фона навеяны светом, падающим на модель, поэтому используйте темно-серовато-синий цвет (# a4a4ad) , чтобы создать линейный градиент, движущийся вверх. На том же слое используйте белый цвет, чтобы добавить немного яркости позади нее, применив еще один линейный градиент сверху вниз.

Шаг 8

Давайте скрасим модель! Для этого выберите слой с многоугольным портретом и щелкните его правой кнопкой мыши, чтобы перейти к параметрам наложения . Поставьте галочку рядом с Gradient Overlay и примените Copper Preset , доступный в Photoshop.

Шаг 9

Уменьшите непрозрачность наложения градиента до 25%, установите масштаб на 150%, и установите режим наложения на Color Dodge .

И готово! Этим последним шагом вы завершили этот низкополигональный эффект!

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

20 уроков в Photoshop и Illustrator для создания геометрических рисунков — Bashooka

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

Неограниченное количество загрузок: 600 000+ Шаблоны для печати и материалы для дизайна Объявление

Скачать сейчас

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

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

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

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

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

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

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

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

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

Отличное руководство по показанному эффекту, но также и по работе с PS в целом.Так что в конце урока вы получите еще много информации.

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

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

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

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

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

В этом уроке он покажет вам, как создать 3D-логотип в Photoshop с помощью инструмента «Многоугольное лассо».

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

Саймон проведет вас через процесс воссоздания плаката, который он назвал «Структура». Мы пройдем все этапы, от концептуализации до воплощения.

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

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

Низкополигональный геометрический эффект ТОЛЬКО в Photoshop! — tutvid.com

[sociallocker id = 8471] Загрузите учебные файлы здесь! [/ Sociallocker]

В этом уроке мы рассмотрим очень популярный низкополигональный эффект.Мы собираемся создать этот эффект, используя ТОЛЬКО Photoshop, и это также будет иллюстрация на основе контуров. Позже в этом уроке мы добавим фон к нашей иллюстрации, и [sociallocker id = ”8471 ″] вы можете скачать изображение прямо здесь. [/ sociallocker] Если у вас возникли проблемы с выполнением письменного руководства, обязательно посмотрите полное видео выше и следуйте инструкциям, чтобы создать свой собственный низкополигональный эффект!

Шаг 1. Настройте свои предпочтения

Используйте горячую клавишу Cmd / Ctrl + K, чтобы открыть настройки Photoshop, выберите «Направляющие, сетки и фрагменты», установите цвет сеток на светло-красный и выберите установку линии сетки через каждые 10 пикселей только с одним делением.

Шаг 2. Установите Pen Tool

Возьмите инструмент «Перо» (P), посмотрите на верхнее меню и выберите «Форма» в раскрывающемся меню слева. Установите нулевую заливку (красная косая черта) и установите обводку на белый цвет, а толщину обводки установите на «0,5 pt» или около того (это будет зависеть от размера вашего изображения). Мне также нравится выбирать шестеренку. колесо и отметьте «Резиновая лента» включенным (это покажет мне, где мой путь в реальном времени, когда я его рисую).

Шаг 3. Включите сеть

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

Шаг 4. Начните рисовать треугольники

Хитрость здесь в том, чтобы использовать инструмент «Перо» (P) и щелкнуть прямо там, где линии сетки сходятся вместе, и привязка гарантирует, что точка привязки пути будет помещена точно в эту точку, и начнется рисование треугольников (не квадратов или сложных форм, только треугольников). !) над областями того же цвета. Попробуйте нарисовать треугольники на участках с одинаковым цветом лица, чтобы, когда мы начали раскрашивать эти формы, все выглядело правильно.Я создала свои первые 25 фигур по линии роста волос. ПРИМЕЧАНИЕ. При рисовании каждая фигура должна находиться на отдельном слое фигуры на панели слоев. СОВЕТ: После того, как вы нарисуете треугольник и соедините концы пути, нажмите клавишу Enter / Return, чтобы отменить выбор этого пути, чтобы вы могли работать с новым путем.

Шаг 5: Продолжайте создавать фигуры

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

Шаг 6: Детали в глазах!

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

Шаг 7: Завершите лицо

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

Шаг 8: Обведите волосы

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

Шаг 9: Продолжайте строить фигуры

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

Шаг 10: Добавьте последние треугольники

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

Шаг 11: Начать раскрашивание

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

Шаг 12: Раскрасьте лоб

Я добавляю цвета всем этим оригинальным треугольникам на лбу.

Шаг 13: Добавьте цвета глазам

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

Шаг 14: Добавьте цвет к остальной части лица

Продолжайте эту технику и добавьте цвета на остальную часть лица.

Шаг 15: Добавьте цвет волосам и всему остальному

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

Шаг 16: Проверка наличия пробелов

Я создал более 600 форм, поэтому выделил все слои и нажал Cmd / Ctrl + G, чтобы сгруппировать их в одну большую группу слоев. Теперь и добавьте слой под этой группой слоев, выбрав группу слоев, удерживая нажатой клавишу Cmd / Ctrl и нажав значок нового слоя в нижней части панели «Слои». Залейте этот слой белым, чтобы найти дыры на иллюстрации.

Шаг 17: Вау! Множество маленьких линий!

На этом белом фоне мы видим множество маленьких белых линий между всеми нашими фигурами.Мы можем исправить это очень легко, щелкнув правой кнопкой мыши по группе слоев и выбрав «Преобразовать в смарт-объект» (не волнуйтесь! Все эти формы все еще находятся в этом смарт-объекте!), А затем дважды нажав Cmd / Ctrl + J, чтобы продублируйте смарт-объект поверх самого себя. Это сгущает края и дает нам идеальный низкополигональный эффект.

Шаг 18: Вектор и работа со смарт-объектом

Вы также можете изменить его размер до любого размера, потому что в Photoshop он основан на контуре, который представляет собой тип векторной графики, который не будет искажаться при масштабировании в большем или меньшем размере.ПРИМЕЧАНИЕ. Вам нужно будет дважды щелкнуть мышью, чтобы попасть в смарт-объект, чтобы масштабировать фактическую группу векторных путей. Простое масштабирование смарт-объекта приведет к некоторому ухудшению качества изображения. Я сгруппировал все три смарт-объекта в новый смарт-объект, выбрав все три слоя и выбрав «Преобразовать в смарт-объект». ПРИМЕЧАНИЕ. Вы всегда можете дважды щелкнуть мышью и попасть в любой из созданных нами смарт-объектов.

Шаг 19: Создание фона

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

Шаг 20: Добавление шума и фигур

Перейдите в меню «Фильтр»> «Шум»> «Добавить шум» и добавьте 100% шума с установленным флажком «Монохроматический». Затем перейдите в Filter> Pixelate> Mosaic и установите размер ячейки на 100 пикселей в квадрате.Затем откройте «Уровни», нажав Cmd / Ctrl + L, и перетащите ваши черно-белые ползунки внутрь, пока левый ввод не покажет «105», а правый — «150». Это увеличит нашу контрастность. Установите для этого слоя режим наложения «Overlay» и нажмите Cmd / Ctrl + J, чтобы продублировать слой и усилить эффект.

Шаг 21: Иллюстрация, цветовой баланс и уровни

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

Шаг 22: База световых полос

Cmd / Ctrl + щелкните миниатюру слоя иллюстрации, чтобы загрузить низкополигональную иллюстрацию в качестве выделения, а затем добавьте слой сразу под слоем иллюстрации. Установите цвет переднего плана на # 5b88bf, перейдите в Edit> Fill и выберите заливку цветом переднего плана.Дублируйте этот синий слой, нажав Cmd / Ctrl + J.

Шаг 23: Размытие для добавления полос

Затем перейдите в Фильтр> Размытие> Размытие в движении и размойте его под углом -45 и на расстоянии 1000. Отключите нижний синий слой, нажав значок глазного яблока на панели «Слои», а затем возьмите инструмент «Кисть» (B) и выберите кисть с мягкими краями 70 пикселей и установите белый цвет переднего плана. Теперь нарисуйте идеально прямые линии вдоль гребней в размытии, как я.СОВЕТ: Щелкните в одном месте, чтобы добавить точку краски, а затем, удерживая нажатой клавишу Shift, щелкните в том месте, где должна проходить прямая линия краски. Это позволит вам рисовать идеально прямые линии. Нажмите Cmd / Ctrl + F несколько раз, чтобы все сгладить и получить полосатый эффект.

Шаг 24: Смешивание и размытие

Установите этот полосатый слой размытия в режим наложения «Color Dodge», затем выберите другой синий слой и нажмите Cmd / Ctrl + F, чтобы применить к нему одно Motion Blur. Установите нижний размытый синий слой в режим наложения «Overlay».

Шаг 25: Последние штрихи

Добавьте корректирующий слой уровней и действительно уменьшите контраст, немного потянув ползунки уровней выходного сигнала черного и белого внутрь, как показано на моем скриншоте. Это готовит нас к следующему корректирующему слою, который является корректирующим слоем карты градиента. Я установил градиент от темно-синего (# 1f2134) до гораздо более светлого (# 5b88bf). Затем установите режим наложения слоя на «Мягкий свет». Вы можете уменьшить непрозрачность одного или обоих последних корректирующих слоев, чтобы улучшить эффект.

Надеюсь, вам понравился этот урок! Если да, пожалуйста, оставьте комментарий ниже или подпишитесь на меня в Твиттере, чтобы быть в курсе всех новых статей и руководств на tutvid.com! Спасибо!

БОНУСНЫЙ СОВЕТ:

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

DMesh: http://dmesh.thedofl.com/

I ♥ ∆: http://somestuff.ru/I (ссылка на скачивание находится под видео.)

Как создавать низкополигональные портреты в Photoshop — Создание с помощью Storyblocks

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

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

Шаг 1. Откройте стоковое изображение в Photoshop и разблокируйте фон

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

Откройте изображение в Photoshop и разблокируйте фон.

Шаг 2. Выделите всю фигуру

Выберите инструмент Polygonal Lasso Tool и начните обводить объект вашего портрета. Совершенно нормально, если ваш контур будет немного квадратным или резким — это только усилит геометрический эффект конечного продукта.

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

Присоединяйтесь к нашему творческому сообществу

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

Шаг 3. Откройте новый документ Photoshop

Когда вы закончите создание контура, вы заметите движущуюся пунктирную линию вокруг вашего объекта.Это область выбора. Вырежьте это выделение ( Command / Ctrl + X ) и вставьте в новый документ. *

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

Шаг 4. Создайте треугольную область выделения.

Выберите слой объекта (в данном случае слой с фламинго). Убедитесь, что инструмент Polygonal Lasso Tool все еще выбран, и выберите область для рисования треугольника.Для каждого из ваших треугольников вы хотите выбрать области с похожей окраской.

Теперь нарисуйте треугольное выделение.

Шаг 5. Отфильтруйте выделение

Выделив треугольную область (вы должны увидеть движущуюся пунктирную линию), выберите Filter> Blur> Average . Это создает среднее значение всех цветов в выбранной области.

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

Теперь, когда вы уже использовали команду Average один раз, вы можете просто нажать Command + control + F ( Ctrl + Alt + F на ПК ) на клавиатуре. Это сочетание клавиш повторяет тот фильтр, который использовался последним.

Шаг 6. Повторять навсегда (не совсем)

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

Совет 1: Заполнение промежутков

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

Совет 2: Получение подробностей

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

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

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

Мэдди Стерн

Писатель-фрилансер

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

Создавайте потрясающие геометрические иллюстрации в Photoshop

Вот что вы создадите (щелкните, чтобы увеличить)

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

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

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

Здесь мы собираемся воссоздать культовое изображение из постера фильма «Челюсти» в плоских многоугольниках с помощью Photoshop.

01. Подготовка к работе

Хорошо подойдут изображения с сильным силуэтом и ограниченной цветовой палитрой

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

Откройте Photoshop и создайте новый документ. Я выбрал 1920 x 1080 пикселей, так как, возможно, собирался использовать готовое изображение в качестве обоев.Еще мне нравятся широкоэкранные пропорции с фокусом в одну сторону. Скопируйте исходное изображение в документ и поместите его там, где хотите. Если текст вас отвлекает, используйте лассо, чтобы выделить его, а затем удалите.

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

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

02. Основные формы

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

Нажмите Ctrl + Alt + Shift + N , чтобы создать новый слой, и используйте лассо, чтобы нарисовать форму челюсти. Не добавляйте сюда слишком много промежуточных моментов. Вам нужно что-то геометрическое. С нарисованной формой нажмите B и . ALT щелкните по средней тонированной области, чтобы выбрать цвет из эталонного изображения.

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

Теперь нажмите Shift + F5 , чтобы залить выделение выбранным цветом.

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

Эти формы скоро вырастут, и вы увидите упрощенную графическую версию принимающей формы акулы.

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

03. Продолжайте процесс

Не забудьте добавить слои в соответствующем порядке

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

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

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

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

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

04. Пловец

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

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

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

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

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

05. Пузыри

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

Создайте новый слой и нарисуйте очень грубый круг с помощью лассо. Хорошо работают пять или шесть сторон. Теперь добавьте простую тень и простой блик, выбрав все цвета акулы и / или воды. Затем просто вырежьте и вставьте этот пузырь, чтобы создать дубликаты, используя инструмент преобразования ( Cmd + T ), чтобы изменить размер, повернуть и переместить копии.

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

06. Завершение и варианты

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

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

07. Резюме

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

Words : Роб Редман

Роб Редман — художник и дизайнер из Великобритании, который регулярно работает с такими клиентами, как The Who, Кэти Перри, Министерство звука, национальные правительства и секретные организации ниндзя.

Понравилось? Прочтите это!

Абстрактный коллаж из геометрических фигур в фотошопе • Уроки по Adobe Photoshop

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

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

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

Примечание переводчика : все те же действия вы можете повторить в Adobe Photoshop. Используйте инструменты Ellipse (Ellipse), чтобы создать круги, и Polygon (Polygon), чтобы создать треугольник. Если у вас Photoshop CС, то используйте эти инструменты в режиме «Рисунок», без заливки и с включенной опцией «Обводка», Обводка.Если у вас более ранняя версия Photoshop, то используйте эти инструменты в режиме «Контур», затем примените к ним Редактирование — выполните штрих . Для наибольшего удобства при размещении фигур вы можете включить Линейки (Rulers) в меню View (View), а также Grid (Сетка), нажав View — Show — Grid (Вид — Показать — Сетка).

Вы можете пропустить этап создания геометрических фигур и скачать psd-файл с фигурами.

Начнем работать в Illustrator — здесь нам нужно создать узор из геометрических фигур.Создайте новый документ и выберите инструмент. Эллипс (Эллипс). Удалите заливку, но оставьте черный контур. Затем в монтажной области установите в поле размер 500 пикселей. Ширина (ширина) и Высота (высота).

Создайте еще один эллипс, но на этот раз в обоих полях установите размер 250 пикселей. Используйте интеллектуальные направляющие («Умные» направляющие) (Ctrl / Cmd + U), чтобы равномерно расположить второй круг, как показано на изображении ниже.

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

Выберите два маленьких эллипса, нажмите Ctrl / Cmd + C , чтобы скопировать их, а затем Ctrl / Cmd + F , чтобы вставить на передний план. Удерживая Shift, поверните эти фигуры на 90 градусов.

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

Выберите инструмент Многоугольник (Многоугольник) и щелкните монтажную область, чтобы открыть окно параметров.В столбце Радиус введите 250 пикселей и измените количество сторон на 3, чтобы получить треугольник.

Примечание : в фотошопе также можно использовать инструмент Polygon (Polygon).

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

Используйте панель Align (Alignment), чтобы выровнять расположение треугольника. Должно получиться как на изображении выше.

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

Щелкните Ctrl / Cmd + A , чтобы выбрать все фигуры, образующие геометрический узор.Вставьте свой узор в фотошопе поверх красивой фотографии. Щелкните Ctrl / Cmd + I , чтобы выполнить инверсию, чтобы линии стали белыми.

Выберите слой с фигурой в списке слоев, выберите инструмент Magic wand (Волшебная палочка) и выберите первую часть геометрического узора.

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

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

Снова выберите слой с линиями и выберите другой кусок с помощью Magic wand (Magic Wand), затем переключитесь на Rectangular area (Rectangular Marquee) и переместите выбранный фрагмент в любое случайное место. Скопируйте и вставьте этот кусок, а затем верните его на место в выкройке.

Продолжайте работать таким же образом, выбирая новые части узора и перемещая части изображения на их место. Ускорьте процесс с помощью горячих клавиш — W до Magic wand , M для Прямоугольная область , Cmd / Ctrl + C и Cmd / Ctrl + V для копирования и вставки, а также включение Snapping (Snap) в меню View (Просмотр), чтобы легко свернуть нашу картинку.

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

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

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

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

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

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

Секреты успешного геометрического low-poly art

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

Мы вас позаботились — это прозвали low-poly art.Название относится к происхождению стиля как рендеринга 3D-моделей для видеоигр. Хотя кажется, что вы используете много полигонов, на самом деле их относительно немного по сравнению с количеством, которое можно было бы использовать для создания сетки для более реалистичного и детального 3D-изображения.

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

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

Треугольник Животные от Хоуп Литтл

1. Источник

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

2.Форма

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

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

3. Симметрия

Важным компонентом вашего изделия будет симметрия. Собираетесь ли вы, как и на самом верхнем изображении в этом посте (Животные-треугольники), создать кусок, в котором одна сторона отражает другую? Или вы поиграете с более абстрактной концепцией создания части, заполненной вершинами, встречающимися во всевозможных разных местах, как на изображении выше?

4.Размер

Кстати об изображении выше — вы работаете в 2D-пространстве или в 3D? Хотя большинство этих работ выполняется в первом, они во многом зависят от иллюзии, что они создают трехмерное пространство. Но они достигают этого эффекта в разной степени.

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

5. Контекст

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

6. Детали

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

Дополнительные ресурсы

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

Вот несколько разных руководств, в каждом из которых есть свой подход к созданию низкополигональных деталей:

Создание низкополигонального портрета

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

Как легко создать геометрическое низкополигональное искусство

В этом руководстве была выбрана симметричная версия тренда с использованием Illustrator и Photoshop в сочетании с приложением под названием I ♥ ∆ для создания вершин.Это отличный урок, который поможет решить, сколько деталей должно быть в разных частях изображения.

Как создать автопортрет в геометрическом стиле

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