Как в фотошопе раскрасить рисунок: Как раскрасить картинку в Фотошопе


30.05.2019 Facebook Twitter LinkedIn Google+ Разное


Содержание

Как раскрасить картинку в Фотошопе

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

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

Раскрашивание картинки в программе Adobe Photoshop

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

Что такое рабочая среда и как ее настроить

По-другому рабочую среду многие пользователи нередко именуют «Рабочим пространством».

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

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

Набор «Из коробки» имеет такой вид

и следующие свойства:

  • Все вкладки окон можно передвигать в любое место, которое для вас будет удобным.
  • Можно убрать ненужные панели. Для этого нужно щелкнуть мышью по требуемой панели (правой кнопкой) и в появившемся списке команд нажать на «Закрыть».
  • Также имеется возможность добавления дополнительных панелей. Сделать это можно, выбрав соответствующие пункты во вкладке «Окно» в главном меню.

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

Так как в процессе работы нам ни раз потребуется обращаться к этому инструменту. Добавьте эту панель и разместите в удобном для вас месте.

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

Ластик, карандаш и кисть

Эти три инструмента являются основными при работе над раскрашиванием картинки в программе Adobe Photoshop.

  1. Кисти.
    С помощью этого инструмента выполняется закрашивание некоторых областей на картинке, создание теней и бликов, а также создаются прямые линии.
  2. Карандаш.
    Этот инструмент в основном применяется для создания контуров объекта и их обводки.
  3. Ластик.
    С этим инструментом наверняка все понятно и без пояснений. Его назначение, конечно же, – стирание лишнего на изображении.

Микс-кисть и палец

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

  1. Палец.

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

Инструменты выделения и перо

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

  1. Перо.
    Это универсальный инструмент, предназначенный для обводки (прорисовки) элементов картинки. Перо отличается высокой точностью и четкостью прорисованного контура. После создания контура объекта его можно залить цветом, результат при этом будет практически идеальным.
  2. Инструменты выделения.
    • Лассо.
      Инструменты этой группы предназначены для обводки контура объекта произвольной формы.
    • Группа инструментов «Выделение».
      Находящиеся в этой группе инструменты подходят для создания выделения контура областей четкой формы (прямоугольной, круглой, овальной и т.п.). После создания выделения, можно произвести заливку цветом полученного контура объекта.
    • Быстрое выделение и волшебная палочка.
      С помощью этих двух инструментов можно быстро выделить область рисунка. При условии, что выделяемый объект ограничен от других одним цветом или контуром.

Градиент и заливка

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

Образцы и цвета

Фоновый цвет – значение этого параметра иногда очень важно при использовании ряда фильтров. Значение конечной точки градиента так же равно значению фонового цвета.

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

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

Смена основного цвета и фонового цвета осуществляется двумя путями:

  1. Через палитру цветов.
    Щелкните мышью по окошку основного цвета на панели инструментов и в открывшейся вкладке «Палитра цветов» кликните по требуемому цвету.
    После чего подтвердите действие, кликнув на ОК.
    Смена фонового цвета осуществляется аналогично.
  2. Через образцы.
    Как вы помните, в начале урока мы настраивали рабочую среду для раскрашивания картинки. В нее входит и панель образов цветов, включающая 122 цветовых оттенка.
    Для смены основного цвета требуется один раз кликнуть по нужному образцу цвета.
    Для замены фонового – щелкаем мыши по требуемому цвету с зажатой кнопкой CTRL.

Применение стилей

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

Для вызова вкладки с настройками стилей дважды щелкните мышью по нужному слою. Или кликните на слой правой кнопкой мыши и выберите “Параметры наложения”.

Работа со слоями

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

Практический пример

Для практического примера по раскрашиванию картинки в фотошоп нам потребуется контур рисунка.

Мы подобрали подходящую черно-белую картинку – рыбку. Исходное изображение имело белый фон, который мы удалили.

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

  1. Берем инструмент “Заливка”, выбираем нужные цвет в палитре в качестве основного и начинаем закрашивать нашу рыбку. Мы закрасим основную часть тела желтым цветом:
  2. Затем закрасим остальные участки теми цветами, которыми пожелаем. У нас получилась такая рыбка:
    Но, это далеко не все. Давайте придадим нашей рыбке объем.
  3. Берем волшебную палочку и кликаем по желтому цвету, тем самым выделив все участки с желтым цветом:
  4. После, создаем новый слой и переходим на него, в панели инструментов выбираем градиент и, настроив необходимые параметры заливки, проходим по нашей картинке (см. скриншот ниже):
    Проделываем те же действия с глазами и остальным частями. Получаем такой результат:

Согласитесь, получилось весьма неплохо. Можно поиграться еще и со стилями слоев, но, в целом, мы уже раскрасили наш объект.

Таким образом, мы показали вам простой способ, как раскрасить картинку в Фотошопе, используя всего 3 инструмента: “волшебная палочка”, “заливка” и “градиент”.

До встречи в следующих уроках!

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

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

А также я покажу вам, из чего состоит цифровая иллюстрация.

И так приступим…

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

Необходимо знать, как правильно использовать слои для цвета (например, какой выбрать параметр для слоя «normal» или «multiply» или в каком порядке выставлять слои).

Все это может показаться очень трудным, но не невозможным.

Ниже находиться «визуальное» объяснение того, что мы создадим:

Описание изображения (снизу вверх):

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

2 –« lineart», слой с контуром, параметры слоя могут быть установлены на «normal»(в данном случае) или «multiply».

3 – «base colors», группа слоев которая включает в себя все слои с основными цветами (имейте в виду, что каждый цвет имеет свой слой), параметры слоя «multiply».

4 –«shadows», группа слоев, которая включает в себя все слои с тенями (каждый цвет тени имеет свой слой), каждый слой с параметром «multiply».

5 – «lights» последний слой, на котором рисуются блики, как правило, он находиться выше всех других слоев. Параметр слоя «normal» или «multiply».

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

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

ЦВЕТ!

1) Откройте файл, с которого вы срисовывали и поставьте его рядом с созданным контуром. Я предлагаю вам пересохранить свою работу в новый файл с именем, например, «FanartColour1» или как вам нравиться, для этого идем File>Save As (Файл>Сохранить как).

Не забывайте сохранять свою работу часто и в процессе окраски. Если вы сделаете что-то необратимое, то вы всегда сможете загрузить предыдущее сохранение. В конце работы у вас может быть «FanartColour1», «FanartColour2», «FanartColour3», и т.д. … XD. Но главное не испортить свою работу! 

2) Я всегда начинаю окраску с кожи. Моя последовательность: кожа, волосы, глаза, одежда, аксессуары, тени, освещение/блики.

Если вы рисуете свой фанарт, то можно выбирать любой необходимый цвет из палитры цветов, но в данном случае мы имеем колорит, используя стиль Gotoh, поэтому выбирать цвета нам необходимо непосредственно из оригинала с использованием инструмента пипетки (Eyedropper Tool).

Выберите светлый оттенок розового, нажав на часть лица Рури.

Создайте новый слой.

Переименуйте его в » base skin» (основная кожа).

В настройке слоя выставите Multiply.

Существуют два способа окраски: c помощью кисти (мышкой или на графическом планшете) и с помощью лассо.

