Как в фотошопе нарисовать человечка. В фотошопе нарисовать


Как в фотошопе нарисовать человечка - рисуем фигуру человека для иконки

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

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

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

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

Я буду использовать инструменты эллипс и прямоугольник. Только их. Больше мне не понадобится ничего!

Рисуем голову.

Теперь черед шеи. Рисуем небольшой прямоугольник. Сдвиньте его чуть влево.

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

Нам следует подтянуть появившиеся маркеры к центру.

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

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

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

Давайте приоденем иконку человечка. Пусть будет в ботиночках. Сделаем их при помощи двух эллипсов.

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

А теперь сделаем пальчики. Не надо пугаться. Я не призываю вас все десять прорисовывать. Просто наметим. Как набросок.

Сначала кисти.

Теперь сводим слои. Для этого можем воспользоваться комбинацией клавиш ctrl+shift+e. Ну и, конечно, сохраняем результат нашего труда.

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

Сохраните иконку-человека в формате Png, предварительно удалив задний слой, если собираете применить ее в дизайне сайта.

photoshop-work.ru

Как рисовать векторные фигуры в Photoshop, опции Заливка и Обводка

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

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

Чтобы убедиться, что вы рисуете векторные фигуры, а не контуры или пиксели, выберите опцию "Фигура" (Shape) из видов режимов инструмента в панели параметров:

фигураВыбор опции "Фигура" (Shape) на панели параметров

Заливка формы цветом

Следующее действие, которое мы, как правило, выполняем после выбора опции "Фигура", это выбор цвета, заполняющего форму, в версии Photoshop CS6 и выше, это делается с помощью клика по полю "Заливка" (Fill) в панели параметров:

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

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

  • Нет цвета (No Color) - белый прямоугольник с красной диагональной линией, заливка отсутствует
  • Чистый цвет (Solid Color) - заливка сплошным цветом
  • Градиент (Gradient) - заливка градиентом
  • Узор (Pattern) - залива Photoshop-узором (паттерном)

заливка фигурыРазличные методы заливки формы

Нет цвета (No Color)

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

Ниже показан простой пример того, как выглядит форма без заливки цветом. Все, что мы видим - это основной контур формы, который так и называется - "Контур" (Path). Контур отображается только в документе Photoshop, так что при сохранении вашей работы в формате JPEG или PNG, или при печати, контур виден не будет. Чтобы сделать его видимым, мы должны добавить к нему обводку, способы добавления которой мы рассмотрим далее:

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

Чистый цвет (Solid Color)

Чтобы заполнить вашу форму однотонным цветом, выбирайте опцию "Чистый цвет" (Solid Color) вторая иконка слева:

чистый цветОпция "Чистый цвет" (Solid Color) для заливки фигуры сплошным однотонным цветом

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

выбор цветаВыбор цвета нажатием на образец.

Если нужного вам цвета нет среди представленных образцов,нажмите на значок "Палитра цветов" (Color Picker), расположенный в правом верхнем углу окна:

выбор палитры цветовКлик на значок Color Picker для выбора собственного цвета.

Откроется диалоговое окно палитры цветов, выберите в неё цвет и нажмите OK, чтобы закрыть Color Picker после выбора нужного цвета.

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

заливка фигурыФигура, залитая цветом.

Заливка градиентом

Чтобы заполнить вашу форму градиентом, выберите опцию "Градиент" (Gradient). Затем нажмите на одну из миниатюр для выбора предустановленного градиента, или используйте миниатюру полосы градиента, расположенную ниже, для создания своего собственного варианта градиента.

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

Вот тот же форма, только теперь она заполнена градиентом:

форма залитая градиентомФорма, заполненная одним из предустановленных градиентов Photoshop.

Заливка узором (Patterns)

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

Ниже показана та же форма, на этот раз заполненная узором:

фигура залита узоромТа же форма, только на этот раз залитая стандартным узором Photoshop.

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

Добавление обводки к векторной фигуре

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

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

обводка векторной формыОпция добавления обводки.

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

