Как раскрасить рисунок в фотошопе. Раскрашиваем черно-белую фотографию в Photoshop

ШАГ 1: ОТТЕНКИ СЕРОГО

Обычно я начинаю с эскиза на полотне формата А4 с разрешением 300dpi (точек на дюйм). Сначала делаю простой набросок общего силуэта, затем постепенно добавляю немного светотени. На этом этапе я продумываю наряд, корректирую позу и композицию, исправляю пропорции персонажа (чтобы легче заметить недочеты в рисунке, я часто отражаю полотно по горизонтали). Почти сразу я начинаю затенять лицо и добавлять разные детали в одежде, волосах, реквизите и т.д. Вся работа в оттенках серого проходит на одном слое; если я и вношу какие-то изменения на новом слое, то, убедившись в достижении желаемого результата, слои тут же объединяются в один единственный.

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

ШАГ 2: ЦВЕТА

Прежде чем начать раскрашивать серый рисунок, необходимо ознакомиться с различными режимами смешивания слоев. Выбрать режим наложения слоя и процент Непрозрачности (Opacity) можно в окне Слоев (Layers); там много разных режимов, и хоть некоторые их них могут показаться одинаковыми, каждый режим дает разный эффект. Экспериментируйте с ними, чтобы понять, какие из них дают более живые цвета, какие больше затемняют или осветляют цвета, и меняют их тональность. В данной работе я буду использовать следующие режимы наложения слоев: Мягкий свет (Soft Light), Наложение (Overlay) и Умножение (Multiply), однако я также иногда использую и другие режимы. Все зависит от конкретного рисунка. Не думайте, что есть какой-то фиксированный набор действий, которые вы должны совершать со слоями, чтобы добиться хорошего результата. Ищите то, что подходит для каждого конкретного случая.

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

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

Тот же слой в Нормальном режиме (Normal) при 100% Непрозрачности и без серого рисунка под ним будет выглядеть так:

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

Режим слоя: Мягкий свет (Soft Light)
Непрозрачность слоя (Opacity): 100%

Тот же слой в Нормальном режиме (Normal) при 100% Непрозрачности и без серого рисунка под ним будет выглядеть так:

Корректирую освещение с помощью еще одного слоя в режиме Наложение 50%.

Режим слоя: Наложение (Overlay)

Тот же слой в Нормальном режиме (Normal) при 100% Непрозрачности и без серого рисунка под ним будет выглядеть так:

Я использую слой в режиме Умножение (Multiply) для небольшого затемнения цветов; Непрозрачность устанавливаю для него 50%. Как видно на превью этого слоя в Нормальном режиме (ниже), я использую разные цвета для темных и светлых участков тела. Тональность также влияет на результат.

Режим слоя: Умножение (Multiply)
Непрозрачность слоя (Opacity): 50%

Тот же слой в Нормальном режиме (Normal) при 100% Непрозрачности и без серого рисунка под ним будет выглядеть так:

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

Режим слоя: Нормальный (Normal)
Непрозрачность слоя (Opacity): 70%

Режим слоя: Мягкий свет (Soft Light)
Непрозрачность слоя (Opacity): 100%

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

Слой - Новый корректирующий слой – Тон/Насыщенность (Layer – New adjusting layer – Hue/Saturation)

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

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

Коль скоро речь идёт о программном обеспечении, очевидно, что вам понадобится компьютер:). Версии Фотошоп для Макинтоша и РС-совместимых машин в принципе одинаковы, и отличаются в основном клавиатурными комбинациями "горячих" клавиш. Хотя в этих уроках мы будем ориентироваться на пользователей РС, у юзеров Макинтоша никаких проблем возникнуть не должно.
Итак, перед тем как начать, Вам понадобится:

1. Рисунок, с которым Вы будете работать. Мы предполагаем, что Вы нарисовали картинку на бумаге и хотите её отсканировать и раскрасить.

2. Сканер. Реально, любой современный сканер, который вы можете приобрести, будет нормально работать, даже дешёвенький за 60$. Лично мне нравится Hewlett Packard и, коль скоро я использую его для Анимации, я использую устройство автоподачи листов. У меня HP ScanJet, 6350, который относится к разряду высококлассных сканеров.

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