СПОСОБ 1:

Выберите кисть.

 

Закрасьте лицо, не выходя за границы контура.

Обратите внимание, насколько важно установить параметр слоя Multiply:

На этом рисунке слой с параметрами «Normal».

А на этом рисунке слой с параметрами » Multiply».

Таким способом, вы можете:

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

— Нанести цвет неаккуратно, а затем исправить:

— Нанести цвет неаккуратно, а затем «прикрыть» слоем стоящим выше, с параметрами «Normal».

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

СПОСОБ 2:

Лассо! Выберите инструмент «Polygonal Lasso».

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

 

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

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

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

Мы выделили ту часть лица, где будет розовый цвет (не забывайте, что вы должны находиться на слое «base skin» (основная кожа), с параметром Multiply). Теперь с помощью инструмента Paint Bucket (заливка) и цветом, взятым пипеткой с лица оригинальной картинки Рури, щелкните внутри выделенной области. Вы получите:

Метод, с использованием инструмента лассо, требует придельной точности … Однако если вы допустите, какие ни будь ошибки их можно исправить (если вышли за контур — стереть резинкой, а если где-то не дошли закрасить кистью). Во всяком случае, я считаю, этот способ достаточно «ужасным», и редко его использую. Но если у вас нет графического планшета, то это самый быстрый способ добавления цвета! Имейте в виду, что отменить неверное действие можно с помощью клавиш ALT + CTRL + Z!

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

Добавляем цвет волосам и одежде.

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

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

Потом платье

Затем рюкзак Рури…

Затем глаза и заколки … и вуаля! Базовые цвета нанесены!

Должен получиться примерно такой результат.

Автор урока: Amano Hikari

Перевод:  Prescilla

Данный материал подготовлен для Вас командой сайта https://bakemono.ru

от простого к сложному. Часть 75. Искусство цвета

3 — 2004

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

 

1 Открываем файл с черно-белым рисунком. Хорошо, если его детали тщательно проработаны, а контуры четкие.

2 Переводим изображение в режим RGB. Теперь рисунок готов к последующим операциям с цветом.

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

4 Инструмент Magnetic Lasso автоматически расставляет точки. Если вас не устраивает та или иная точка, нажмите клавишу Delete или Backspace — и точка будет стерта. Создавая контур с помощью этого инструмента, можно регулировать область выделения следующим образом: одиночный щелчок создает новую точку, а двойной — закрывает область выделения.

5 Если внутри основного контура рисунка еще остались невыделенные области, следует выделить и их. Удерживая клавишу Alt инструментом Magnetic Lasso, обводим оставшиеся области.

6 Чтобы подправить контуры выделения, переходим в режим быстрой маски (Quick Mask Mode), нажав на клавишу Q.

7 С помощью инструмента Brush («кисть») добавляем в область выделения участки, пропущенные инструментом Magnetic Lasso. В нашем примере это волоски на хвосте лошади.

8 Еще раз нажав на клавишу Q, выходим из режима быстрой маски. Теперь следует сохранить выделенную область, выполнив команду Select > Save Selection. В открывшемся диалоговом окне выбираем новый канал и задаем имя для области выделения.

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

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

11 Задаем базовый цвет с помощью параметров Hue/Saturation, выполнив команду Image > Adjustments > Hue/Saturation. Для этого в открывшемся окне настроек выбираем режим Colorize и передвигаем ползунок Hue для изменения цвета. Ползунок Saturation поможет контролировать насыщенность выбранного оттенка, а Lightness — его яркость.

12 С помощью команды New Layer создаем новый слой в панели Layers.

13 Чтобы передать рельеф изображения, подчеркиваем с помощью кисти отдельные его участки. Задаем новому слою режим наложения Color Dodge. Выбираем кисть и цвет, близкий к основному оттенку (в нашем примере это коричневый). В параметрах кисти снижаем непрозрачность (Opacity) до 50% и подчеркиваем несколькими мазками светлые участки рисунка.

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

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

16 Итак, фигуры всадника и лошади раскрашены.

17 Однако как бы аккуратно мы ни выделяли фрагменты, на рисунке могли остаться незакрашенные участки. Чтобы подкорректировать рисунок, выбираем в панели Layers слой Background. Затем при нажатой клавише Alt инструментом Brush щелкаем по области, наиболее близкой к незакрашенному участку, — кисть автоматически приобретет такой же оттенок.

18 Получив нужный цвет, аккуратно закрашиваем оставшиеся черно-белыми участки. Непрозрачность (Opacity) кисти следует снизить до 80%, а режим выставить на Color.

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

20 Теперь нужно раскрасить мелкие детали (пряжка на портупее, глаз лошади и т.п.). Чтобы выбрать нужный цвет, щелкаем на значок основного цвета в панели инструментов и в открывшемся диалоговом окне Color Picker выбираем необходимый цвет.

21 Кистью небольшого диаметра в режиме Color аккуратно подкрашиваем детали в слое Background.

22 Осталось придать цвет фону. Загружаем все области выделения фигур ковбоя и лошади, выбрав команду Select > Load Selection. Чтобы объединить эти области, в диалоговом окне Load Selection выбираем Operation > Add to Selection.

23 После того как все области выделения загружены, применяем команду Inverse (меню Select > Inverse). Таким образом мы выделим только фон, а раскрашенные фигуры всадника и лошади исключим из выделения.

24 В панели инструментов выбираем Gradient Tool (инструмент градиента). Вверху окна, в параметрах этого инструмента, находим палитру градиентов. В палитре выбираем градиент, который по своим оттенкам гармонирует с основными цветами композиции.

25 В параметрах градиента устанавливаем режим (Mode) на Hard Light, а непрозрачность снижаем до 30%. Теперь инструментом градиента проводим на рисунке линию — появится градуированный фон из двух цветов.

26 Последние штрихи: инструментом History Brush в режиме Color с непрозрачностью 80% придаем легкий оттенок стене и фигурам на фоне.

27 И наконец, объединяем все три слоя с помощью команды Flatten Image в панели управления Layers.

КомпьюАрт 3’2004

Как освоить цифровую раскраску с помощью Photoshop

Adobe Photoshop так же универсален, как и программы. Список вещей, которые вы можете сделать с помощью Photoshop

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

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

Получите ваш рисунок линии

Есть три способа получить рисунок, который вы собираетесь использовать, чтобы попрактиковаться в цифровой раскраске:

1. Векторизация вашего рисунка

Если вам удобнее начинать на бумаге, отсканируйте изображение и откройте его в Photoshop.

Вам нужно будет отбелить страницу и затемнить линии. Лучший способ сделать это в Photoshop — использовать инструмент «Уровни». Идти к

Изображение> Настройки> Уровни или используйте сочетание клавиш Ctrl / Cmd + L.

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

2. Creative Commons Images

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

Поиск раскраски для взрослых онлайн

также может привести вас к сокровищнице изображений, которые вы можете потренировать в Photoshop.

3. Создать цифровой рисунок

Если у вас есть доступ к графическому планшету, такому как планшет Wacom

или даже iPad Pro, вы можете нарисовать цифровое изображение от начала до конца.

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

,

Оставайтесь внутри линий

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