В верхней части окна у нас есть те же самые четыре иконы для выбора типа заливки линии обводки, это "Нет цвета" (No Color), "Чистый цвет" (Solid Color), Градиент (Gradient) и "Узор" (Pattern). По умолчанию выбран вариант "Нет цвета". Я выберу тип "Чистый цвет" (Solid Color). Выбирать и назначать цвет обводки точно таким же образом, как и цвет заливки, о чем рассказано выше.

Изменение толщины обводки

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

ширина обводкиИзменение ширины и единиц измерения обводки.

Опция выравнивания краёв (Align Edges)

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

Дополнительные параметры обводки

По умолчанию, Photoshop рисует обводку в виде сплошной линии, но мы можем изменить это, нажав кнопку "Задать тип штриха фигуры" (Stroke Options ) на панели параметров:

штрихи обводкиКнопка окна выбора дополнительных свойств - выбор штриха обводки - сплошного, пунктирного, точечного и др.

Это открывает окно "Параметры обводки" (Stroke Options). В этом окне мы можем изменить тип линии со сплошной на пунктирную или состоящую из точек. Кроме этого, имеется три дополнительные опции обводки:

дополнительные параметры обводкиДиалоговое окно дополнительных параметров обводки

Опция "Выровнять" (Align) позволяет нам выбрать, будет ли обводка расположена внутри контура, снаружи или посередине.Следующая опция "Концы" (Caps) работает только в случае, если мы выбрали пунктирную обводку. Мы можем изменить вид концов отрезков.

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

"Углы" (Corners) позволяют изменить вид угла при стыке линий обводки. Угля могут быть острыми (по умолчанию), закруглёнными или скошенными. Эта опция работает, если обводка расположена снаружи или посередине контура. Если обводка внутри контура, углы всегда остаются острыми.

Нажатие на кнопку внизу окна "Другие параметры..." (More Options...) открывает ещё одно окно, где мы можем задать длину штрихов и разрывов между штрихами. Вот пример прямоугольной фигуры с заливкой и пунктирной обводкой с разными длинами штрихов:

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

rugraphics.ru

Как нарисовать прямую в фотошопе?

Здравствуй, мой любимый читатель. Вы когда-нибудь пытались нарисовать в Фотошопе таблицу, или заборчик, на вашей любимой фотографии? Или когда-то вы старались нарисовать цветную ровную полосочку? И у каждого появлялась такая проблема:  руки кривоватые, и не удаётся нарисовать линию прямой. Слава богу, цветную линию можем, а вот прямую совсем никак. Сегодня на нашем коротеньком уроке мы рассмотрим несколько вариантов, как исправить кривизну рук при помощи Фотошопа.

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

Instrumenti-videleniya

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

Poloska-videleniya

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

Zakrasivanie

Если вам понадобится нарисовать полоску длинной в один пиксель, тут нам придёт на помощь инструмент «Область (горизонтальная строка)» и «Область (вертикальная строка)». Этим инструментом пользоваться очень просто. Вы кликаете по рисунку, и исходя из вашей точки вертикально или горизонтально, в зависимости от того какой инструмент вы выбрали, появляется выделение в один пиксель. Но концы этого выделения нельзя установить. Выделение продлится от начала и до конца изображения. Так, что если вы произвели данное выделение и вам нужно указать концы, то вам придется, припороши других инструментов, вычитать из данной выделенной области.

Vichitanie-iz-stroki

Второй способ ещё прощё первого, и в этом способе нам уже не понадобятся инструменты «Градиент» и «Заливка». Выбрав один из инструментов, исключая два вышеупомянутых, кликаете в то место где будет располагаться начало линии, зажимаете волшебную и могущественную клавише “Shift”, и кликаете на то место, где планируете конец прямой линии. И, заметьте, этот способ действует со всеми инструментами «Кисть», «Карандаш» и «Ластик» и подобными им. Надеюсь, вы догадались, что ластик будет рисовать линию не цветом а дыркой в рисунке. Так же хотелось бы добавить, что используя этот метод рисования прямой линии, менять толщину вам придётся, изменяя диаметр кисти. Знайте, что все настройки данных инструментов, будут влиять на то, какой получится ваша линия.

Risovanie-pryamoi

Удачных вам нарисованных прямых заборчиков на ваших любимых фото! До свидания.

Обратите также внимание

borpost.ru


Смотрите также