4. Стол с подсветкой (Стол Аниматора). Мой первый Анимационный стол был самодельным, просто коробка с дыркой наверху, закрытой стеклом, и с лампочкой внутри. Лучше, если вместо стекла будет оргстекло или пластик. Они не так сильно нагреваются. Можно найти хорошие модели Аниматорских столов за $100-$150 (не в России, конечно;) - прим. перев.)

5. Для работы необходима лицензионная копия Photoshop 4.0 или выше. Все иллюстрации сделаны для 6.0, но в конечном счёте, все версии Фотошоп похожи.

6. Графический планшет от Wacom. Если Вы не можете его себе позволить, но всерьёз относитесь к своим рисункам, я настойчиво рекомендую Вам его приобрести. Пускай даже это будет Планшет из относительно недорогой Graphire series from Wacom.

Подготовка Вашего рисунка к сканированию.

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

Положите чистый лист бумаги поверх вашего исходного рисунка и скрепите их скрепкой. Таким образом, верх бумаги не сместится в процессе рисования, и Вы не испортите свой рисунок. С помощью стола с подсветкой, обведите весь рисунок чернилами. (Мы пользуемся MicronPigma inking pens толщиной 0.3 мм). Убедитесь, что все линии соединены друг с другом (это облегчит Вам работу, когда вы будете раскрашивать рисунок). Особо не напрягайтесь, и если где-то сделаете ошибочные линии - их можно будет довольно просто убрать на компьютере.

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

Сканирование Рисунка.

Рисунок для сканирования должен быть достаточно чистым. Вот маленький совет: чтобы добиться реальной гладкости линий... Сканируйте чистовой рисунок как 2-х цветное чёрно-белое изображение. Не следует использовать режим сканирования в цвете и в оттенках серого - на данном этапе необходимо избежать любого сглаживания. Разрешение при сканировании порядка 300 точек на дюйм подойдёт, если вы планируете распечатывать Вашу работу, но отнимет много оперативной памяти. Если же Вы работаете в первый раз, то можно сканировать и в 100 dpi.

*Замечание*. Все сканеры работают по разному. Лично я использую программку, которая поставлялась со сканером, но можно сканировать напрямую в Фотошоп, используя драйвер "Twain".

Итак, откройте Ваш чистовой рисунок в Фотошоп. Первым делом преобразуйте Ваш рисунок в RGB - формат (цветовой режим, который мы будем использовать). Если этого не сделать, то у Вас не будет возможности раскрасить рисунок.Если напрямую в RGB изображение преобразовать не удаётся, то переведите рисунок в чёрно-белый полутоновой, а затем в RGB.

Фотошоп: изучаем окна.

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