Во-первых, с вашим изображением, открытым в Photoshop, создайте новый слой, перейдя в Слой> Новый слой или с помощью сочетания клавиш Ctrl / Cmd + N.

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

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

Выберите слой с вашим изображением и установите режим смешивания на панели «Слои» на

Умножение. Это обеспечит отображение цвета, который вы добавляете в слой 1.

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

Это выбирает все изображение, за исключением самого черепа. Идти к Выберите> Обратный или используйте сочетание клавиш Shift + Ctrl / Cmd + I. Это изменит выделение, поэтому теперь нужно выбрать все изображение.

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

Выберите оба слоя и нажмите Ctrl / Cmd + G сгруппировать их. Убедитесь, что вы выбрали всю группу и создать маску, нажав маскировать значок на панели слоев или перейдите к Слой> Маска слоя> Показать выделение.

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

Теперь выберите инструмент «Кисть», выберите свой цвет и начните наносить какой-то цвет на слой 1. Вы увидите, что вы не сможете раскрасить что-либо, кроме исходного выделения.

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

,

Как избежать ошибок

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

Что еще более важно, вы должны создать отдельный слой для каждого цвета, который вы используете. Создайте дополнительные слои с помощью сочетания клавиш Ctrl / Cmd + N.

Таким образом, если вы допустили ошибку и хотите удалить мазки кисти, вы можете использовать Инструмент «Кисть» История « (Сочетание клавиш Y), не беспокоясь о случайном удалении слишком много. Вы также можете удалить весь слой, не затрагивая другие цвета.

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

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

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

Добавить затенение

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

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

Использовать глазная пипетка Инструмент (Сочетание клавиш я), чтобы выбрать цвет на изображении, к которому вы хотите добавить заливку, и откройте Палитра цветов. (Вы также можете оставить панель «Цвет» открытой для быстрого доступа, перейдя в Окно> Цвет.)

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

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

Добавить цвет фона

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

Создайте новый слой с помощью сочетания клавиш Ctrl / Cmd + N.

Выберите цвет, который вы хотите добавить к фону, и выберите Paint Bucket Tool (Сочетание клавиш г) и щелкните в любом месте фона, чтобы заполнить фон.

Вы также можете рассмотреть возможность создания рисунка в Photoshop

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

Быстро изменить цвета

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

Чтобы изменить цвета всего изображения за один раз, нажмите Изображение> Настройки> Оттенок / Насыщенность или используйте сочетание клавиш Ctrl / Cmd + U. Поиграйте с тремя ползунками, чтобы изменить внешний вид вашего изображения. Оттенок изменит фактический цвет, насыщенность изменит интенсивность ваших цветов, в то время как легкость либо осветлит, либо затемнит цвета.

Если вы хотите изменить определенные цвета в вашем изображении, нажмите Выберите> Цветовой диапазон. Это откроет панель и активирует пипетку. Используйте инструмент «Пипетка», чтобы выбрать цвет, который вы хотите изменить. Вы должны увидеть все части изображения, выделенные этим цветом на панели.

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

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

Альтернативы фотошопу

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

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

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

или iPad раскраски

чтобы сделать работу.

Как раскрасить отсканированный рисунок в фотошопе. А Вы знаете, как сделать раскраску из картинки в фотошопе

Дорогие друзья, я рад, что Вы заглянули на сайт КЛАДОВОЧКА ИДЕЙ. Сегодня, на страничках раздела УЧИМСЯ ВМЕСТЕ-КОМПЬЮТЕР, мы с Вами продолжим разбираться с простыми программами фотошопа и выясним — КАК РАСКРАСИТЬ КАРТИНКУ В PAINT . net . Это очень простой урок и предназначен он для тех кто только начал осваивать эту программу или для детей осваивающих компьютер.

Напоминаю, что работать мы будем в самой простой программе фотошопа PAINT . NET

И так для начала заводим новую папку, и чтобы не повторяться, все до открытия картинки ее уменьшения. Кто забыл или не читал, можно прочитать – или в публикации — КАК ВСТАВИТЬ ФОТОГРАФИЮ В ПРОСТУЮ РАМОЧКУ.

Для начала мы находим картинку которую будем раскрашивать. Если у вас ее нет, то много заготовок можно найти в интернете. Задайте в Яндекс-поиск «картинки для раскрашивания» и выберите, то, что вам понравится. Я взял такую


Для раскраски нам потребуются всего несколько инструментов и палитра. Как открыть программу и вставить фото или картинку я писал много раз, кто забыл посмотреть можно – .

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


Эля этого на палитре определяем цвет. Наводим курсор и левой клавишей мышки – нажимаем. (1) Цвет выделился в квадратике (2) Если он вас не устраивает, то его можно заменить на другой поправив точку на палитре (1)


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

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

Несколько отступлений. Если цвет не понравился, или не тот элемент раскрасили, для этого зайдите в ПРАВКУ(4), нажмите, откроется окно в верху будет ОТМЕНИТЬ, нажмите и последнее действие будет отменено. Надо отменить два, проделайте дважды.

И еще один нюанс, если забыли раскрасить какой-то элемент, а цвет поменяли на палитре, и нужен точно такой же. Для этого есть инструмент «Пипетка»(5). Щелкните по ней, потом по тому цвету на рисунке, который нужен, в квадратике (2) появится нужный цвет. Далее как обычно, описано выше. Более подробно я описывал этот процесс –

Здравствуйте, дорогие читатели блога Домовёнок-Арт! Думаю, почти все дети любят раскрашивать картинки. У кого-то количество раскрасок ограничивается десятком разных книжечек, у других запросы посолидней. А бывает и такое: ребенку нравится какой-нибудь «неходовой» мультик, а раскрасок на эту тему нет в продаже. Но, дорогие родители, не отчаивайтесь! Сегодня я расскажу, как сделать раскраску в фотошопе самостоятельно.

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

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


Создадим дубликат нашего рисунка сочетанием клавиш Ctrl+J .

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

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

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


Зажав клавишу Ctrl, нажимаем в панели слоев на верхние 3 слоя. Затем жмем Ctrr+E, объединяя их в один слой. Затем создаем дубликат этого слоя (Сtrl+J).

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


Режим наложения слоя меняем на Перекрытие .

Жмем сочетание клавиш Ctrl+ E . Далее нам необходимо обесцветить этот слой. Для этого идем в меню Изображение – Коррекция — Черно-белое .


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

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


Делаем дубликат этого слоя. Установите в палитре инструментов основной цвет черный (000000 ), а фоновый белый (ffffff ). Где это менять, я рассказывала в .

Переходим в меню Фильтр – Эскиз – Ксерокопия .

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



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

Но появляется другая проблема: местами черные контуры превращаются в серые. Это тоже поправимо: создаем копию этого слоя, а затем меняем режим наложения на Мягкий или Жесткий свет (подробней показано в видео).

Конечно, идеально сделать раскраску в фотошопе из обычной картинки за пару кликов не получится. Но быстро привести ее к приличному виду можно. Создаем поверх всех слоев новый слой. Берем обычную круглую кисть с жёсткостью и непрозрачность 100 %. Цвет устанавливаем белый. И теперь проходимся ею по тем местам, где вылезли ненужные черные точки.


Наша раскраска из картинки готова! Осталось ее сохранить на компьютере (Файл – Сохранить как).

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

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

