Где находится палитра в фотошопе

Обновлено: 21.11.2024

Примечание к версии. Используете Photoshop CC? Ознакомьтесь с нашим полностью обновленным руководством по созданию образцов цвета в Photoshop CC 2020.

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

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

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

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

Шаг 1. Удалите существующие образцы цветов из палитры образцов Photoshop

Чтобы создать собственный набор образцов, давайте сначала удалим все образцы цветов, которые в данный момент находятся в палитре образцов. Не волнуйтесь, они не исчезнут навсегда, как мы увидим чуть позже. Переключитесь на палитру «Образцы», которая по умолчанию сгруппирована с палитрами «Цвет» и «Стили». Если вы ранее не загрузили другие наборы образцов, вы обнаружите, что образцы цветов Photoshop по умолчанию заполняют палитру:

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

Удерживая нажатой клавишу «Alt» (Win)/«Option» (Mac), наведите указатель мыши на образец красного цвета в верхнем левом углу. Курсор мыши изменится на значок ножниц.

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

Шаг 2. Выберите инструмент «Пипетка»

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

Шаг 3. Образец первого цвета с изображения

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

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

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

Шаг 4. Добавьте цвет в палитру образцов

После того, как вы выбрали свой первый цвет, переместите курсор мыши в пустую область внутри палитры «Образцы». Вы увидите, как курсор мыши изменится на значок ведра с краской. Щелкните в любом месте пустой области, чтобы преобразовать образец цвета в образец цвета. Photoshop откроет диалоговое окно с просьбой ввести имя для образца цвета.Если вы создаете набор образцов для клиента, используя определенные цвета Pantone, которые они запросили, рекомендуется ввести название цвета Pantone в качестве имени вашего образца (например, Pantone Yellow 012 C), или если вы создаете набор образцов для собственного использования, используйте любое имя, которое имеет для вас наибольшее значение. Я просто назову свой цвет "Желтый":

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

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

Шаг 5. Продолжайте брать образцы цветов и создавать из них образцы цветов

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

Шаг 6. Сохраните образцы цветов как набор образцов

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

Затем выберите «Сохранить образцы» в появившемся меню:

Photoshop откроет диалоговое окно «Сохранить». Введите имя для нового набора образцов. Я назову свою "Осенние листья":

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

Шаг 7. Восстановите образцы по умолчанию

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

Выберите «Сбросить образцы» в меню палитры, чтобы вернуться к набору образцов цвета Photoshop по умолчанию.

Photoshop спросит, хотите ли вы заменить текущие образцы образцами по умолчанию. Здесь у вас есть выбор: нажать «ОК», что сообщит Photoshop удалить ваши текущие образцы и заменить их значениями по умолчанию, или вы также можете нажать «Добавить», и в этом случае вы сохраните существующие образцы, а Photoshop просто добавит их. образцы по умолчанию для них. Я нажму "ОК", чтобы заменить образцы "Осенних листьев" образцами по умолчанию:

И теперь моя палитра Swatches снова заполнена цветами по умолчанию:

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

Шаг 8. Загрузите пользовательский набор образцов цвета

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

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

И снова Photoshop спросит, хотите ли вы заменить существующие образцы новыми или просто добавить их в список. Я нажму OK, чтобы заменить образцы по умолчанию моими образцами осенних листьев:

И точно так же мои пользовательские образцы "Осенние листья" загружаются в мою палитру образцов, готовые к использованию:

Выбор нового цвета переднего плана из палитры образцов

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

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

Цвет, выбранный вами в палитре «Образцы», отображается в образце цвета переднего плана в палитре «Инструменты».

Выбор нового цвета фона из палитры образцов

Чтобы выбрать цвет для фона, просто нажмите и удерживайте клавишу Ctrl (Win)/Command (Mac) и щелкните нужный цвет в палитре Swatches. Здесь я нажимаю на темно-красный цвет, удерживая нажатой клавишу «Ctrl/Command»:

Удерживая нажатой клавишу «Ctrl» (Win) / «Command» (Mac), щелкните любой цвет в палитре «Образцы», чтобы выбрать цвет для использования в качестве цвета фона.

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

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

Теперь я могу использовать цвета из своего набора образцов "Осенние листья" когда захочу и как захочу! Здесь я создал простой дизайн для стихотворения, используя цвета из моего набора образцов, а также кисть «Разбросанные кленовые листья», которая поставляется с Photoshop:

Что делать дальше.