Первое из окон - окно Info. Оно чрезвычайно полезно для различных точных подгонок и измерений. Второе окно должно содержать вкладки History и Actions. Во вкладке History находятся сведения о всех изменениях, которые Вы производили с изображением. Если Вы, допустим, открыли изображение и сменили цветовой режим, то там будут записи типа: "Open, Grayscale, RGB Color". Вы можете использовать вкладку History в случае, если захотите отменить не одно, а несколько последних действий. Вкладка Actions позволяет работать с макросами, или назначать определённые команды неким клавиатурным комбинациям ("горячие" клавиши). Отдельное окно должно содержать три вкладки: layers, channels, and paths. Обратим внимание на вкладку Layers. В нашем случае там есть один слой (вероятно, он назван по умолчанию - background). Идея заключается в том, что можно создать несколько слоёв один поверх другого в одном изображении, и их можно редактировать независимо друг от друга. По умолчанию Фотошоп создаёт слой "background", и этот слой имеет некоторые ограничения по работе с ним. Два раза кликните на названии слоя, чтобы переименовать его во что-нибудь более подходящее. (например, "слой 0). Это разблокирует ограничения, которые имеет "background" и вы сможете спокойно работать с этим слоем. Также можно кликнуть на имени слоя правой кнопкой мышки, и выбрать пункт "Layer properties".

У каждого слоя в окне Layer есть две иконки. Иконка с глазом указывает на то, что слой видимый. Если нужно сделать слой невидимым, кликните по иконке с глазом, чтобы он исчез. Затем кликните вновь, чтобы он появился. Иконка с кисточкой показывает, с каким слоем на данный момент Вы работаете. "Всегда" проверяйте, что Вы работаете с нужным слоем. Очень обидно проделать большую работу, а в конце узнать, что всё сделано не на том слое...

Фотошоп: панель инструментов.

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

А вот список горячих клавиш, используемых при работе с Фотошопом. Очень важно знать основные клавиатурные команды, особенно Zoom и Pan. (масштаб картинки и навигация по ней). Это позволит вам сэкономить уйму времени.


Теперь можно приступать к обработке Вашего рисунка. На панели инструментов выберите Pencil tool и сделайте цвет рисования белым. Это можно сделать, кликнув на квадратике "foreground color" и выбрав белый цвет. Также можно использовать горячие клавиши: при нажатом Alt кликните по той части изображения, которая содержит нужный цвет. Курсор при этом примет вид пипетки.

Используйте белый цвет, чтобы стереть ненужные и подправить нужные линии на Вашем изображении. НЕ ИСПОЛЬЗУЙТЕ Erase Tool! Если вы примените ластик, то Фотошоп, чтобы показать разницу между белым и пустым, пометит след от этого инструмента клеточками. Нам сейчас гораздо проще использовать белый цвет вместо стирательной резинки.

В процессе работы над корректировкой рисунка, вам могут быть полезны следующие клавиатурные комбинации: Для увеличения рисунка (Zoom) нажмите одновременно пробел и ctrl и кликните на рисунке. Для уменьшения масштаба используйте пробел, ctrl и Alt и кликните мышкой на картинке. Чтобы перемещаться по большому изображению (Pan Tool) - держите нажатым пробел и перемещайте картинку мышкой.

Вы можете изменять размер кисти, кликнув на pencil Tool. Автоматически появится владка панели инструментов, и Вы можете изменить размер кисти, выбрав нужный (такая панелька открывается для большинства инструментов). Во всех версиях Фотошоп, ниже шестой, кисти находятся в окне установок (Brushes).

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

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

Фотошоп: Раскраска изображения.

Между делом, Вы сохраняете периодически Ваш проект??? Нажмите Ctrl S чтобы быстро сохранить вашу картинку. Когда Вы покончите с подчисткой всех линий (и удостоверитесь, что все контуры замкнуты) можно смело приступать к раскрашиванию изображения. Кликните на инструменте "Заливка" (paintbucket tool) и убедитесь, что сглаживание выключено (antialiasing off) а допуск (tolerance) установлен на 0. Также, следует отключить сглаживание и поставить допуск на 0 и для других инструментов. Пока нам не понадобиться ни сглаживание, ни градиенты. Выберите цвета для раскрашивания и, с помощью инструмента заливки, закрасьте различные участки Вашего изображения. Если Вы хорошо поработали с контурами, заливка будет лёгкой.

Если Вы хотите, чтобы ваше изображение действительно круто смотрелось, то можете раскрасить и характерные линии. Здесь есть свои хитрости, так что... оставайтесь с нами:)) Итак, мы будем редактировать только чёрные линии изображения, для чего будем использовать маску (вот одна из причин, по которой мы стараемся избегать сглаживания). Выберите инструмент "волшебная палочка" (magic wand), установив antialiasing на off tolerance на 0. Кликните где угодно на чёрном (на линии). Контур выделится пунктирной линией. Теперь нужно выбрать все линии рисунка. Для этого в верхнем меню выберете select => similar. Это выделит все чёрные линии на рисунке.

Лично я люблю прятать выделение, чтобы мне не мешали работать пунктирные линии. Их можно спрятать, нажав ctrl H. Не волнуйтесь, чёрные линии всё ещё выделены... этого просто не видно. Теперь мы можем снова использовать карандаш (pencil tool) и выбрать цвет для раскрашивания линий. В целом, линии должны быть того же цвета, что и сам объект, только темнее. Тоесть светло-синий участок требует тёмно-синих линий. Итак, раскрасьте линии с помощью pencil tool. Если вы сделали маску правильно, то все изменения коснуться только линий.

Когда закончите, нажмите ctrl D, чтобы убрать выделение. Пока Вы этого не сделаете, рисовать можно будет только на выделенных линиях.

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

ФОТОШОП: Тени

Итак, приступим к прорисовке теней. Эту технику иногда называют "cell shading", потому что она использует однотонные цвета для определения затенённых участков. Такое часто встречается в мультипликации. За последние 10 лет эта технология стала несколько другой благодаря развитию цифровых технологий, которые позволяют невероятно просто размыть границу между светом и тенью. Но сам процесс не меняется.