Надеюсь, у Вас всё получилось 😉 Всего Вам самого наилучшего! Ваш домовенок Елена.

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

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

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

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

Вам потребуется Photoshop 7 и выше.

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


2. Для начала подкорректируем наше фото с помощью уровней Изображение — Коррекция — Уровни (или сочетание клавиш Ktrl+L). По картинке видно, что на фото не хватает белого (справа много пустого места), поэтому сдвигаем белый ползунов влево, до того места, где начинается график, а черный ползунок слегка сдвинем вправо. Фото станет более контрастным.


3. Итак начнем раскрашивать. Создаем новый слой, нажав на кнопку «Создать новый слой» в нижней части палитры Слои. При помощи любого инструмента выделения выделяем волосы (я для выделения использовала инструмент «Быстрая маска». Как выделять при помощи инструмента «Быстрая маска» , Вы можете прочитать ). Для удобства выделения увеличте изображение.

4. Растушуем выделение Выделение — Модификация — Растушевка, установив радиус растушевки 5 пикселей. И заливаем выделение цветом # a13906 (для своей фотографии Вы можете подобрать другой цвет), при помощи инструмента «Заливка». Меняем режим наложения слоя на «Умножение», а «Непрозрачность» устанавливаем 45%. Еще раз оговорюсь, что эти параметры для данной фотографии, для Ваших фото возможно понадобятся другие значения, тут нужно поэксперементировать.

5. Снова создаем новый слой. На этот раз выделяем кожу. Растушевываем выделение на 5 пикселей (Выделение — Модификация — Растушевка). Заливаем выделение цветом # fbd0ba. Устанавливаем режим наложения слоя — «Цветность», а «Непрозрачность» — 50%. При помощи инструмента «Ластик» стираем цвет с глаз и с зубов.

6. Создаем новый слой, как Вы уже поняли — под каждый цвет нужен новый слой. Теперь будем раскрашивать глаза, а значит выделяем радужку глаз вместе со зрачком. Растушевываем выделение на 3 пикселя (Выделение — Модификация — Растушевка). Заливаем выделение цветом # 106afe. Устанавливаем режим наложения слоя — «Мягкий свет», а «Непрозрачность» — 40%.

Для языка использовался цвет # fe1010, режим наложения слоя — «Умножение», а «Непрозрачность» — 35%.

Для губ использовался цвет # d90b0b, режим наложения слоя — «Мягкий свет», а «Непрозрачность» — 20%.

Для заднего фона использовался цвет # d95d0b, режим наложения слоя — «Мягкий свет», а «Непрозрачность» — 100%.


8. Если какой нибудь цвет «влез» не туда куда нужно — подтираем мягким ластиком. Ну вот и все — любуемся своим произведением. Творческих успехов вам.

раскрашиваем в фотошопе

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

Моим первым шагом был рисунок с четким контуром. Я отсканировала изображение, которое у меня было, с высоким разрешением (размер в пикселях 2389х3508), немного подчистила его, с помощью функции Яркость/контраст (Brightness / contrast ), которую вы найдете здесь: Изображение – Коррекция – Яркость/Контраст (Image Adjustments Brightness / Contrast ). Корректирование положения ползунков данной функции сделает темные участки темнее, а светлые ярче… Очень полезно для тех, кто делает наброски очень неаккуратно, как я …

Следующее, что я сделала – создала новый слой, чтобы наложить фоновый цвет. Поскольку мой набросок по-прежнему расположен на нижнем слое, я изменила настройки (прим. Режим смешивания (Blending mode )) моего нового слоя на Умножение (Multiply ) , поэтому я по-прежнему могу видеть его даже после заливки тем цветом, которым я захочу.

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

Следующим шагом было непосредственное раскрашивание! Я набросала очень простую палитру и начала закрашивать основным цветом обычной кистью (70% Непрозрачности (Opacity ) и 70% Жесткости (F low) ). Это выглядит ужасно, но, я обещаю, будет лучше!


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

Следующее, что я сделала – добавила больше теней, добавляя более темные цвета и смешивая их. Для смешивания цветов в Фотошопе я просто понижаю уровень Непрозрачности (Opacity ) кисти (brush ) (в данном случае использовались значения 40% непрозрачности (opacity ) и 50% жесткости (flow ) ). Также я воспользовалась пипеткой (eyedrop ) для взятия образца цвета тени из палитры, которую я уже создала ранее (горячая клавиша Alt – зажмите ее и кликните по тому месту, откуда хотите взять образец).

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

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


Аэрограф находится в настройках инструмента (tool presets ) для обычной кисти, как вы видите на изображении ниже.

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

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


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

Устанавливаем света и тени для придания и сохранения правдоподобного источника света.

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

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

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

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

Для жемчужного ожерелья я сначала выбрала самый темный цвет, затем к нему добавила бликов, используя кисть для того, чтобы наложить базовые блики, затем использовала инструмент Осветлитель (Dodge ) на последнем этапе, чтобы сделать жемчужины более блестящими. Я также добавила очень легкий пурпурный блик в нижней части каждой жемчужинки.

После того, как я закончила работу с ожерельем, я начала прорабатывать мельчайшие детали: камень на ее воротнике был раскрашен тем же методом, что и жемчужины, то же самое применялось для серебристой оправы на воротнике. Для кружев я использовала кисть маленького размера с непрозрачностью (opacity ) 80%.

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

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

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

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

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

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

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

В любом случае, я надеюсь, этот урок дал вам представление, как можно раскрашивать в Фотошопе! Я не могу точно сказать, сколько заняла времени у меня эта работа… Я не сидела над ней непрерывно, но, думаю, где-то около 4 часов…

Читайте также…

Изготовление раскраски в Adobe Photoshop

Как сделать самостоятельно из фотографии рисунок для раскрашивания? Воспользуемся цифровым фотоаппаратом или камерой мобильного телефона и программой Adobe Photoshop.

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

Используя сочетание клавиш Ctrl+J, создаем дубликат и начинаем его редактировать: создаем новый корректирующий слой «Кривые», используя соответствующий значок в панели «Коррекция».

Можно вызвать окно «Кривые», используя пиктограмму на панели «Слои».

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

Затем убираем контрастность фотографии, чтобы контуры при создании раскраски были видны более чётко. Используя пиктограмму «Стрелка влево»  на панели инструментов «Коррекция», переходим на Яркость/Контрастность. Это также индивидуально для каждой фотографии. На корректирующем слое «Яркость / Контрастность» устанавливаем значения, например такие, как показано на рисунке:

Теперь можно объединить корректирующие слои со слоем Фон-копия. Зажав и удерживая клавишу Ctrl, нажимаем на верхние 3 слоя панели «Слои». Слои выделены. Объединяем их в один слой, используя горячие клавиши Ctrl+E и получаем следующее изображение (см. иллюстрацию).

Опять создаем дубликат полученного слоя, используя комбинацию клавиш Сtrl+J. Приступаем к получению раскраски. Увеличим резкость на краях. Для этого используем команду меню Фильтр=>Другое=>Цветовой контраст и устанавливаем подходяще значения радиуса, например, как показано на рисунке:

и получаем