И вот оно! Вот как легко создавать свои собственные образцы цветов и наборы образцов в Photoshop! Посетите наш раздел «Основы Photoshop», чтобы узнать больше об основах Photoshop!

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

Эта глава из книги

Эта глава из книги 

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

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

Не забудьте ласты!

Обновление до новой версии

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

Что нового в версии 7

Те из вас, кто знаком с Photoshop 6, будут довольны большинством изменений интерфейса в версии 7, хотя поначалу некоторые из них могут вас немного сбить с толку. К счастью, на этот раз Adobe оставила функции управления цветом Photoshop в покое. Если вы действительно поняли диалоговое окно «Настройки цвета» и «Настройка цветопробы» в версии 6, значит, у вас установлена версия 7. Однако, если у вас все еще есть опасения по поводу несколько загадочного механизма работы с цветом в Photoshop, мы настоятельно рекомендуем вам потратить время на изучение. Глава 5, Настройки цвета. Без досконального понимания диалогового окна «Настройки цвета» вы слишком быстро потеряетесь (и, возможно, даже не поймете, насколько вы заблудились).

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

Новые инструменты. В Photoshop 7 есть два новых инструмента. Наиболее важным из них является инструмент «Восстанавливающая кисть», который действует как инструмент «Клонирование», но намного лучше сохраняет основную зернистость ваших изображений. Инструмент «Заплатка» (который находится «под» инструментом «Восстанавливающая кисть» на палитре инструментов) представляет собой комбинацию инструмента «Восстанавливающая кисть» и инструмента «Лассо». Эти инструменты спасают жизнь, когда дело доходит до ретуширования или очистки изображений. Мы обсудим их оба в главе 14, Основные методы работы с изображениями.

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

Собственная версия OS X.Как мы упоминали в предыдущей главе, версия Photoshop 7 для Macintosh была адаптирована для Mac OS X, что означает, что она может работать как родное приложение и использовать защищенную динамическую память, новый интерфейс Aqua и другие возможности Mac OS X. Особенности. Однако есть одна причина, по которой вы можете не захотеть запускать Photoshop 7 в основном режиме. Старые подключаемые модули не будут работать (или даже отображаться) до тех пор, пока они не будут переписаны для изначальной работы в OS X. Если вы работаете в Mac OS X и вам нужно использовать старые подключаемые модули, вы можете выбрать приложение Photoshop. на рабочем столе выберите «Информация» в меню «Файл» и установите флажок «Открыть в классической среде», чтобы Photoshop запускался в классическом режиме. Но вы потеряете большую часть преимуществ OS X, а если вы попытаетесь выделить более 400 МБ ОЗУ для Photoshop, произойдет сбой, так что это лишь временное решение.

Файловый браузер. Одна из самых крутых функций в Photoshop Elements (младшем брате Photoshop потребительского уровня) — это File Browser, который похож на диалоговое окно «Открыть» на стероидах. К счастью, File Browser наконец-то появился в Photoshop. Этот замечательный инструмент обычно находится в виде палитры в колодце палитры (на панели параметров) и позволяет вам просматривать все изображения на вашем диске, просматривать информацию о каждом файле (миниатюру, данные о разрешении изображения и т. д.) и затем откройте. Он даже позволит вам поворачивать изображения перед их открытием. Мы рассмотрим файловый браузер более подробно позже в этой главе.

Рабочие пространства. В течение многих лет мы просили быстрый способ скрыть все палитры, кроме информационной палитры. На этот раз команда Photoshop дала нам гораздо больше, чем мы просили. Photoshop 7 позволяет сохранять наборы инструментов и наборы палитр («рабочие пространства»), чтобы можно было быстро переключаться между ними. Например, вы можете сохранить 30-пиксельную кисть с мягкими краями для изображений с высоким разрешением и 5-пиксельную кисть с жесткими краями для изображений с низким разрешением; вы можете быстро переключаться между ними из палитры «Наборы параметров инструмента» или во всплывающем меню «Наборы параметров инструмента» на панели параметров. Вы можете сохранять различные схемы палитр в качестве рабочих пространств и быстро вызывать их из подменю «Рабочее пространство» в меню «Окно». Мы рассмотрим эти функции более подробно позже в этой главе.