Настало время создать новый слой. Мы больше не будем изменять сам рисунок, мы просто затеним некоторые участки поверх него. Удобство такого решения заключается в том, что в дальнейшем мы запросто сможем изменить цвет персонажа, не переделывая тени. Найдите окно со слоями (layers window). Видите небольшие иконки внизу окошка? На одной из них изображён мусорный бачок, на соседней - лист бумаги с загнутым уголком. Кликните на последней, и новый слой создан! Довольно прикольный фокус:). Если есть желание создать ещё несколько слоёв, то можно продолжать кликать по этой иконке, пока не получите нужное их количество. В версиях фотошоп, ниже шестой, число слоёв было ограничено 99 (да, были случаи, когда мне и этого не хватало). Для удаления слоя перетащите его на иконку с мусорным бачком. Если нужно скопировать слой, перетяните его на иконку "новый слой" ("new layer").

С этого момента всегда проверяйте, на каком слое вы работаете. Удостоверьтесь, что вы работаете на нужном слое! Короче, надеюсь, что с этим ясно:). Окошко "слои" содержит ползунок "прозрачность" (opacity slider), который по умолчанию установлен на 100% (полная непрозрачность). Уменьшение данного параметра приведёт к увеличению прозрачности слоя. Для создания теней мы будем использовать чёрный цвет, а чтобы тень имела оттенок, она должна быть полупрозрачной.

Кликните на ползунке "прозрачность" и установите значение на 60%. Теперь выберите инструмент "карандаш" (pencil tool), сделайте цвет рисования чёрным и порисуйте где-нибудь на этом слое. Видно, что через чёрный просвечивает слой, расположенный ниже. Если Вы ничего не видите сквозь чёрный значит, нужно сменить прозрачность. Используйте чёрный цвет для рисования затенённых участков, и используйте ластик (eraser tool) (с теми же установками, что и для карандаша) для стирания. В данном случае нужно пользоваться ластиком, а не белой краской, как мы делали раньше.

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

Собственно говоря, вот и всё, что я делаю с тенями. Мне нравится, когда тени смотрятся чисто, резко, в "мультяшном" стиле. Но если вы хотите их смягчить, то следует использовать Гауссово Размытие (Gaussian Blur). Откройте меню "Фильтры", а затем-> Blur->Gaussian Blur. Подвигайте ползунок, пока не добьётесь нужного результата. Не переусердствуйте с размытием, а то тень просто исчезнет!

Итак, нарисовав тени, следует убрать те участки, которые находятся вне персонажа. Выберите "волшебную палочку" (magic wand). Вернитесь на слой с самим рисунком, (в нашем примере - layer 0) и выделите пространство вокруг персонажа. Возможно, вам продётся выделить не один участок (участки между руками и т.д.). Удерживая клавишу shift во время выделения, можно выделить сразу несколько областей (нажатый alt делает всё наоборот - убирает выделение).

После того, как Вы выбрали всё пространство вокруг персонажа, нажмите клавишу delete. Эта операция уберёт белый фон вокруг рисунка, заменив его клеточной текстурой. Ей обозначена "чистая" область рисунка. Не отменяйте выделение! Перейдите на слой с тенями и опять нажмите delete. Когда вы рисовали тени, они наверняка вылезли за пределы рисунка. Таким образом вы удаляете лишние, вылезшие участки. Ну и под конец, можно поиграть с прозрачностью, изменяя вид теней. Лично я обычно использую прозрачность 20-40%, в зависимости от ситуации.

Фотошоп: блики

Как правило, я рисую блики света на шерстке моих персонажей. Чтобы сделать их, проделайте следующее. Переключитесь на слой с исходным рисунком. С помощью волшебной палочки выделите ту часть рисунка, с которой вы будете работать. Теперь создайте новый слой, и перейдите на него. Выберите инструмент "airbrush" и прочертите им линию поперёк волос. Если причёска слишком светлая, (как, например, у Springkitty [вероятно, так зовут персонажа из примера - прим.перев.]), то можно её немного притемнить в районе будущего блика, перед тем, как рисовать белую полоску. Можно оставить так, а можно добавить немного разнообразия с помощью "smudge tool". Выберите "smudge tool" и размажьте блик вверх и вниз по причёске, сделав его чуток полосатым. Для большей реалистичности следует взять более тонкую кисть.

На следующем рисунке я просто подрисовал блик белой краской, на новом слое с помощью airbrush.

Фотошоп: Работа с готовым рисунком.

