Нажмите "Enter" для пропуска содержимого

Как сделать цветной фон в фотошопе: Фоновый слой в Photoshop

Содержание

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

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

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

Скачать архив с материалами к уроку

Метод 1. Используем фильтр Мозаика

Шаг 1

Создаем в Photoshop новый документ любого размера по вашему выбору. Мой будет 1800 х 1200 пикселей.

Шаг 2

Устанавливаем цвет переднего плана #dbdbdb и цвет фона #919191.

Шаг 3

Выбираем Gradient Tool (Градиент). Убедитесь, что на верхней панели установлено

Foreground to Background (От основного к фоновому), Gradient (Градиент) – Linear (Линейный), Mode (Режим) – Normal (Нормальный), Opacity (Непрозрачность) – 100%.

Шаг 4

Рисуем направление градиента из левого верхнего угла в правый нижний.

Шаг 5

Переходим в меню Filter – Pixelate – Mosaic (Фильтр – Оформление – Мозаика). Устанавливаем Cell

Size (Размер ячейки) около 120 и нажимаем OK.

Шаг 6

Идем в меню Layer – New Fill Layer – Solid Color (Слои – Новый слой-заливка – Цвет). Назовем этот слой Color (Цвет), устанавливаем Mode (Режим) Vivid Light (Яркий свет) и нажимаем OK.

Шаг 7

На палитре цветов устанавливаем цвет #cf5ad0 и нажимаем ОК.

Шаг 8

Теперь просто поместите свой контент на новый фон.

Метод 2. Рисуем с помощью Прямоугольника

Шаг 1

Создаем в Photoshop новый документ любого размера по вашему выбору. Мой будет 1800 х 1200 пикселей.

Шаг 2

Выбираем инструмент Rectangle Tool (Прямоугольник) (U). Устанавливаем на верхней панели режим Shape (Фигура), Fill (Заливка) – #bcbec0. Рисуем прямоугольник в нижней части холста как показано на картинке.

Шаг 3

Рисуем еще один прямоугольник над предыдущим, как показано на картинке. Цвет прямоугольника устанавливаем #d1d3d4.

Шаг 4

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

Шаг 5

Выделяем верхнюю фигуру и переходим в меню Layer – Layer Style – Drop Shadow (Слои – Стиль слоя – Тень). Устанавливаем настройки как показано на картинке и нажимаем ОК.

Шаг 6

Кликаем правой кнопкой мыши по этому слою и в появившемся меню выбираем Copy Layer Style

(Скопировать стиль слоя). Выделяем несколько слоев с фигурами, кликаем по ним правой кнопкой мыши и выбираем Paste Layer Style (Вклеить стиль слоя).

Шаг 7

Выделяем верхний слой и идем в меню Layer – New Fill Layer – Gradient (Слои – Новый слой-заливка – Градиент). Назовем этот слой Gradient (Градиент), устанавливаем Mode (Режим) Multiply (Умножение) и нажимаем OK.

Шаг 8