Сценарии. Вы мало что услышите от маркетингового отдела Adobe об одной из самых замечательных функций Photoshop 7: возможности создания сценариев Photoshop. Дело не в том, что маркетологи не хотят, чтобы вы знали об этом; просто большинство из них не знают, почему это так удивительно. Скрипты позволяют автоматизировать Photoshop из-за кулис. Например, вы можете настроить программу базы данных (например, FileMaker Pro) для автоматизации Photoshop с использованием информации из вашей базы данных. Вы можете создать рабочий процесс, который автоматизирует Photoshop и QuarkXPress (или InDesign, который также поддерживает сценарии), чтобы создать весь каталог за считанные минуты.

Вы можете писать сценарии для Photoshop на Macintosh с помощью AppleScript или Javascript, а на платформе Windows — с помощью Javascript или Visual Basic. Подробнее об этом мы поговорим в главе 14, Основные приемы работы с изображениями.

Палитра кистей. После полного удаления палитры кистей в Photoshop 6 Adobe восстановила ее в версии 7. Однако на этот раз палитра кистей стала в три раза больше и в пять раз мощнее. Мы рассмотрим эту новую палитру позже в этой главе.

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

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

Adobe Photoshop — невероятно универсальная программа. Будь то текстуры, градиенты или кисти, вы можете безгранично адаптировать эту программу под свои нужды.

Что делать, если вам не нравятся стандартные образцы цветов Adobe Photoshop? В этом объяснении мы поговорим о том, как создавать цветовые палитры в Photoshop для ваших проектов.

Шаг 1. Найдите свое вдохновение

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

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

Шаг 2. Доступ к панели образцов цвета

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

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

Эта сетка хороша сама по себе, но сейчас она нам не нужна. Давайте избавимся от этих образцов.

Шаг 3. Удалите ненужные образцы цветов

Чтобы удалить эти образцы цветов, нажмите на меню-гамбургер в правом верхнем углу панели "Образцы".

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

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

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

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

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

Далее нажмите "Удалить", а затем нажмите "Готово". Это не навсегда изменит вашу цветовую палитру Photoshop по умолчанию. В Photoshop уже сохранен шаблон; вы всегда можете вызвать его, если вам нужно.

Шаг 4. Используйте инструмент «Пипетка»

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

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

Далее в верхнем левом углу вы увидите раскрывающееся меню с надписью Образец. Нажмите на него и выберите «Все слои».

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

Шаг 5. Создайте новый образец цвета

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

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

Внизу будет цвет, который вы ранее выбрали с помощью инструмента «Пипетка». Для меня этот цвет был красным.

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

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

После того как вы перетащите образец, появится окно с названием «Имя образца цвета». Здесь вы назовете свой новый образец. У вас также будет возможность сохранить его в своей библиотеке. Как только вы назовете его, нажмите OK.

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

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

Шаг 6. Завершите создание образцов цвета

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

Когда у вас есть все нужные цвета, нажмите раскрывающееся меню «Образцы» и снова выберите «Диспетчер предустановок». Как и при первом открытии Preset Manager, вы увидите варианты «Загрузить», «Сохранить набор», «Переименовать» и «Удалить». Однако вместо удаления цветов мы собираемся изменить их порядок в зависимости от оттенка.

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

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

После того, как цветовая палитра Photoshop настроена по вашему вкусу, нажмите «Готово».

Шаг 7. Сохраните цветовую палитру

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

Чтобы сохранить эти образцы в качестве пользовательской цветовой палитры Photoshop, щелкните раскрывающееся меню «Образцы» и выберите «Сохранить образцы».

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

Шаг 8. Сброс образцов Photoshop до значений по умолчанию

Допустим, вы не хотите использовать эту пользовательскую цветовую палитру в Photoshop. Что делать, если вам нужны оригинальные цветовые палитры Photoshop?

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

Когда Photoshop спросит, можно ли заменить текущие цвета, нажмите "ОК".

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

Шаг 9. Повторно загрузите пользовательские образцы цветов

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

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

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

Подберите правильные цвета для своего проекта

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

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

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

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

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

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

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

Познакомьтесь с сенсорным дизайном для мобильных интерфейсов – совершенно новым руководством Стивена Хубера по дизайну для мобильных устройств с проверенными, универсальными и ориентированными на человека рекомендациями. 400 страниц, заполненных подробными исследованиями пользователей и рекомендациями.

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

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

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

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

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

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

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

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

Photoshop с режимами наложения Sketch с режимами наложения Affinity Designer с режимами наложения

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

Цвета слоя 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. При экспорте PNG в Sketch используется формат «PNG-24», поэтому нет необходимости изменять или проверять настройки.

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

Палитра цветов и изображения в 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 и динамическое тепло дисплея

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

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

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

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

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

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

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