Сохраните ваш рисунок. Зачастую есть смысл сохранять рисунок как отдельные файлы (image1.psd, image2.psd, etc) на тот случай, если файл вдруг повредится. Я потерял кучу файлов, когда Фотошоп зависал в процессе сохранения. Обычно я сохраняю изображение до объединения слоёв - на тот случай, чтобы потом его можно было бы изменить.

Сохранение для Интернет...

Для начала, нужно слить все слои воедино. Для чего в меню Layer выберите пункт Flatten Image. Теперь нужно масштабировать рисунок в подходящий для И-нета размер. С моей точки зрения, 600 точек по наибольшей стороне - самое то. Однако, выбор за вами.Если вы хотите посмотреть, как выглядит изображение после уменьшения, дважды кликните по иконке с увеличительным стеклом ("magnifying glass") на панели инструментов. Изображение примет оригинальный размер. В меню File выберите пункт Save for Web (только в версии 5 и выше). Чем меньшее качество картинки вы выберете, тем быстрее ваш рисунок будет грузится. Сохраняйте как JPG или GIF. (gif лучше для картинок в ограниченным количеством цветов, jpg - для полноцветных картинок).

Для печати...

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

Фотошоп - не та программа, из которой лучше всего печатать, но если вы всё же решите это сделать, следует первым делом проверить, соответствует ли размер изображения размеру бумаги. Вы можете проверить это, зайдя в меню "image"->"image size", и вы увидите, как ого размера будет распечатанное изображение. Параметр DPI следует установить на 300, если это возможно, хотя это и не обязательно. В то же время, не советую ставить ниже 100. Ну и под конец те, кто будет печатать на настоящем печатном станке, должны конвертировать свою работу в цветовое пространство CMYK (а лучше сразу начинать работу в CMYK). Впрочем, это уже выходит за рамки данного урока. Собственно, на этом первый урок по Фотошоп закончен. Надеюсь, что он вам понравился и помог сделать ваши работы более профессиональными:)

Translated by Digital Antoon

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


1. Основные рабочие области фотошопа;

2. «Плоские» цвета;

3. Свет и тень;

4. Cell Shading;

5. Блики;

6. Заключительная обработка;

Основные рабочие области фотошопа

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

Это панель слоев, цвета и рабочая панель.



На заметку: Давайте вашим слоям простые и понятные названия.


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

«Плоские» цвета

Часть 1

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


Звучит довольно просто, верно? Давайте применим этот способ на практике. Но сначала убедитесь, что ваш рисунок готов к покраске!


Итак, наша черно-белая картинка открыта в Фотошопе, контур идеален и готов к покраске.

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

Часть 2

1. Создайте новый слой, залейте его белым цветом (Shift+F5) и поместите под слой с контуром. После чего выделите слой с контуром и перейдите во вкладку « » (Окно «Каналы»).

2. Нажмите на кружочек, расположенный на панельке внизу.

3. Нажмите Delete на клавиатуре, чтобы удалить весь белый цвет и оставить на слое только контур вашего рисунка.

Часть 3

Теперь мы, наконец, можем приступить к покраске нашего рисунка!

Для начала добавьте новый слой и поместите его между слоями 1 и 2 .

Для удобства давайте переименуем наши слои. Слой с контуром назовем «Line », самый нижний слой с фоном «background », а только что созданный нами слой на который мы начнем накладывать наши «плоские » цвета (начиная с кожи) – «Skin ».

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

На заметку: Панель настроек вверху будет меняться в зависимости от выбранного вами инструмента.

Часть 4

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

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

Обратите внимание, что между выделением и контуром остается пространство, но нам - то нужно идеальное выделение!

Чтобы исправить эту ошибку, переходим через меню (Выделение - Модификация - Расширить) и ставим значение 2 пикселя.

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



Часть 5

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

Выберите слой «Skin », затем перейдите через меню (Редактирование - Выполнить заливку / Сочетание клавиш «Shift+F5») и используйте следующие параметры:

Поздравляю, вы закрасили свою первую «плоскость »!


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


Не забывайте каждую часть закрашивать на новом слое!

Свет и тень

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


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


Давайте применим эти знания к нашему персонажу.

Ниже приведены два примера с разным источником света.

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



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

Cell Shading

Часть 1

ОК, у нас есть «плоско » раскрашенный рисунок и понятие о важности света и тени. Пришло время реального веселья!

Первое, что нужно сделать, это создать слой с тенью прямо под слоем «Lines ». Назовем новый слой «Shadow 1 ».

