Вы узнаете:

• Как и зачем создавать векторную маску.
• Как редактировать векторную маску.
• Как применять слои заливки (цвет, градиент и узор) к векторным формам.
• Как замаскировать текст.
• Как поместить один объект в границы другого.
• Как создать Clipping Mask (Обтравочную маску).

Урок состоит из следующих разделов:

1. Обучающее видео.
2. Vector Mask (Векторная маска).
3. Пример создания и редактирования векторной маски.
4. Текст – маска.
5. Clipping Mask (Обтравочная маска).
6. Вопросы.
7. Домашнее задание.

Vector Mask (Векторная маска)

Векторная маска делает видимым область, которая находится под маской, все остальное скрывается. Векторная маска создается любым из векторных инструментов: Pan (Перо), Line (Линия), Прямоугольник, Эллипс, Произвольная фигура и т. д. В панели параметров отметьте режим Shape layers (Слой-фигура). Векторная маска автоматически появится на новом слое.

Когда в слое уже есть обычная маска, кнопка для добавления маски внизу палитры Layers (Слои) все равно остается доступной. Но вы не сможете добавить в этот слой еще одну маску слоя. Щелкнув второй раз по значку маски в палитре Layers (Слои), вы добавите совсем другую маску – векторную. Всплывающая подсказка при наведении мышки на эту кнопку изменится: вместо Add layer mask (Добавить маску слоя), будет написано: Add vector mask (Добавить векторную маску). Можно добавить векторную маску и через меню Layers(Слои) — Vector Mask (Векторная маска) –Revialall (Показать все).

Если щелкнуть правой кнопкой мыши по миниатюре векторной маски в палитре Layers (Слои), то в контекстном меню вы сможете выбрать DisableVector Mask (Выключить векторную маску), Delete Vector Mask (Удалить векторную маску) и Rasterize Vector Mask (Растрировать векторную маску). При растрировании векторной маски подправить контур вы уже не сможете.

Форму векторных фигур можно редактировать с помощью клавиш ctrl, shift и инструмента Pen (Перо), а также инструментом Direct Selection (Стрелка).

В палитре каналов вы не найдете никакой маски. Загляните в палитру Paths (Контуры) – вы обнаружите ее там под именем Shape 1 Vector Mask (Векторная маска слой 1).

Векторная маска создает в слое фигуру с четкими границами. Ее можно применять для добавления элементов с четкими контурами. К слою с векторной маской можно применять различные стили. Эти стили можно редактировать. С их помощью можно получить декоративные элементы для сайта (кнопка, иконка, панель и т. д.). Предположим, вы сделали дизайн сайта или какой-нибудь web-элемент, но заказчик просит увеличить его в 3 раза. Если этот элемент будет растровый, то при увеличении вы получите ступенчатость и шумы, а параметры наложения, такие как Bevel and Emboss (Тиснение) и Stroke (Обводка) исказятся. Векторная маска позволяет избежать этих неприятных моментов.

Пример создания и редактирования векторной маски

Откройте файл вьюн.jpg. Возьмите инструмент Pan (Перо). В меню параметров отметьте Paths (Cоздать контур) . Если вы еще не умеете работать с этим инструментом, вернитесь к урокам 5 и 6, где мы подробно разбирали настройки и принцип работы данного инструмента.

После того, как контур будет замкнут, вы сможете найти векторную маску в палитре Path (Контуры). Переименуйте ее в Контур 1.

Вернитесь в палитру Layers (Слои). Создайте копию слоя с листочком.

Выберите в меню Layers (Слои) – Vector Mask (Векторная маска) – CurrentPath (Активный контур). На слое появится миниатюра векторной маски с выделенным контуром.

Активируйте Контур 1 в палитре Paths (Контуры). Создайте три заливочных слоя с векторной маской. Для этого щелкните по значку создать новый корректирующий слой. Выберите поочередно: SolidColor (Цвет); Gradient (Градиент); Pattern (Узор).

У вас появится три новых слоя.

Создать эти три слоя можно через меню Layers (Слои) — New fill Layer (Новый слой заливка) – Solid Color (Цвет); Gradient (Градиент); Pattern (Узор).

В видеоуроке вы можете посмотреть, как менять цвета, градиенты и узоры в созданных слоях. Щелкая мышкой по миниатюрам Цвета, Градиента и Узора (не по векторной маске!!!) в палитре Layers (Слои), вы сможете подобрать необходимый эффект на любой вкус.