При этом контуры должны быть четкими. Режим наложения слоя меняем на Перекрытие. Объединяем последние два слоя, используя команду Ctrl+E. Обесцвечиваем этот слой, используя команду меню Изображение => Коррекция => Черно-белое. В наборе параметров этой команды выбираем тот фильтр, при котором на картинке будут хорошо видны контуры, при этом они не будут сливаться с фоном или другими деталями. В данном случае подошел Высококонтрастный красный фильтр. Вот так выглядит наша будущая раскраска.

Делаем дубликат этого слоя. Устанавливаем в палитре инструментов основной цвет черный (000000), а фоновый белый (ffffff). И переходим к командам меню Фильтр => Эскиз => Ксерокопия. Двигая ползунки, добиваемся желаемого результата. Пока изображение будет немного загрязнено шумом.

Подтвердив, получаем изображение:

Изменим режим наложения этого слоя на Линейный осветлитель. При этом пропадает большая часть шумов, но появляется другая проблема: местами черные контуры превращаются в серые. Это поправимо: создаем копию слоя с Линейным осветлителем, а затем меняем режим наложения на Мягкий или Жесткий свет. Затем создаем поверх всех слоев новый слой. Берем обычную круглую кисть с жёсткостью и непрозрачность 100 %. Цвет устанавливаем белый. Проводим кистью по тем местам, где вылезли ненужные черные точки. Раскраска по фотографии готова! Сохраняем на компьютере (Файл – Сохранить как).

Это всего лишь один из нескольких способов сделать из цветного рисунка/фотографии контурный, но он наиболее эффективный и простой.

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

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

Фрагменты деталей росписи можно использовать при изготовлении карнавальных костюмов «Золотой хохломы» или «Синей Гжели», а также при разработке цветочных аппликаций или трафаретов.

При подготовке были использованы материалы видеоуроков Елены Голоштенко

Материал подготовила методист Компанеец В.В.

Раскраска черно-белого фото в Photoshop вручную

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

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

Откройте черно-белую фотографию. Я использовала кадр из фильма «Головокружение» Альфреда Хичкока:

Выберите Изображение – Режим — RGB. Теперь мы собираемся выбирать различные части изображения и вставлять их в новые отдельные слои. Здесь нам пригодятся быстрые маски.

Выберите «Быструю маску» (Q) и кисть подходящего размера. Начните закрашивать кистью область на любом участке кожи. Черной частью маски будет закрашена область с розово-красным цветом, это область, которая будет выделена:

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

Когда вы закончите, у вас должны быть выделены только участки кожи (без одежды, без глаз, без фона!). Снова нажмите Q, чтобы переключиться из режима быстрой маски обратно в нормальный режим. Вы увидите, что области, которые окрашены в черный теперь выделены. Теперь мы должны инвертировать выделение, нажав Shift + Ctrl + I (Win) или Shift + Ctrl + I (Mac).

Скопируйте выделение, нажав Ctrl + C (Win) или Cmd + C (Mac).

Вставьте скопированную часть, нажав Ctrl + V (Win) или Cmd + V (Mac). Таким образом, вы вставите выделенные участки кожи в новом слое. Переименуйте слой в палитре «Слоев» (дважды кликните по его текущему имени — Layer 1) и назовите его, например, Skin:

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

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

Нажмите на слой кожи, чтобы выбрать его. Выберите Слой — Новая корректировка – Слой — Баланс цвета. Я назвал новый корректирующий слой «Skin», а также установил флажок для опции «Использовать предыдущий слой для создания обтравочной маски». Затем нажмите ОК:

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

  • Тени: +81 -8 -31;
  • Полутона: +12 -7 -17;
  • Подсветка: +8 4 -9:

Нажмите ОК, и вы создадите корректирующий слой, который не изменяет пиксели исходного изображения. Чтобы вернуться и изменить какие-либо параметры, дважды щелкните по иконке с фигурами:
Уже выглядит довольно круто!

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


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

Данная публикация является переводом статьи «Hand Colouring A Black And White Photo In Photoshop — Photoshop Tutorial» , подготовленная редакцией проекта.

Раскраски в Photoshop: от эскиза до полноцветной иллюстрации: упрощенное издание!

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

Ниже представлен превью класса:

Если вы готовы изучить новый навык, приступим!

Подготовка изображения

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

На панели слоев будет создан один слой. Рядом со слоем появится небольшой замок. Чтобы разблокировать изображение, дважды щелкните слой и нажмите « Okay ».

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

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

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

Теперь, когда ваш рисунок очищен, перейдите на панель слоев и создайте новый пустой слой и назовите его « Clean Outlines ».

Передача изображений

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

Перейдите на вкладку « каналов », расположенную рядом с вкладкой «Слои».

Пока ваш рисунок виден,> Ctrl + щелчок по RGB (или CMYK)

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

Нам нужно инвертировать текущее выделение, чтобы захватить строки только . Нажмите « Shift + Ctrl + I » на клавиатуре, чтобы инвертировать выделение.

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

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

Перенесем линии на слой « Clean_lines ». Убедитесь, что слой в данный момент выбран. Проведите кистью по экрану один или два раза. Я рекомендую 1 или 2 сплошных смахивания, чтобы не заливать выделение, что сделает изображение слишком темным.

После того, как вы довольны переносом изображения, снимите выделение, нажав « Ctrl + D » на клавиатуре, или перейдите к> Select> Deselect в строке меню.

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

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

Давайте раскрасим!

На следующем этапе мы добавим сплошные цветные блоки под рисунок.

Создайте новый пустой слой под слоем « чистых линий, ». Назовите новый слой соответствующим образом; например, « base_colors ».

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

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

Сохраните файл, сохранив основные цвета, а слои названы соответствующим образом и организованы.

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

Выберите слой « clean_lines » и включите кнопку « Lock Transparent Pixels ». Теперь вы можете выбрать цвет из библиотеки образцов, который дополняет цвета под штриховым рисунком.

Используйте сплошную кисть, чтобы раскрасить линии. Пока кнопка « Lock Transparent Pixels » выбрана, ничего, кроме линий, не будет затронуто.

Теперь, когда линии окрашены, сохраните файл.

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

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

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

Продолжайте творить,

Ноэль

Краткое руководство по раскрашиванию в Photoshop — Annenberg Digital Lounge

Ваш рисунок и Photoshop

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

Сканирование

Для начала сотрите все случайные следы карандаша и отсканируйте изображение. (Да, вы можете сделать снимок, но всегда лучше сканировать. Фотографии, как правило, имеют тени на странице; сканирование чистое и точное.) Отсканируйте файл с приличным разрешением — не менее 200 dpi. Если вы сканируете из Xerox в ANN 301, вы можете выбрать оттенки серого, черно-белый или цветной, а также до 600 dpi и отправить файл себе по электронной почте.

Наверх ↑

Раскраска

Наверх ↑

Настройка

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

Возможно, вам придется немного очистить перед окраской. Если есть какие-либо пятна или точки, которые вам нужно удалить, используйте инструмент Brush Tool (B), чтобы закрасить их белым цветом, чтобы они были того же цвета, что и фон. Если вам нужно затемнить линии или осветлить бумагу, используйте уровни. Вы можете перейти в «Уровни» («Изображение»> «Коррекция»> «Уровни») и сдвинуть переключатели, чтобы сделать черный цвет темнее, чтобы линии выделялись больше, или бумага была одного оттенка белого.