Выбрав слой «Shadow 1 », кликните по меню режима наложения и в выпадающем меню выберите « » (Линейный затемнитель).

Режимы наложения

На картинках ниже вы можете увидеть различные варианты наложения.

Мы нарисовали простую симпатичную звездочку на слое «Shadow 1 » и попробовали изменить режим наложения.



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


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


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


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


Для нашего урока мы будем использовать режим « » (Линейный затемнитель).

Часть 2

Итак, теперь, когда у нас есть слой «Shadow 1 », давайте начнем накладывать наши тени.


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

Не старайтесь выбрать точно такой- же серый, как у нас. Просто запомните, чем темнее выбранный серый цвет, тем темнее он будет на вашем слое «Shadow 1 ».


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


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


Звучит просто, да? Давайте используем это на нашей девушке.


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

Часть 3

Теперь осталось заполнить наше выделение цветом.


С активным слоем «Shadow 1 » мы переходим через меню (Редактирование - Выполнить заливку / Сочетание клавиш «Shift+F5»).


Как и раньше появится всплывающее окно, однако в этот раз вместо того, что бы выбрать «Color » (Цвет) мы выберем «Foreground Color » (Основной цвет) и нажмем ОК . Так как мы уж выбрали серый цвет ранее, выделение автоматически заполнится нужным нам цветом.


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


Но мы еще не закончили. Сейчас наша тень выглядит слишком темной. Чтобы сделать ее более естественной изменим «Opacity » (Непрозрачность) слоя на 50% .

Теперь наша тень окончательно готова. Используя ту же технологию, завершите затенение лица девушки.

Не забывайте об источнике света!

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

Часть 4

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

Однако, многие аниме-персонажи имеют больше, чем один уровень теней, что придает изображению еще большую глубину. Сможем ли мы применить это и к нашему изображению? Конечно, сможем! Это так же просто, как добавить еще один слой с тенью поверх слоя «Shadow 1 ».


Добавьте новый слой и назовите его «Shadow 2 ». Режим наложения - (Линейный затемнитель), «Opacity » (Непрозрачность) - 50% ».



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


Итак, давайте закончим с тенями.

Блики

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

Пока все хорошо, но есть ощущение, что чего - то не хватает. А как насчет областей, где наш свет особенно ярок?

Там располагаются блики, которые сделают нашу работу еще более профессиональной.


Это довольно просто! Для этого создадим новый слой и назовем его «Highlight 1 ». Режим наложения – (Перекрытие).


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

Обратите внимание, как режим слоя « » (Перекрытие) сочетается с белым цветом.

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

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

Заключительная обработка

Часть 1

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


Можете похлопать себе, Вы молодцы!


В заключении мы хотим показать вам несколько забавных хитростей, чтобы окончательно «отполировать » вашу работу.

И все ваши критики скажут «Вау, это действительно круто! ».


Мы собираемся добавить «layer fx » (стиль слоя) вашему цветному изображению.


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


Дважды щелкните правой кнопкой мыши на слое «Shadow 1 », что бы открыть панель «layer fx » ( (Параметры наложения)).



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


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


Как бы сложно это не звучало, но применение «стилей » в Фотошопе значительно сэкономит время вашей работы.


В нашем уроке мы будем применять только эффект « » (Внешнее свечение).

Этот эффект мы применим только к слоям «Shadow 1 » и «Shadow 2 ».


В окне «Layer Style » (Стиль слоя) выберите эффект « » (Внешнее свечение) из списка слева.

Часть 2

Теперь мы можем изменить свойства нашего слоя.

Выбрав нужный нам эффект настройте «Внешнее свечение », как показано на рисунке.


Что мы делаем в настройках? Добавляем небольшое свечение, используя серый цвет, и меняем режим наложения на « » (Линейный затемнитель).


Примените этот же эффект к слою «Shadow 2 ».

Мы скрыли слой с бликами, чтобы сосредоточиться на разнице в «стиле слоя ».

Заметьте, что граница между тенями и «плоскими цветами » стала мягче. Намного лучше, м?

Часть 3

Мы почти у финиша, да! Но прежде чем закончить мы поделимся с вами еще одним секретом.


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


Сначала создадим новый слой и назовем его «Lighting ». Расположим этот слой прямо под слоем с контуром, выше слоя «Highlight 1 ».


Измените режим наложения этого слоя на « » (Цветность) и установите непрозрачность где-то на 30% .