Одно из преимуществ векторных масок перед растровыми — это возможность изменять и масштабировать контур без нежелательных последствий для изображения. Переключитесь на палитру Path (Контуры). Активируйте Контур 1, просто нажав на него мышкой. Перейдите
в палитру Layers (Слои). Сделайте активной векторную маску, чтобы она была обведена рамочкой. Возьмите инструмент Direct Selection (Стрелка) и дотроньтесь им до контура. Появятся опорные точки, которые можно перемещать на новые позиции. Слой заливка будет послушно заполнять новое пространство контура.

Текст – маска

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

Откройте любую фотографию. Перейдите в палитру Channel (Каналы). Создайте новый канал. Выберите инструмент Type(Текст). Цвет переднего плана задайте белый. Напечатайте какой-нибудь текст, и он тут же перейдет в выделение. Щелкните правой кнопкой мыши по тексту и
в контекстном меню выберите Make Work Path (Образовать рабочий контур). Теперь перейдите в палитру Paths (Контуры). Переименуйте Рабочий контур в Контур 1. Отредактируйте контур при помощи инструмента Direct Selection (Стрелка). Загрузите выделение, щелкнув по пунктирному кружку внизу палитры Paths (Контуры). Перейдите в палитру Layers (Слои). Создайте новый слой. Перейдите в палитру Channels (Каналы) и щелкните по значку маски. Появится новый Альфа-канал. Выберите кисть черного цвета и нарисуйте на буквах линии.

 

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

 

 

А если еще поэкспериментировать с фильтрами, то можно получить еще более интересные варианты.

 

 

 

 

Clipping Mask (Обтравочная маска).

Создается при необходимости поместить один объект или фон в границы другого. Создадим маску для верхнего слоя на основе нижнего. Пусть фоновый слой будет белым. Добавим текст. Цвет букв может быть любой. Добавим слой с фотографией над текстовым слоем. Вызываем из меню Layers (Слои) – Make Clipping Mask (Создать Обтравочную Маску). Или тот же пункт из контекстного меню правой кнопки мыши, если выделен верхний слой.
А также, что гораздо удобнее: нажав и удерживая клавишу Alt , наведите на линию между двумя слоями на палитре Layers (Слои), при этом курсор преобразуется
в значок , а миниатюра верхнего слоя сдвинется вправо. Изображение исчезнет за пределами текста, т. к. непрозрачные области слоя с текстом открывают содержимое вышележащих слоев в пределах обтравочной маски. Слева от миниатюры верхнего слоя появится стрелка, а нижний слой станет подчеркнутым – по этим признакам всегда можно сказать, что в документе есть обтравочная маска. Ни в палитре контуры, ни в каналах вы не найдете изученных ранее слоев с альфа-каналами. Нет и миниатюры маски в палитре слои. Но маска все же присутствует в изображении, причем мы можем перемещать фотографию, выбирая нужный фрагмент, или изменять масштаб, но фото не выйдет за рамки текста.

Вместо текста можно использовать слой с фигурами. Нарисуйте фигуру, отметив Shapes (Фигуры) в панели параметров инструмента CustomShape (Произвольная фигура).

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

Для удаления обтравочной маски (как и для создания) щелкните по линии между двумя слоями, удерживая клавишу Alt.

Можно использовать прозрачные области растрового слоя для создания обтравочной маски. Для этого создайте выделение и растушуйте его Shift +F6 или Select (Выделение) – Modify (Модификация) –Feather (Растушевка). Затем обязательно залейте выделение любым цветом при помощи инструмента Paint Bucket (Заливка). Остальные действия аналогичны примеру с текстом. И не забывайте, что вы уже знакомы с режимами наложения и непрозрачностью, их можно и нужно применять по мере необходимости и к базовому слою и к слою с маской. Попробуйте использовать также стили слоя и фильтры.

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

Вопросы:

1. Какую маску нельзя создать в Photoshop?

– Маска слоя.

– Векторная маска.

– Альфа – канал.

– Быстрая маска.

–Обтравочная маска.

– Скрытая маска.

2. Сколько масок можно создать на одном слое?

– 2 маски слоя.

– 1 маску слоя и 1 векторную маску.

– 2 векторные маски.

– 2 любые маски.

–2 маски слоя и 1 векторную маску.

3. Какое действие нельзя применить к маске слоя?

– Feather (Растушевка).

– Gaussian Blur (Размытие по Гауссу).

– Временно отключить.

– Удалить.

 

4. Какое утверждение не верное?

– Белым цветом в Альфа-канале обозначаются выделенные участки.