Наверх ↑

Инструмент «Ведро с краской»

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

Выберите инструмент «Заливка» (G) и добавьте цвета к изображению с безрассудной энергией. Если форма не закрыта полностью, используйте инструмент «Кисть» (B), чтобы завершить линию черным цветом перед заливкой. Будьте осторожны, чтобы не закрасить черные контуры.Обратите внимание, что изменение цвета слишком много раз может привести к ухудшению черных линий. (Если это произойдет, установите Режим наложения цветного слоя на Умножение, и черные линии исходной копии будут прострелены.)

Вверх ↑

Режим наложения: Умножение

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

Теперь начните рисовать с помощью Brush Tool (B) и наблюдайте, как ваши линии остаются аккуратно поверх цвета. Вы также можете использовать инструмент Paint Bucket Tool (G) на слое изображения, если хотите заблокировать какие-либо большие области, но все, что вы поместите прямо над ним на верхнем слое, изменит его цвет. Получайте удовольствие и раскрашивайте, сколько душе угодно. Если вы используете много цветов на небольшом пространстве, вы можете поместить некоторые из них на другой слой, установленный на Умножение.

Наверх ↑

Подсказки

Если вы собираетесь разместить изображение в сети, вы должны установить цвет (Изображение> Режим> RGB) на RGB. Если вы планируете распечатать изображение, установите для него CMYK (Изображение> Режим> CMYK). Сделайте это до , когда вы начнете раскрашивать, в идеале, как только вы откроете Photoshop.

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

Руководство по раскрашиванию черно-белого эскиза в Photoshop

Мои милые амиго!

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

Не в этот раз!

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

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

Как раскрасить черно-белый набросок в Photoshop

Эта картина состоит из 8 шагов, вы можете попробовать:

1. Рисование линии
Довольно понятно, я бы сказал ◠◡◠ Я начинаю с белого фона, затем создаю пустой слой сверху и рисую небольшой набросок.

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

3. Градиентная карта
О, это был один из приемов, которым я научился! Создайте корректирующий слой, установленный на Gradient Map, и создайте обтравочную маску. Подберите подходящую цветовую схему. Тогда это послужит подмалевкой и предотвратит появление грязных цветов. Wohoo! Взял его из одного из видео Стэнли Лау (, также известного как Artgerm ), так что ему спасибо!

4. Цвет
Теперь создайте еще один слой поверх и добавьте к обтравочной маске.Начните раскрашивать. Дважды щелкните слой и настройте нижележащий слой. Сделайте более плавный переход, удерживая alt.

5. Накладка
Здесь то же самое. Раскрасьте, раскрасьте, раскрасьте и отрегулируйте нижний слой, если хотите. Этот слой помогает сделать ваши цвета еще ярче.

6. Тени
Когда вы будете довольны цветами, переходите к теням. Создайте еще один слой и добавьте к обтравочной маске. Установите его на «Умножение».Выберите цвета и раскрасьте их по всему объекту ( я выбрал голубой / фиолетовый для белых областей и локальные цвета для остальных ). Создайте маску и начните стирать те участки, где свет падает на ваш объект или персонажа.

7. Bounce light
Создайте еще один слой с настройкой «Screen» и добавьте к обтравочной маске. Выберите темно-синий / серый цвет и добавьте его туда, где, по вашему мнению, будет отражаться свет. Я представил голубое небо, которое отскакивает от этой маленькой дворняжки, отсюда и голубой тон.

8. Последние штрихи
Создайте последний слой и завершите рисунок, добавив некоторые детали там, где это необходимо.

Готово ◠◡◠

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

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

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


Ура!

◠◡◠ 5

Как раскрасить иллюстрацию в Photoshop

Любой желающий может быть иллюстратором в Photoshop!

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

Раскраска по линиям

Давайте вернемся в прошлое, к книжкам-раскраскам и цветным карандашам … обязательно раскрасьте эти строки! Чтобы упростить эту работу, используйте инструмент выбора, чтобы выбрать только фон иллюстрации (это будет зависеть от того, какой у вас тип изображения. Если это имеет больше смысла, не стесняйтесь выбирать саму иллюстрацию вместо этого).Затем превратите выделение в маску слоя. Вам нужно будет инвертировать маску (Cmd / Ctrl + I), если вы изначально выбрали фон. Эта маска будет применена к группе, содержащей все ваши слои.

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

Время повеселиться!

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

Свет и тень

Совет по искусству №1: Выясните, где находится источник света! Мы решили, что на ананасе свет / солнце будет исходить из верхнего левого угла. Это означает, что части, расположенные ближе всего к этому углу, будут самыми яркими и иметь блики. Это также означает, что Тень упадет на противоположную сторону плода. Блики и тени помогут сделать вашу иллюстрацию более реалистичной.

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

Не забывайте подробности

Чтобы добавить действительно приятных и тонких деталей, мы рисуем несколько красных и желтых поверх ананаса и меняем режим наложения на Мягкий свет (это на Новом слое). То же самое проделываем с листьями фрукта, и это делает иллюстрацию более интересной и динамичной!

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

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

Как преобразовать фотографию в набросок цветным карандашом с помощью Photoshop

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

1. Слой вверх

Этот метод лучше всего работает с объектами, снятыми на белом или другом светлом фоне. Откройте фотографию в Photoshop и, если изображение, на котором скоро будет сделан набросок, состоит из одного слоя, нажмите Command-D, чтобы продублировать его. Если изображение состоит из нескольких слоев — скажем, если вы использовали корректирующие слои для исправления изображения, как показано здесь, — вам необходимо создать совершенно новый слой, который будет содержать содержимое всех других слоев.

Для этого активируйте самый верхний слой в стеке слоев и во всплывающем меню панели «Слои» нажмите и удерживайте клавишу Option и выберите «Объединить видимые» (сочетание клавиш для этого маневра — Shift-Option-Command-E). Photoshop добавляет новый слой наверху вашего стека слоев, который содержит содержимое всех видимых слоев (тех, у которых включены значки видимости). Этот процесс называется созданием «штампованной копии» или «штамповки видимых слоев».

2.Разделяй и властвуй

Используя меню в верхней части панели «Слои», измените режим наложения дублированного или штампованного слоя на «Разделить». Этот режим дебютировал в Photoshop CS5 и значительно осветляет ваше изображение, почти до состояния сплошного белого. Не паникуйте, мы исправим это на следующем шаге.

3. Размытие по Гауссу

Выберите «Фильтр»> «Размытие»> «Размытие по Гауссу» и в появившемся диалоговом окне введите небольшое значение в поле «Радиус» и нажмите «ОК».На этом изображении размером 2500 × 2700 пикселей использовалось значение 10 пикселей.

4. Сделайте умнее

Создайте штампованную копию ваших существующих слоев, активировав самый верхний слой и нажав Shift-Option-Command-E. Затем преобразуйте слой с новым штампом в смарт-объект, выбрав «Фильтр»> «Преобразовать для смарт-фильтров». Обратите внимание на специальный значок, который появляется на миниатюре слоя (обведен здесь).

5. Развлечение с фильтрами