Теперь выберите инструмент « » (Инструмент «Заливка» / Клавиша «G»), выберите базовый цвет по своему желанию и залейте слой цветом.

Мы использовали ярко-оранжевый цвет.

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

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

Финальный результат

Переводчик: KimikoAyam aka Xima;

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

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

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

Шаг 1

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

Шаг 2

На старых фотографиях часто видны царапины и следы пыли, и хотя их удаление не планировалось в этом уроке этом уроке, от нескольких слишком заметных царапин на этой фотографии придется избавиться. Это можно сделать с помощью инструмента Clone Stamp (Штамп) (S), выбрав для нашего примера мягкую кисть размером 60 рх.

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


Шаг 3

Теперь, удалив заметные дефекты, можно приступать к окрашиванию. Первый способ включает выделение окрашиваемой области и добавление цвета посредством коррекции Hue/Saturation (Цветовой тон/Насыщенность). Для выделения платья, контур которого содержит много прямых линий, здесь использован инструмент Polygonal Lasso (Прямолинейное лассо).

Примечание: Нажав пробел, можно как угодно перетаскивать холст, не прерывая процесс выделения, а комбинации Ctrl/Cmd со знаками "-" или "+" позволят изменять масштаб, не включая инструмент Zoom (Масштаб).

Шаг 4

Выделив верхнюю часть платья, передвиньте холст и, нажав Shift, выделите остальное. С клавишей Shift новая область будет добавляться к выделенной, а с клавишей Alt/Option вычитаться. Полностью выделив окрашиваемый объект, нужно сгладить контур выделения, перейдя в Selection > Refine Edge (Выделение > Уточнить край) и указав для параметра feather (растушевка) значение 1 рх.

Затем зайдите в Image > Adjustments > Hue/Saturation (Изображение > Коррекция > Цветовой тон/Насыщенность) и, отметив галочкой чек-бокс Colorize (Тонирование), подберите желаемый цвет.
Примечание: Прежде чем снять выделение, можете на всякий случай сохранить его, выбрав Select > Save Selection (Выделение > Сохранить выделенную область). Это позволит быстро загрузить выделение, когда понадобится добавить оттенок.

Шаг 5

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

Шаг 6

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

Создайте новый слой, кликнув на иконке с подсказкой Create a New Layer (Создать новый слой) на палитре слоев внизу. Затем выберите мягкую кисть и раскрасьте фотографию в контуре выделенной области, подбирая желаемые краски и регулируя размер кисти. Для удобства можно временно уменьшить непрозрачность (opacity) нового слоя.

Не беспокойтесь – это еще не конечный результат!

Шаг 7

Разверните список режимов наложения слоев и выберите для раскрашенного слоя один из этих: Multiply (Умножение), Overlay (Перекрытие), Soft Light (Мягкий свет), или Color (Цветность), что будет зависеть от вашего изображения. Здесь выбран режим Soft Light (Мягкий свет) и непрозрачность (opacity) снижена до 44%.

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

Чтобы создать произведение искусства, не обязательно иметь сложное программное обеспечение вроде Photoshop! MS Paint, который есть во всех версиях Microsoft Windows, - вполне подходящая для этого программа, с помощью которой вы можете создавать интересные картинки. Эта статья wikiHow расскажет вам, как использовать старые и новые версии этой программы, а также даст несколько полезных советов. Итак, начнем с Шага 1!

Шаги

Использование классического Paint

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

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

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

    • Значок инструмента Заливка выглядит как выливающееся ведро краски.
  1. Нарисуйте границы затенения. Используйте Карандаш, чтобы нарисовать линии, которые будут ограничивать зоны затенения. Ничего страшного, если она чуть-чуть пересечется с черными краями. Это потом можно будет легко поправить. Цвет, которым вы рисуете эти линии, должен быть таким же, какой вы будете использовать для зон затенения и подсветки.

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

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

    Готово! Вы можете добавить больше деталей и текстур, но это основа процесса. Продолжайте практиковаться!