Устанавливаем цвета градиента по своему выбору (в данном случае #f0c27b – #4b1248), Style (Стиль) – Linear (Линейный),

Angle (Угол) на -50º и нажимаем OK.

Шаг 9

Теперь просто поместите свой контент на новый фон.

Метод 3. Рисуем кистью

Шаг 1

Создаем в Photoshop новый документ любого размера по вашему выбору. Мой будет 1800 х 1200 пикселей.

Шаг 2

Выбираем инструмент Brush Tool (Кисть) (B). На верхней панели устанавливаем Mode (Режим) Normal (Нормальный), Opacity (Непрозрачность) и Flow (Нажим) – 100%. Выбираем размер кисти, которым вам нравится рисовать, устанавливаем ее

Hardness (Жесткость) – 0%.

Шаг 3

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

Шаг 4

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

Шаг 5

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

Шаг 6

Повторяем эти действия до тех пор, пока холст не будет заполнен.

Шаг 7

Идем в меню Layer – Merge Visible (Слои – Объединить видимые).

Шаг 8

Идем в меню Filter – Blur – Gaussian Blur (Фильтр – Размытие – Размытие по Гауссу). Устанавливаем Blur Radius (Радиус размытия) на 96 и нажимаем OK.

Шаг 9

Теперь просто поместите свой контент на новый фон.

Метод 4. Используем текстуры

Шаг 1

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

Шаг 2

Идем в меню Filter – Liquify (Фильтр – Пластика). В открывшемся окне выбираем любой размер кисти, как вам нравится, устанавливаем Brush Pressure (Нажим) около 80, выбираем инструмент Forward Warp Tool (Деформация).

Шаг 3

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

Шаг 4

Идем в меню Filter – Blur – Gaussian Blur (Фильтр – Размытие – Размытие по Гауссу). Устанавливаем Blur Radius (Радиус размытия) примерно на 60 и нажимаем OK.

Шаг 5

Теперь просто поместите свой контент на новый фон.

Метод 5. Рисуем Пером

Шаг 1

Создаем в Photoshop новый документ любого размера по вашему выбору. Мой будет 1800 х 1200 пикселей.

Шаг 2

Устанавливаем цвет переднего плана #c33764 и цвет фона #1d2671.

Шаг 3

Выбираем Gradient Tool (Градиент). Убедитесь, что на верхней панели установлено Foreground to Background (От основного к фоновому), Gradient (Градиент) – Linear (Линейный), Mode (Режим) – Normal (Нормальный), Opacity (Непрозрачность) – 100%.

Шаг 4

Рисуем направление градиента из правого верхнего угла в левый нижний.

Шаг 5

Выбираем инструмент Pen Tool (Перо), на верхней панели устанавливаем режим Shape (Фигура).

Шаг 6

Рисуем абстрактную форму.

Шаг 7

Используя перо, рисуем еще несколько произвольных форм (по одной на слое).

Шаг 8

Выделяем первую фигуру и идем в меню Layer – Layer Style – Gradient Overlay (Слои – Стиль слоя – Наложение градиента). Установите градиент

Foreground to Background (От основного к фоновому), остальные настройки как на картинке и нажмите ОК.

Шаг 9

Кликаем правой кнопкой мыши по этому слою и в появившемся меню выбираем Copy Layer Style (Скопировать стиль слоя). Выделяем остальные слои с фигурами, кликаем правой кнопкой мыши и выбираем Paste Layer Style (Вклеить стиль слоя).

Шаг 10

Двойным щелчков мыши открываем окно параметров наложения градиента самой нижней фигуры. В открывшемся окне Layer Style (Стиль слоя) делаем активным параметр Gradient (Градиент) (щелкаем по нему мышкой).

Шаг 11

Щелкаем мышкой по этой конкретной фигуре и с зажатой клавишей передвигаем градиент по фигуре до тех пор, пока не получим желаемый результат. После этого в окне Layer Style (Стиль слоя) нажимаем ОК.

Шаг 12

Повторяем весь процесс для остальных фигур.

Шаг 13

Теперь выделяем любые фигуры и идем в меню Layer – Layer Style – Drop Shadow (Слои – Стиль слоя ­ Тень). Применяем настройки как на картинке и нажимаем ОК.

Шаг 14

Теперь просто поместите свой контент на новый фон.

Автор: Diego Sanchez

Источник: medialoot.com

Цветной абстрактный фон в Фотошоп / Creativo.one

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

Финальное изображение:

Шаг 1

Начините работу с создания нового документа (Ctrl + N) размером 1250px х 1550px, с цветовым режимом RGB и разрешением 72 пиксела. Кликните по иконке Добавить стиль слоя (Add a layer style) в нижней части палитры Слои и выберите стиль Наложение градиента (Gradient Overlay).

В редакторе градиентов (Gradient Editor) установите те оттенки синего, которые показаны на скриншоте и нажмите ОК, чтобы закрыть диалоговое окно.

Фон теперь выглядит так:

Шаг 2

Выберите инструмент Линия (Line Tool) (U) с шириной (Weight) 1 пиксел и нарисуйте линии белого цвета:

Шаг 3

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

Кликните инструментом по фону и нарисуйте фигуру треугольника:

Результат:

Шаг 4

Таким же способом нарисуйте еще один треугольник:

Для второго треугольника установите параметр Заливка (Fill) 0% и добавьте стиль слоя Обводка (Stroke).

Результат:

Шаг 5

Сделайте две копии слоя с последним треугольником (Ctrl + J) и измените размер и расположение этих дубликатов (Ctrl + T):

Шаг 6

Выберите инструмент Произвольная фигура (Custom Shape Tool) (U) и из выпадающего списка фигур выберите Triangle Frame.

Нарисуйте выбранную фигуру:

Установите параметр Заливка (Fill) для этой фигуры 16%. Это сделает фигуру полупрозрачной.

Сделайте дубликат слоя с полупрозрачным треугольником (Ctrl + J), измените размер копии (Ctrl + T) и поместите ее, как показано на скриншоте:

Добавьте к этому слою маску и выберите мягкую круглую кисть черного цвета.

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

Шаг 7

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

Результат:

Установите параметр Заливка (Fill) для этого слоя 68%.

Шаг 8

Создайте новый слой (Shift + Ctrl + N) и нарисуйте овальное выделение инструментом Овальная область выделения (Elliptical Marquee Tool) (M). Кликните правой кнопкой мыши по выделению и выберите пункт Трансформировать выделенную область (Transform Selection). Поверните выделение, как показано на скриншоте:

Не меняя инструмента, кликните по выделению правой кнопкой мыши и выберите пункт Растушевка (Feather). Установите значение растушевки 20%., снова кликните правой кнопкой мыши по выделению и выберите пункт Выполнить заливку (Fill) и залейте выделение белым цветом.

Шаг 9

Сделайте две копии последнего созданного слоя (Ctrl + J), измените размер этих копий (Ctrl + T) и поместите их так, как показано на скриншоте:

Выберите инструмент Произвольная фигура (Custom Shape Tool) (U), выберите фигуру треугольника (Triangle) и нарисуйте треугольник.

Уменьшите параметр Заливка (Fill) до 0% и добавьте стиль слоя Обводка (Stroke).

Результат:

Добавьте слой-маску и выберите мягкую круглую кисть черного цвета с непрозрачностью 15%.

Закрасьте некоторые области на маске, чтобы скрыть их.

Шаг 10

Создайте копию последнего созданного слоя (Ctrl + J), измените ее размер (Ctrl + T) и поместите, как показано на скриншоте. Удалите слой-маску с дубликата.

Шаг 11

Создайте новый слой (Shift + Ctrl + N) и мягкой круглой кистью белого цвета с непрозрачностью 20%, нарисуйте блик:

Результат:

Шаг 12

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

Нажмите клавишу DELETE, чтобы удалить выделенную область:

Зажмите клавишу Alt и добавьте к этому слою маску, затем выберите мягкую круглую кисть белого цвета.

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

Шаг 13

Выберите инструмент Произвольная фигура (Custom Shape Tool) (U) и в списке фигур выберите треугольник (Triangle).

Нарисуйте треугольник:

Уменьшите параметр Заливка (Fill) до 0% и добавьте стиль слоя Обводка (Stroke).

Результат:

Добавьте слой-маску и выберите мягкую круглую кисть с черным цветом и с непрозрачностью 15%. Закрасьте маску выбранной кистью, чтобы скрыть некоторые участки треугольника, как показано на скриншоте:

Шаг 14

Поместите в группу все слои, содержащие линии (Ctrl + G) и установите для этой группы непрозрачность 26%.

Дублируйте группу (Ctrl + J) и объедините ее с оригинальной группой (CTRL + E). Примените фильтр Размытие по Гауссу (Фильтр – Размытие – Размытие по Гауссу) (Filter > Blur > Gussian Blur).

Результат:

Добавьте слой-маску и выберите мягкую круглую кисть с черным цветом:

На маске закрасьте выбранной кистью края линий, чтобы их скрыть:

Шаг 15

Дублируйте последний созданный слой (Ctrl+ J) и удалите с дубликата слой-маску. Добавьте новую маску и пройдитесь по ней мягкой круглой кистью черного цвета, чтобы скрыть края линий:

Создайте новый слой (Shift + Ctrl + N) и выберите мягкую круглую кисть белого цвета с непрозрачностью 15%.

Нарисуйте световые пятна:

Шаг 16

Создайте новый слой (Shift + Ctrl + N) и выберите мягкую круглую кисть белого цвета с непрозрачностью 10%.

Нарисуйте световое пятно в верхней части документа:

Уменьшите параметр Заливка (Fill) для этого слоя до 32%.

Шаг 17

При помощи инструмента Прямоугольник (Rectangle Tool) (U) нарисуйте фигуру прямоугольника:

Уменьшите параметр Заливка (Fill) для этого слоя до 0% и добавьте стиль слоя Наложение градиента (Gradient Overlay).

В редакторе градиентов (Gradient Editor) создайте градиент, используя цвета, которые указаны на скриншоте:

Результат:

Добавьте корректирующий слой Кривые (Curves), чтобы немного скорректировать цвет фигуры:

Результат:

Шаг 18

Выделите все слои и объедините их в один слой (CTRL + E). К полученному слою примените фильтр Контурная резкость (Фильтр – Резкость – Контурная резкость) (Filter > Sharpen > Unsharp Mask).

Результат:

Шаг 19

Дублируйте объединенный в предыдущем шаге слой (Ctrl + J) и примените к дубликату фильтр Размытие по Гауссу (Фильтр – размытие – Размытие по Гауссу) (Filter > Blur > Gaussian blur).

Результат:

Измените режим наложения этого слоя на Точечный свет (Pin Light).

Финальное изображение:

PSD-файл

Автор: adobetutorialz

Перевод: Слуцкая Светлана

Источник: adobetutorialz.com

Как сделать фон прозрачным (photoshop)

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

И так, открываем нашу картинку в фотошопе.

1. Первое, что нужно сделать — создать у картинки рабочую область с прозрачным фоном. Для этого:
— в окошке слоёв кликаем два раза на наш слой (с замочком)
— В повившемся окошке нажимаем ОК

Замочек должен исчезнуть

2. Далее…

Если фон однотонный:
Выбираем инструмент «Волшебная палочка» — это очень гибкий инструмент для выделения нужной области. Наша задача выделить весь фон, кроме рисунка. Для этого подгоняем настройки волшебной палочки (параметр допуск), пока не получим нужный результат. Так-же пользуемся клавишей Shift, чтобы выделить область помимо уже выделенной. Нажимаем Del и выделенная облась удаляется.

Если фон разноцветный:
Используем инструмент «Быстрое выделение«. Тут наша задача выделить не фон, а сам объект, который должен остаться. Нажимаем до тех пор, пока не выделится нужная область. Если выделилось лишнее, зажимаем Alt и минусуем облась. Посмотреть результат можно клавишей Q.
Когда выделение готово, копируем его Ctrl+C. Создаем новый документ с прозрачным фоном (Ctrl+N) и вставляем туда объект Ctrl+V.

3. Если на рисунке осталось что-то лишнее, используем инструмент «Ластик«, просто затираем лишний фон.

4. Сохраняем изображение для Web (Alt+Shift+Ctrl+S) выбираем формат GIF либо PNG (в других наш прозрачный фон превратится в белый).

Полезное видео в тему:

Похожее

Запись опубликована в рубрике Разное с метками Photoshop.

Фоновый слой в Photoshop

Правило 1: Мы не можем перемещать содержимое фонового слоя

Первое, что мы не можем сделать с фоном, это перемещать его содержимое. Обычно, для перемещения содержимого слоя используется одноимённый инструмент «Перемещение» (Move Tool), он находится в верхней части панели инструментов:

Если мы возьмём этот инструмент и попробуем переместить фон, или даже просто кликнуть внутри окна документа, то Photoshop выдаст нам сообщение: «Применение инструмента «Перемещение» невозможно: слой закреплен.» (Could not complete your request because the layer is locked).

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

Правило 2: Не поддерживает прозрачность

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

Во-первых, мне нужно создать выделенную область внутри рамки, и т.к. она заполнена белым цветом, я буду использовать инструмент «Волшебная палочка» (Magic Wand Tool). В Photoshop CS3 и выше (я здесь использую Photoshop CS6), «Волшебная палочка» вложена за инструментом «Быстрое выделение» (Quick Selection Tool), поэтому нажмите на инструмент «Быстрое выделение» и удерживайте клавишу мыши секунду-две, пока не откроется выпадающее меню, а уже из него выберите «Волшебную палочку»:

«Волшебной палочкой» я кликну по белому квадрату внутри рамки, после чего появится выделенная область, ограниченная пунктирной линией «бегущие муравьи» по периметру прямоугольника:

Чтобы удалить пиксели внутри выделенной области, мне нужно нажать клавишу клавиатуры Backspace или Delete, но вместо удаления области и замены её прозрачностью, как получилось бы на обычном слое, Photoshop почему-то открывает диалоговое окно Заливки (Fill) для выбора цветов для заполнения области:

Мне это не надо, поэтому я нажму на кнопку «Отмена» (Cancel), чтобы закрыть это диалоговое окно, ведь хотел удалить белую область внутри рамки, а не заполнять её другим цветом. Предположим, что Photoshop просто ошибся, так что я буду пробую другой способ удаления пикселей. Пройдём по вкладке главного меню Редактирование —> Вырезать (Edit —> Cut). На обычном слое после этого действия на месте выделенной области появится прозрачная (пустая) область, а у меня опять получился неожиданный результат — выделенная область заполнена чёрным:

Ну и почему так получилось?
Как оказалось, Photoshop заполнил эту область черным, потому что, на цветовой палитре цвет фона (правый нижний образец) на данный момент — чёрный. Если бы цвет фона на данный момент был бы установлен, к примеру, фиолетовым, то область и заполнилась бы фиолетовым:

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

Так как же я смогу разместить фотографию внутри рамки? Давайте отложим эту проблему на некоторое время и вернемся к ней чуть позже.

Правило 3: Мы не можем помещать фоновый слой над другой слоем

Вот фото, которое я хочу поместить внутри моей фоторамки:

Это изображение в настоящее время открыто у меня в отдельном окне Фотошопа, так что я быстро скопирую его в документ фоторамки, нажав комбинацию клавиш Ctrl+A для выбора всей фотографии, затем Ctrl+C, чтобы скопировать изображение в буфер обмена. Затем перехожу на документ фоторамки и нажимаю Ctrl+ V для вставки изображения в документ. Photoshop помещает изображение на новый слой «Слой 1» (Layer 1) выше фонового слоя с фоторамкой:

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

Для того, чтобы мое второе изображение оказалось внутри рамки, мне нужно изменить порядок слоёв в панели слоёв так, чтобы слой с рамкой находился над слоем с изображением. Как правило, перемещение одного слой поверх другого осуществляется элементарно с помощью мыши, но сейчас у нас не тот случай, т.к. слой, который нам нужно переместить, является фоновым. При попытке перетащить его выше изображения на «Слой 1», Photoshop отображает символ в виде круга с диагональной линией (международный символ запрета чего-либо), давая понять, что по какой-то причине это действие неосуществимо:

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

Правило 4: нельзя поместить любые слои ниже фонового

Итак, мы не можем двигаться фоновый слой поверх другого слоя. Что, если мы попробуем переместить обычный слой ниже фонового? Если я попытаюсь перетащить «Слой 1» под фоновый, то Фотошоп выдаст такой же символ запрета, как и в случае выше:

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

Давайте подведём итог. Мы узнали, что Photoshop не позволит нам переместить содержимое фонового слоя инструментом «Перемещение» (Move Tool), потому что слой зафиксирован на месте. Мы узнали, что фоновый слой не поддерживает прозрачность, так что нет никакого способа, чтобы удалить что-либо на нём. И мы узнали, что фоновый слой всегда должен оставаться нижнего всех слоёв в панели. Мы не можем перетащите его выше других слоёв, и мы не можем перетащить другие слои ниже.

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

Преобразуем фоновый слой в обычный (разблокирование фонового слоя)

1) Пройдите по вкладке главного меню Слой —> Новый —> Слой из Фона (Layer —> New —> Layer From Background).