Чтобы подчеркнуть контрастные края фотографии, мы воспользуемся фильтром «Края плаката».В CS6 или более поздней версии выберите «Фильтр»> «Галерея фильтров», найдите категорию «Художественный» и щелкните один раз значок «Края плаката» (в CS5 выберите «Фильтр»> «Художественный»> «Края плаката»). В любом случае введите значение 1 для каждого ползунка, а затем медленно перетащите каждый ползунок вправо, пока не получите приятный результат (каждое изображение отличается, поэтому эта часть требует экспериментов). По завершении нажмите ОК.

6. Сжечь контрастом

Измените режим наложения смарт-объекта, созданного на шаге 4, на Linear Burn.Это делает цвета темнее и добавляет контраст. Если эффект выглядит слишком резким, уменьшите значение параметра «Непрозрачность» в правом верхнем углу панели «Слои» — здесь использовалось значение 75%. Если вы не хотите раскрашивать эскиз, можете перейти к шагу 8; но если вы это сделаете, продолжайте читать!

7. Карандаши цветные

Чтобы создать однотонный эскиз и / или настроить насыщенность цветов в эскизе, используйте корректирующий слой «Цветовой тон / насыщенность». Выберите «Слой»> «Новый корректирующий слой»> «Цветовой тон / насыщенность» и нажмите «ОК» в появившемся диалоговом окне.На открывшейся панели «Свойства» (в CS5 она называется «Панель настроек») установите флажок «Раскрасить» в нижней части панели, чтобы создать однотонный эскиз. Поэкспериментируйте с ползунком «Оттенок», чтобы найти приятный цвет. Если вы просто хотите уменьшить насыщенность вашего эскиза, оставьте флажок Colorize выключенным и перетащите ползунок Saturation немного влево.

8. Та-да!

Сохраните свой шедевр, выбрав «Файл»> «Сохранить как» и выбрав Photoshop в меню «Формат».Этот маневр сохраняет ваши слои для будущего редактирования (скажем, если вы позже захотите изменить цвета). Если вы хотите отправить эскиз по электронной почте или опубликовать его в Интернете, создайте еще одну копию, выбрав «Файл»> «Сохранить для Интернета». Для получения наивысшего качества выберите PNG – 24 в меню формата файла в правом верхнем углу и снимите флажок «Прозрачность». Если ваша фотография большая, уменьшите ее размер, введя новую ширину (или высоту) в поля размера изображения в правом нижнем углу. В меню «Качество» выберите «Бикубическая резкость» и нажмите «Сохранить».

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

Основатель PhotoLesa.com Лиза Снайдер — автор бестселлеров a Photoshop CC: The Missing Manual , соавтор iPhoto: The Missing Manual, автор серии электронных книг The Skinny Book , учитель-основатель creativeLIVE и постоянный обозреватель журналов Photoshop User и Photo Elements Techniques.

Укрощение расширенных цветовых палитр в Photoshop, Sketch и Affinity Designer — Smashing Magazine

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

Создание цветовых палитр с использованием корректирующих слоев

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

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

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

Инструкции для Photoshop, Sketch и Affinity Designer включены ниже, но можно использовать и другие инструменты. Также стоит отметить, что инструменты проектирования имеют разные возможности и используют разные механизмы рендеринга, и полученные результаты могут незначительно отличаться.

Базовые цвета

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

Photoshop с базовыми цветами Эскиз с базовыми цветами Affinity Designer с базовыми цветами

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

Sketch не имеет корректирующих слоев, но используйте белые и черные блоки с непрозрачностью слоя около 20%.

Photoshop с корректирующими слоями Эскиз с белым и черным слоями Affinity Designer с корректирующими слоями

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

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

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

Photoshop с режимами наложения Эскиз с режимами наложения Affinity Designer с режимами наложения

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

Точная настройка

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

Создание цветовых палитр с использованием градиентов

Градиенты также можно использовать для создания наборов связанных цветов. В своей простейшей форме линейные градиенты обеспечивают плавное смешение одного цвета с другим. Учитывая, что нас интересует палитра с фиксированным количеством цветов, а не непрерывная градация, это не совсем то, что нам нужно. Можно брать образцы цветов в различных точках градиента, чтобы построить палитру, но это потребует ручной работы, и мы ищем автоматизированное решение.Да, это, вероятно, можно было бы создать в Photoshop, Affinity Designer и Sketch, но другие методы проще, чем создание сценариев.

Постеризация градиента будет разделить его на фиксированное количество шагов (постеризация ограничивает количество используемых цветов). И Photoshop, и Affinity Designer включают возможность постеризации с помощью корректирующих слоев постеризации. Регулирующий слой «Постеризация» можно разместить над градиентом, чтобы разделить его на ступени одного цвета.

Чтобы ограничить область действия корректирующего слоя постеризации, режим наложения охватывающей группы должен быть установлен на «Нормальный», а не на «Сквозной» (это могут делать и Photoshop, и Affinity Designer).Установка нормального режима наложения группы означает, что содержимое группы будет постеризовано, но все, что находится за пределами группы, не будет — группа и ее содержимое объединяются в один буфер, и смешивание сохраняется. Это удобный метод в ситуациях, когда вы хотите, чтобы корректирующий слой постеризации или другие корректирующие слои не влияли на другие части документа.

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

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

Постеризованные градиенты в Photoshop

Если вы следите за ними и видите нечеткие края постеризованных градиентов, это связано с размыванием градиента. Нечеткие края — неудачный побочный эффект функции, которая обычно повышает качество градиентов.Смешение градиента — это хорошо, но в данном конкретном сценарии оно немного отвлекает. Если вы хотите отключить сглаживание градиента в Affinity Designer, вы можете сделать это, сняв флажок «Смешение градиентов» в разделе «Производительность» в «Настройках» (это глобальная настройка). Однако отключение сглаживания градиента не обязательно.

Смешение градиента можно отключить для каждого слоя в Photoshop в окне или панели градиентной заливки. В приведенном выше примере градиент Photoshop также имеет гладкость, равную 0%, которая использует линейную интерполяцию между точками цвета на градиенте — это означает, что блоки, созданные постеризацией, будут одинакового размера.Affinity Designer, Illustrator, Sketch и другие инструменты по умолчанию используют линейную интерполяцию между точками цвета, и у них нет параметров для других интерполяций, поэтому вам нужно беспокоиться только об этом параметре в Photoshop.

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

Но сначала небольшой урок (или напоминание) о том, как работают карты градиентов.

Карты градиентов

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

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

Фотография, фотография в градациях серого и карта градиента

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

Карта градиента в Photoshop

Цвет и положение точек в карте градиента можно использовать для управления контрастом и яркостью, а также цветом. Карты градиента существуют со времен Photoshop 4 (это версия 4.0, выпущенная в 1996 году, а не чуть более поздняя версия CS4), поэтому они далеко не новы, но я чувствую, что они являются одной из самых мощных функций Photoshop для работы. с цветами.

Карты градиента можно добавить с помощью значка корректирующего слоя на панели «слои» в Photoshop и Affinity Designer.

Точно и Абсолютно

Большинство корректирующих слоев в Photoshop и Affinity Designer относительны — делают изображение ярче или более синим, или более контрастным, или менее насыщенным. Карты градиента имеют дело с абсолютом. Вы можете установить точные используемые цвета. И, будучи абсолютными, карты градиента не могут выталкивать цвета за пределы нормального диапазона (от 0 до 255 для 8-битных), поэтому случайного отсечения не произойдет.

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

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

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