Использование нового Paint

    Работайте с большими размерами файлов. Так как MS Paint работает с пикселями, если вы хотите создать по-настоящему хороший рисунок, вам следует увеличить размер холста. Это можно сделать, нажав на кнопку изменения размера и установив размеры больше 2000 пикселей.

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

    • Если у вас есть возможность отсканировать ваш набросок, просто откройте файл в программе MS Paint, чтобы доработать его до классного рисунка, но убедитесь, что у вас где-то сохранилась и копия отсканированного варианта (на случай, если вы ошибетесь, и вам нужно будет начать заново).
  1. Нарисуйте основные линии. Используя инструмент Кривая линия, сделайте основные линии рисунка, используя черный цвет. Найдите значок с длинной кривой линией (похожей на брови) и кликните на начале и конце линии. Затем, используя мышь, захватите полученную ровную линию и выгните ее в дугу в соответствии с вашим наброском. Повторяйте действия, пока ваш набросок не будет полностью воспроизведен в черном цвете.

    • Использование именно черного цвета очень важно. Вы всегда сможете изменить цвет этих линий обводки потом, но пока делайте их черными.
  2. Уберите черновые линии. Пора избавиться от линий первоначального наброска! Нажмите Выделить, щелкните правой кнопкой мыши на рисунке и затем выберите Инвертировать цвета. Затем переключите из цветного в черно-белый формат, выбрав Файл → Свойства. Нажмите OK, пусть переключится режим, а затем таким же способом верните рисунок в цветной режим. Теперь еще раз инвертируйте рисунок, и у вас получится чистая картинка.

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

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

    Создайте "слои". Теперь время избавиться от цветов, которые выходят за границы линий! Уменьшите масштаб так, чтобы видеть весь рисунок, Нажмите Выделить, щелкните правой кнопкой мыши на рисунке и вставьте рисунок, скопированный ранее. А теперь немного магии. Нажмите на стрелочку под кнопкой Выделить. Затем установите галочку Прозрачное выделение. Та-дам!

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

Изучение того, что вы можете сделать

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

  1. Делайте те изменения, которые можете сделать. Знайте, какие изменения вы можете сделать в таком существующем изображении, как фотография. MS Paint - это не Photoshop, но с его помощью можно сделать некоторые хитрости. Например, вы можете сделать следующее:

    • Обрезать изображение. Обрезка в MS paint на самом деле намного проще, чем в других программах, так как вам нужно всего лишь перетащить углы изображения.
    • Скрыть небольшие проблемы. Копирование и вставка небольших выделенных кусочков изображения поможет легко "залепить" некоторые небольшие недостатки изображения, если вы, конечно, достаточно терпеливы.
    • Откорректировать эффект красных глаз. Если у вас есть небольшие участки с темными пикселями, вы можете просто скопировать и вставить, или если вы чувствуете, что можете это сделать инструментами для рисования, то избавление от эффекта красных глаз вполне выполнимая задача в таких программах как MS Paint.
  2. Поэкспериментируйте с другими программами. Если вы используете MS Paint просто потому, что думаете, что не сможете достать лучшую программу, не беспокойтесь. Есть несколько вариантов. Обязательно проверьте вот эти варианты, которые могут помочь вам на вашей дороге к мастерству рисования:

    • Одна из программ, которая может быть вам полезна - это бесплатная программа Oekaki. По виду она напоминает MS Paint, но имеет больше возможностей. Вам даже не обязательно что-то скачивать. На многих сайтах Oekaki работает как апплет, запускаемый на вашем браузере. Эта программа позволит вам создавать настоящие слои, как в Photoshop, а это означает, что вы сможете создавать более красивые картины.
    • Если вы хотите использовать более мощную программу, но не хотите платить за Photoshop, есть и другие варианты. Paint Tool Sai, Manga Studio и многие другие программы, которые схожи с Photoshop, можно купить всего за $20-50 (700 - 1800 руб).
  • Сохранение в формате GIF подойдет для ровных цветов (т.е. для рисунков без затенений) и анимации, PNG лучше всего подходит для работ с затенениями, а JPEG лучше всего для фотографий. Использовать BMP не рекомендуется, потому что вы скорее всего потеряете в качестве цвета. Имейте это в виду, когда будете сохранять свои рисунки.
  • Попрактикуйтесь и побалуйтесь с другими инструментами, пока вы их не освоите.
  • Вы можете увеличивать и уменьшать масштаб, если вам неудобно работать с рисунком, просто нажав "Вид" и затем "Масштаб" в левом верхнем углу экрана.
  • При использовании инструмента Заливка убедитесь, что все пиксели одного цвета соединены между собой. Использование заливки в случае пробелов в граничной линии приведет к тому, что закрасятся и другие участки.
  • Повторение - мать учения!