2) Имеется и более быстрый способ — просто дважды щелкнуть непосредственно по слову Фон (Background), либо по иконке замочка в панели слоёв:

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

3) И самый быстрый способ. Зажмите клавишу Alt и дважды щёлкните мышкой по слову Фон (Background), после чего Фотошоп мгновенно преобразует слой в обычный и переименует его в «Слой 0» (Layer 0), минуя диалоговое окно.

Итог

После того, как мы преобразовали фоновый слой в обычный, все ограничения сняты и на него действуют правила обычных слоёв.
Теперь мы можем свободно перемещать его содержимое с помощью инструмента «Перемещение» (Move Tool), мы можем удалять какие-либо элементы на слое и заменять их прозрачностью, и мы можем свободно перемещать его выше или ниже других слоёв.

Фотошоп, прозрачный, белый и другой фон.

Поделиться статьёй:

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

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

Делаем фон в Фотошопе простой и с размытием

Шаг 1. Начинаем с определения параметров. Открываем документ, который и будет основным полотном для фона. Сверху можете наложить текст — если, к примеру, создаете открытку или макет рекламного баннера. Не забудьте в диалоговом окне написать имя файла (иначе при сохранении может затеряться в списке других документов). Следующий шаг — указываем размер. Для открытки лучше выбрать стандартный А4 (если рабочее поле получится меньше, края обрезаются). И определяем текстуру фона: прозрачная или белая матовая.

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

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