– При задании обтравочной маски можно использовать несколько слоев.

– Быстрая маска рисуется чёрным цветом, а стирается белым цветом или резинкой.

– Выбирая Альфа-канал, отключаются все цветовые каналы, и включается черно-белое изображение.

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

 

Домашнее задание:

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

1. Откройте файл 25_vjun.jpg или используйте любую свою фотографию. Создайте векторную маску. Создайте три заливочных слоя Цвет, Градиент и Узор. Измените форму векторной маски. Сохраните в формате PSD.

2. Создайте Clipping Mask (Обтравочные маски) для текста, слоя с фигурой и растушеванного выделения.

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

Настя: - Я вроде разобралась с уроком…Обтравочная маска далась легко, даже без видео урока…, а вот  векторная маска немного вызвала сомнения…По теории все ясно и понятно!!! И почему я раньше не работала с масками,особенно с обтравочными? Такие красивые эффеты и главное, все быстро достигается!

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

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

Бабенко Юлия:  - Спасибо, урок полезный, о током вообще не знала. Сложности были, но просмотрев пару раз урок прошли. Просто нужно быть внимательной!)) Одно замечание: когда мы работаем с текстом и необходимо образовать выделенный контур, необходимо чтобы был выделен инструмент выделения (прямоугольное, овальное) иначе не получается, может это только у меня(

Нечипоренко Инна: — Так до этого момента с масками не работала. Было интересно и познавательно. Сложного не было, я бы только добавила, что при работе с маской и фигурой основной фон не должен быть закреплен иначе получается только перенести копию маски, поэтому замочек нужно убирать и тогда будет срабатывать слой фигуры. Уроки обязательно пригодятся. СПАСИБОЧКИ ОГРОМНЕЕШЕЕ за такой трудище, который ты делаешь для ВСЕХ!!!!!!

Зябрева Наталья: - Светлана, здравствуйте! Прошу прощения за столь долгое молчание, я, наверное, самый отстающий ученик! Просто у меня «крякнул» ФШ, пропали все стандартные функции (плагины), часть инструментов, все кисти…….  По уроку. Текстовый файл. стр. 2 «создадим три обтравочных слоя с векторной маской. Для этого щелкните по значку…» Думаю здесь надо подписать, как в видео уроке, что надо активировать контур1 на вкладке «контуры», а затем создавать заливочный слой. Видео урок. Все понятно, за исключением окончательной обработки текста «на пруду».Так много и быстро все сказала, что я ничего не поняла))) Ну в принципе, мы все это уже проходили, так что надо просто поэксперементировать.

Жёлтикова Ольга: - Здравствуйте, Светлана!  Задержалась с ответом, потому что так и не смогла доделать задание.  1. Почему-то у меня вместо  перемещения опорных точек перемещается контур?,,,,,  2. Маска с фигурой не получилась, ничего не видно, а с надписью всё было нормально…Так хотелось научиться работать с масками, а вот что получается. Подскажите, что не так, где я ошиблась… Очень жду ответа, хочется всё-таки разобраться и доделать задание.

Автор: Оля, вы скорее всего  отметили в панели параметров инструмента не значок фигуры а значок контура. Должно получиться! Проверьте, инструмент белая стрелка, два раза нажимаем на контур (первый раз выделяем, второй для редактирования). А зачем так много опорных точек? Вы наверно не обводили пером, а просто перевели выделение в контур. И у слоя с цветовой заливкой не нужно добавлять стиль градиент и узор, они просто вытесняют выбранный вами цвет. Проверила д/з, там у всех слоев опорные точки тянутся, только их слишком много. Желаю удачи. Пишите, если опять не получится.

Титова Ольга: - Привет Светлана! Маски очень интересны, со второй частью у меня проблем не возникло, я этим пользовалась. А вот с первой частью у меня заморочки, ни как ладу не дала, при добавление обводки у меня не заполнялось градиентом, вот как я его поставила, а больше он не увеличивался при расширении рисунка. Надеюсь я  доступно свой косяк изложила))))))). Спасибо тебе за урок!!!!

Елена Михайлова: - Здравствуйте Светлана! Прошу извинить за задержку, но неожиданно подвел компьютер, пришлось чинить. Отправляю вам домашнее задание урока. Я перемудрила при сохранении файлов, и второе задание у меня сохранилось в формате JPG. Обтравочная маска к тексту применена к слову «ЗИМА». Как обычно, комментарии:…….(Автор: — Спасибо! Все исправила!).