Готового фильтра для Android нет. Однако для достижения того же эффекта можно использовать RenderScript, Vulkan или OpenGL.

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

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

Создание цветовых палитр с использованием карт градиентов

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

Градиент, постеризованный градиент и постеризованный градиент с примененной картой градиента

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

Постеризованный градиент с картой градиента, примененной в Photoshop

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

Добавлены слои наложения для большего количества вариаций.

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

Тестирование дальтонизма

Это отличная идея проверить свою цветовую палитру на совместимость с дальтонизмом, хотя все еще легко изменить. Photoshop имеет встроенные режимы предварительного просмотра для цветовой слепоты, которые можно включить через «Просмотр» → «Настройка цветопробы». Плагин Stark добавляет в Sketch предварительный просмотр дальтонизма.

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

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

Замена цветов с помощью тегов слоев

Большинство инструментов дизайна, включая Photoshop и Sketch, имеют возможность фильтровать список слоев, что позволяет искать слой по имени. На момент написания этой статьи Affinity Designer не может фильтровать свой список слоев, но, надеюсь, эта функция будет добавлена ​​в ближайшее время.

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

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

Цвета слоев в Photoshop

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

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

Замена цветов с помощью символов и смарт-объектов

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

В Photoshop нет символов, но в некоторых ситуациях можно использовать смарт-объекты для имитации той же возможности.

Создание символа в Sketch

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

Создание символа в Affinity Designer

Чтобы создать символ в Affinity Designer, выберите слой или группу, которые вы хотите преобразовать в символ, и нажмите «Создать» на панели «Символы».Панель «Символы» открывается через команду меню «Вид» → «Студия» → «Символы». Чтобы создать больше экземпляров символа, перетащите его на значок нового слоя на панели слоев или нажмите ⌘ J .

Глобальные цвета Affinity Designer — еще один способ воспроизвести изменения цвета во всем документе. Глобальные цвета можно добавлять и использовать через панель образцов.

Создание смарт-объекта в Photoshop

Чтобы создать смарт-объект в Photoshop, выберите слой или группу, которые вы хотите преобразовать в смарт-объект, и выберите «Слой» → «Смарт-объекты» → «Преобразовать в смарт-объект». Объект »или щелкните правой кнопкой мыши элементы на панели слоев и выберите« Преобразовать в смарт-объект ».”Чтобы создать больше экземпляров смарт-объекта, перетащите его на значок нового слоя на панели слоев или нажмите ⌘ J .

Сохранение и перенос цветовых палитр

После того, как вы разработали палитру, как лучше всего использовать ее в своих проектах? Как лучше всего поделиться этим с друзьями и коллегами?

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

Чтобы совместно использовать цветовую палитру, создайте документ, содержащий несколько больших цветовых блоков, как в наших предыдущих примерах.Если хотите, добавьте ярлыки и другую информацию, чтобы помочь тем, кто использует палитру. Затем экспортируйте изображение в формате без потерь, например PNG. Убедитесь, что вы используете параметр «PNG-24» в Photoshop и Affinity Designer. Все файлы экспорта Sketch в PNG используют формат «PNG-24», поэтому изменять или проверять настройки не требуется.

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

Палитра цветов macOS и изображения

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

Палитра цветов macOS

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

Другие форматы образцов

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

Файлы Adobe Swatch Exchange ( .ase ) могут быть прочитаны в Photoshop и Illustrator, а также в Affinity Designer. Собственные образцы Affinity Designer .afpalette можно использовать для передачи палитр между дизайнерами с помощью Affinity Designer.

Для пользователей Sketch можно использовать утилиту .ase to .sketchpalette и плагин Sketch Palettes для импорта файлов Adobe Swatch Exchange и обмена палитрами между дизайнерами с помощью Sketch.

Панель Adobe «Библиотека» также позволяет командам обмениваться цветовыми палитрами с дополнительным преимуществом, заключающимся в том, что палитры синхронизируются через Creative Cloud.

Night Shift, f.lux и Dynamic Display Warmth

При создании цветовых палитр помните о функциях и приложениях, которые могут изменить внешний вид цветов. Такие функции, как Night Shift и True Tone на iOS, и приложения, такие как f.lux в macOS и Windows, могут тонко или радикально изменять цветовую температуру и точность цветопередачи дисплея устройства — то, что вы видите, отличается от типичной стандартной используемой калибровки sRGB. в Интернете и для большинства нативных приложений.

Согласно ф.lux, он «адаптирует цвета дисплея вашего компьютера к времени суток, теплым ночью и солнечным днем». Apple заявляет, что Night Shift «использует часы и геолокацию вашего устройства iOS, чтобы определить, когда в вашем регионе закат, а затем автоматически смещает цвета на вашем дисплее в более теплый конец спектра», а True Tone «использует улучшенное четырехканальное окружающее освещение. датчики для автоматической адаптации цвета и яркости дисплея в соответствии с освещением в вашей среде ».

f.lux, Night Shift и True Tone могут изменять теплоту дисплея и делать это непредсказуемым образом, поэтому при выборе цветов лучше отключить их и другие подобные функции.

Фактически, даже кажущаяся безобидной «Автоматическая регулировка яркости» в системных настройках macOS может изменить способ отображения цветов — macOS El Capitan и Sierra объединили существующую компенсацию внешнего освещения с функцией «Автоматически регулировать яркость». Это тонкая, но определенно другая вещь, на которую нужно обратить внимание, или вообще отключить.

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

Во время исследования и написания этой статьи я создал набор документов для Photoshop, Sketch и Affinity Designer, демонстрируя обсуждаемые методы. Шаблоны доступны бесплатно в виде открытого исходного кода по лицензии BSD.

Используется шаблон Sketch Color Creator

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

(vf, al, il)

Цветные линии в Photoshop | Совет недели по дизайну

Черно-белые линии всегда хороши, но иногда требуется немного цвета, чтобы добавить немного визуального оттенка вашему восхитительному суфле с иллюстрацией. (Ура готовить метафоры!) Давайте перейдем к делу и покажем вам, как раскрашивать линии в Photoshop.

Я буду использовать героические образы этого парня, исполняющего Сёрюкен. (Я нарисовал его на Cleveland Drink and Draws, социальном мероприятии, на котором художники, иллюстраторы и рисовальщики могут потусоваться, попить пива и нарисовать крутое дерьмо.) Как видите, это всего лишь рисунок графитным карандашом, поэтому, хотя большая часть его состоит из линий, есть некоторые градации тонов.

Первое, что нужно сделать, это затемнить рисунок в настройках уровней ( Изображение> Коррекция> Уровни ). Только не делайте его настолько темным, чтобы не потерять детали. Это поможет в выборе значений рисунка.

Затем откройте палитру Channels и , удерживая CTRL (или Command) и щелкните слой RGB. Если вы находитесь в цветовом режиме CYMK, щелкните слой CYMK. Обратите внимание, что теперь выделено все вокруг рисунка, но мы хотим выделить именно сам рисунок. Идем дальше и просто инвертируем выделение через Select> Inverse (Shift + CTRL + I).

Comments