Шаг 4. Создаем градиентный перелив. Если вам не нравится однотонный фон, хотите задать области несколько оттенков — используйте инструмент Градиент, который также расположен на вертикальной панели слева. В параметрах увидите много интересных вариантов с полосами, треугольниками, контрастными переливами.  

Шаг 5. Эксперименты с фильтрами. Хотите сделать изображение еще более эффектным — примените фильтры. Их можно выбрать в окне, расположенном в самой верхней панели — “Фильтр”, затем из выплывающего окна “Галерея фильтров”.

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

Создаем фон в фотошопе с эффектом Затмения Солнца

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

Шаг 1. Заходим в Фотошоп и, как описано выше, создаем базовый документ. Соблюдаем размер 1900х1200 pixel. Затем нам нужно из вертикальной панели инструментов выбрать значок с пунктирным прямоугольником — Прямоугольная область (если у вас англоязычная версия — Rectangular Marquee Tool (M). Ваша задача — выделить на черном фоне область и потом залить ее серым цветом (на новом слое).

Шаг 2. Теперь нам нужно определить настройки для кисти, которая будет выполнять основную художественную задачу. В меню выбираем Редактирование, затем — Определить кисть (для англоязычной версии Фотошопа — это Edit и Define Brush Preset). Ва нужно переименовать кисть в “Полосы кисть” (Strips Brush).

Шаг 3. Настраиваем параметры кисти. Выбираем в Окне — Кисть (для англо-версии Window и Brushes). Для поставленной задачи вам нужно использовать Динамику формы (на english — Dynamics Shape), Передачу, Динамику цвета (Dynamics Color) и Рассеивание. Ваша рабочий инструмент — Strips Brush.  

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

Задаем параметр по Динамике формы:

  • Ставим галочку рядом с Рассеиванием. На шкале определяем требуемые значения:

Теперь переходим к Динамике цвета. Обратите внимание на частоту и проценты в колебании переднего и заднего плана, тона, насыщенности и яркости. Оптимальные показатели — 50%:

И Передача. Здесь задаем параметры колебаниям непрозрачности и количества краски (в пределах 40 и 70%):

Шаг 4. Создаем полосы, которые в итоге станут красивыми бликами солнечного сияния. Сначала нам нужно сделать темный фон, который будет контрастировать с разноцветными элементами основной композиции. Для этого нам надо спрятать слой, на котором была создана базовая кисть, назовите его, к примеру, “Для работы с кистью”. Затем делаем новый слой и проводим по нему кистью горизонталь слева направо. Создаем Стиль слоя и идем к стилю Тень. Обязательно применяем параметры Затемнения основы: размер 10 pixel, непрозрачность на 70-75%, смещение — 5 и угол 125°.

В итоге у вас должна получиться такая картинка:

Вам нужно будет повторить эти действия два раза: создавать новые слои, проводить кистью полосу слева направо и задавать параметры в Затемнении основы. Затем объединяем все получившиеся слои с полосками и меняем размер в горизонтали, используя в одновременном нажатии клавиши Ctrl и T:

Шаг 5. Работаем с цветом полосок. Начинаем с цепочки Меню — Фильтр — Размытие — Размытие в движении. Устанавливаем показатели: смещение на 155 pixel, угол 90°. Следующая цепочка: Слои — Новый слой — Заливка — Градиент. Нам нужен линейный стиль, непрерывный градиент, угол 90°, масштабируем на 80% и выбираем нужный оттенок.

Затем меняем Смешивание на режим Перекрытия (на english версии — Overlay).

Если на знакомство с Фотошопом ушло много времени и вы нетерпеливы, на этом варианте можно вполне остановиться и самостоятельно использовать эту картинку как фоновую заставку. Но можно и пойти дальше, довести дело до конца — до эффектного “Затмения Солнца”.  

Шаг 6. В панели инструментов находим Эллипс (в англо-версии при наведении мышкой на значок будет написано Ellipse Tool). Рисуем большой эллипс, выбрав стиль Фигуру. Используем темную заливку.

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

Шаг 7. Создаем сияние. Для этого нам опять нужен новый слой, который заполняем черным слоем. Идем по цепочке в верхнем меню: Фильтр — Ренденинг — Блик (и для английской версии: Filter — Render — Lens Flare). Рабочими параметрами должны быть: 50-300 трансфокатор в Типе объектива, 100% яркости. И выбираем режим Экран (Screen).

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

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

Снова меняем режим: Наложение на Экран. Выбираем Эллипс, переходим в Стиль слоя, останавливаемся на Внешнем сечении. Наложение делаем с параметрами Жесткого света, 60% непрозрачности, с размером в 60 pixel, свечению задаем ярко желтый цвет.

Затем создаем верхний слой черного цвета и переходим по цепочке Фильтр — Галерея фильтров — Текстуры — Зерно. Меняем режим на Soft Light и задаем значение 60%. Теперь нужно уменьшить непрозрачность до 50%. Урок закончен, ваше Солнечное Затмение готово!  


Подводим итоги

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

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

Поделиться статьёй:

Действие «Заливка цветом» в фотошопе

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

Залить цветом существующий слой. После того, как вы создадите новый слой, выберите команду меню «Редактирование — Выполнить заливку». В раскрывающемся списке «Использовать» появившегося диалогового окна «Заполнить» выберите цвет, а затем нажмите кнопку ОК. Вы также можете залить основным цветом, нажав сочетание клавиш Alt+Backspace.

Создать слой заливку. Если вы не уверены, какой цвет хотите использовать, выберите команду меню «Новый слой-заливка» и укажите вариант «Цвет». Задайте слою имя в появившемся диалоговом окне и нажмите кнопку ОК. Программа фотошоп отобразит диалоговое окно «Палитра цветов», чтобы вы могли выбрать желаемый цвет заливки. Если вы решите изменить цвет, дважды щелкните мышью по миниатюре и вновь откроется диалоговое окно, чтобы вы могли выбрать новый цвет или захватить его из самого изображения. Слои-заливки создаются уже с собственными масками, и поэтому при необходимости будет очень легко скрыть часть слоя.

 

Примечание

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

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

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

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