Содержание
Рисуем фон в стиле 80-х в Photoshop и Illustrator
Сегодняшняя работа была создана автором под вдохновением от фильма «Кунг Фьюри». Это необычное кино, выдержанное в стилистике 80-х годов. В нем много ссылок на это время и на эстетику первых компьютерных игр, вроде светящейся сетки. Для выполнения работы мы воспользуемся программами Photoshop и Illustrator.
Шаг 1
Начнем с создания сетки. Быстрее и удобнее создать ее в Illustrator при помощи инструмента Rectangular Grid/Прямоугольная сетка. Создайте сетку размером в 40 на 40 делений. Следующий шаг будет уже в Photoshop.
Шаг 2
Создайте новый документ в Photoshop. В нашем примере он будет размером 2880×1800 px. Вставьте сетку в документ и смените цвета сетки на белый.
Шаг 3
В меню выберите Edit>Transform>Distort/Редактировать>Трансформировать>Исказить. Затем исказите сетку как показано ниже.
Шаг 4
У вас должно быть свободно больше половины экрана. Вот результат.
Шаг 5
Выберите фоновый слой и в меню найдите Layer>Layer Style>Gradient Overlay/Слой>Стиль слоя>Перекрытие градиенты.Укажите градиент от фиолетового к синему и убедитесь что включена опция Dither/Дизеринг.
Шаг 6
Выберите слой с сеткой и добавьте его в группу. Смените Blend Mode/Режим наложения группы на Color Dodge/Осветление основы. После этого дублируйте слой с сеткой и примените к нему эффект Gaussian Blur/Размытие по Гауссу (5px). После этого укажите слою с размытием стиль слоя Outer Glow/Внешнее свечение. Укажите 30px в качестве Размера/Size. Теперь наша сетка светится.
Шаг 7
Дублируйте группу и отразите ее по вертикальной оси, чтобы создать верхнюю часть.
Шаг 8
Инструментом Ellipse/Эллипс создайте белый овал в центре документа, как показано ниже.
Шаг 9
В меню выберите FIlter>Blur>Gaussian Blur/Фильтр>Размытие>Размытие по Гауссу и укажите овалу размытие в 60 px.
Шаг 10
Создайте новый слой и залейте его черным цветом. Затем растушеванной кистью рисуйте в центре документа, как показано нижу.
Шаг 11
Смените Blend Mode/Режим наложения слоя на Multiply/Умножение.
Шаг 12
Создайте новый слой и залейте его белым цветом. После этого в меню выберите Filter>Noise>Add Noise/Фильтр>Шум>Добавить шум. Укажите 8% шума в режиме Gaussian/По Гауссу.
Шаг 13
Смените Blend Mode/Режим наложения слоя на Overlay/Перекрытие. Вы также можете добавить полосатый паттерн сверху, для большего ретро-эффекта.
Результат
Автор урока abduzeedo
Перевод — Дежурка
Смотрите также:
Фон сетка — 61 фото для презентаций и картинок на рабочий стол
Клеточный фон для презентации
Графические обои
Фон сетка
Клетка чёрно белая обои
Синие соты
Забор сетка рабица для фотошопа
Фон мелкая клетка
Синий металлический фон
Карбоновая сетка
Забор обои
Черные соты
Ромб на белом фоне
Фиолетовая сетка
Металлические соты
Карбон соты
Обои в сеточку
Розовая сетка фон
Фон в клетку
Черно белая сетка
Соты абстракция
Фон сетка градиент
Синяя решетка
Фон сетка
Фон сетка цветная
Сетка рябица или рабица
Пчелиные соты
Фиолетовый в крапинку
Фон шестиугольники
Фоновые защитные сетки
Красивая сетка
Синий фон сетка
Эстетика сетка
Карбон текстура
Перфолист нержавейка
Эстетика забор сетка
Армированное стекло
Синий фон сетка
3д фон
Карбон текстура
Черные обои
Соты фактура
Синяя абстракция
Сетка металлическая синяя
Клеточки черные
Сетчатый забор для фотошопа
Абстрактный фон сетка
Фон решетка
Фон сетка
Фон для сайта
Черно белая сетка
Сетка абстракция
Фон сетка
Розовая клетка
Фон точки
Сетчатый забор Эстетика
Фон сеточка
Синяя текстура
Фон решетка
Красивая сетка
Цветная сетка фотоэффект с фотошопом
В этом уроке о фотоэффектах мы научимся отображать фотографию в виде сетки из разноцветных квадратов! Мы будем использовать встроенную сеточную функцию Photoshop в качестве руководства для настройки начального расстояния, а затем превратим ее в пиксельную сетку, используя пару редко используемых инструментов выбора Photoshop. Мы увидим, как легко выбирать различные квадраты в сетке с помощью инструмента «Волшебная палочка», как их раскрасить с помощью корректирующих слоев и режимов наложения, и, наконец, как настроить внешний вид самой сетки с помощью стилей слоев!
Эта версия руководства была обновлена для Photoshop CS6, а также полностью совместима с Photoshop CC (Creative Cloud). Для CS5 и более ранних версий вы можете обратиться к нашему оригинальному учебнику по Color Grid Design.
Вот изображение, с которым я буду работать (женщина с фотографией зимней одежды от Shutterstock):
Исходное изображение.
А вот как будет выглядеть дизайн цветовой сетки, когда мы закончим. Конечно, вы можете использовать любой понравившийся вам цвет для вашего эффекта. Это только один пример:
Конечный эффект.
Как создать эффект фото цвета сетки
Шаг 1: создайте новый документ Photoshop
Давайте начнем с создания нового документа для сетки. Перейдите в меню « Файл» в строке меню в верхней части экрана и выберите « Создать» :
Идем в Файл> Новый.
Откроется диалоговое окно Photoshop New . Этот эффект лучше всего работает с документом квадратной формы, поэтому в этом уроке я установлю значения « Ширина» и « Высота» на 1000 пикселей . Конечно, не стесняйтесь заменять мои значения теми измерениями, которые вам нужны, но опять же, вам понадобится квадратный документ для достижения наилучших результатов. Я не планирую печатать это (это будет строго для просмотра на экране), поэтому не нужно беспокоиться о значении Разрешения (я оставлю его по умолчанию равным 72 пикселя / дюйм), но если вы создавая этот эффект для печати, вы, скорее всего, захотите создать документ размером более 1000 x 1000 пикселей и установить разрешение около 240 пикселей / дюйм или выше. Нажмите OK, когда вы закончите, чтобы закрыть из диалогового окна. Новый документ появится на вашем экране:
Создание нового документа Photoshop с помощью диалогового окна New.
Шаг 2: включите сетку фотошопа
Далее мы включим встроенную сетку Photoshop, чтобы использовать ее в качестве руководства для создания нашей пиксельной сетки. Чтобы включить сетку, перейдите в меню « Вид» в верхней части экрана, выберите « Показать», затем выберите « Сетка» :
Идем в Вид> Показать> Сетка.
Сетка будет отображаться как наложение поверх вашего документа. Мы внесем некоторые изменения в вид сетки:
Документ после включения сетки фотошопа.
Шаг 3: Отрегулируйте количество линий сетки
Мы можем отрегулировать количество линий и разделов в сетке, используя настройки Photoshop. Если вы работаете в Photoshop на ПК с Windows, перейдите в меню « Правка» в верхней части экрана, выберите « Настройки», затем « Направляющие», «Сетка и фрагменты» . На Mac перейдите в меню Photoshop, выберите « Настройки», затем выберите « Направляющие, сетка и фрагменты» :
Выбор параметров направляющих, сетки и фрагментов.
Откроется диалоговое окно «Установки» с настройками «Направляющие», «Сетка» и «Срезы». В разделе «Сетка» измените параметр «Сетка по каждому параметру» на 10 процентов, что даст нам сетку 10х10, и измените значение « Подразделения» на 1, чтобы предотвратить разбиение сетки на более мелкие секции. Следите за сеткой в документе, и вы увидите предварительный просмотр изменений по мере их внесения:
Настройка Gridline Every на 10 процентов и подразделений на 1.
Нажмите OK, когда закончите, чтобы закрыть диалоговое окно Preferences. Теперь вы должны увидеть сетку 10 секций шириной и 10 секций высотой. Важно отметить, что эта сетка на самом деле не является частью документа. Это просто визуальное руководство, которое мы будем использовать, чтобы помочь нам создать собственную пиксельную сетку, как мы это сделаем через мгновение:
Сетка после изменения параметров в настройках.
Шаг 4: добавь новый пустой слой и назови его «Grid»
Давайте добавим новый пустой слой для хранения пиксельной сетки, которую мы собираемся создать. Нажмите и удерживайте клавишу Alt (Win) / Option (Mac) на клавиатуре и щелкните значок « Новый слой» в нижней части панели «Слои»:
Нажав на иконку «Новый слой», удерживая Alt (Победа) / Option (Mac).
Это открывает диалоговое окно New Layer, давая нам возможность назвать новый слой перед его добавлением. Назовите слой «Сетка», затем нажмите «ОК», чтобы закрыть диалоговое окно:
Называя новый слой.
Ничего не произойдет в самом документе, но мы видим на панели «Слои», что Photoshop добавил новый слой «Сетка» над фоновым слоем:
Слой сетки отображается на панели «Слои».
Шаг 5: выбери инструмент выделения одной строки
Чтобы создать нашу сетку, мы будем использовать два самых простых и редко используемых инструмента выбора Photoshop — инструмент «Однорядная область» и «Средство для одной строки». Мы начнем с однорядного инструмента выделения. По умолчанию оба этих инструмента вложены в инструмент « Прямоугольная область», поэтому нажмите и удерживайте инструмент «Прямоугольная область» в верхней части панели «Инструменты», пока не появится всплывающее меню, показывающее другие инструменты, доступные в том же месте, а затем выберите инструмент Single Row Marquee Tool из меню:
Нажмите и удерживайте инструмент «Прямоугольная область», затем выберите «Инструмент с одной строкой».
Шаг 6: Нажмите на каждую горизонтальную линию сетки
Как следует из названия, инструмент выделения одной строки выделит одну горизонтальную строку пикселей в документе. Вот и все, это все, что он делает. Чтобы использовать его, нам просто нужно щелкнуть мышью в любом месте документа, и Photoshop автоматически выберет пиксель, на который мы нажали, а также все остальные пиксели в этом ряду слева направо. Мы собираемся использовать инструмент для преобразования горизонтальных линий сетки в серию контуров выделения. Сначала наведите курсор на верхнюю горизонтальную линию сетки, затем щелкните мышью. Вы увидите контур выделения толщиной 1 пиксель вдоль линии сетки. Я обвел точку, где щелкнул, но нажатие в любом месте строки даст вам точно такой же результат. Если вы заметили, что ваш щелчок не был непосредственно над линией сетки, просто нажмите Ctrl + Z (Win) / Command + Z (Mac) на клавиатуре, чтобы отменить его, и попробуйте снова:
Щелкните в любом месте на первой горизонтальной линии сетки вверху, чтобы выделить весь ряд пикселей.
Далее мы добавим остальные горизонтальные линии сетки к нашему выбору. Нажмите и удерживайте клавишу Shift на клавиатуре и нажмите на следующую линию сетки под ней. Это выберет второй горизонтальный ряд пикселей, и поскольку мы удерживали клавишу Shift, Photoshop добавит этот второй выбор к первому. Продолжайте удерживать нажатой клавишу Shift, нажимая на остальные горизонтальные линии сетки, пока вдоль каждого из них не появится контур выделения. Когда вы закончите, вы должны увидеть всего девять строк выбора. Убедитесь, что вы удерживаете нажатой клавишу Shift при нажатии на каждую из них, в противном случае вы просто замените предыдущий выбор новым:
Нажмите и удерживайте Shift и нажмите на каждую горизонтальную линию сетки, чтобы добавить ее в выделение.
Шаг 7: переключитесь на инструмент выделения одной колонки
Теперь нам нужно сделать то же самое с вертикальными линиями сетки, что означает, что нам нужно переключиться на инструмент одностолбцкого выделения. Нажмите и удерживайте инструмент выделения одной строки на панели «Инструменты» (он появится там, где раньше был значок «Прямоугольный инструмент выделения»), пока не появится всплывающее меню, затем выберите « Инструмент выделения одной колонки» из меню:
Нажмите и удерживайте инструмент выделения одной строки, затем выберите инструмент выделения одной колонки.
Шаг 8: Нажмите на каждую вертикальную линию сетки
Инструмент выделения отдельных столбцов работает так же, как и инструмент выделения отдельных строк, с той лишь разницей, что он выбирает столбцы пикселей (сверху вниз), а не строк, причем каждый столбец имеет ширину 1 пиксель. Нажмите и удерживайте клавишу Shift и нажимайте на каждую из вертикальных линий сетки слева направо, пока все они не будут выбраны. Когда вы закончите, вы должны увидеть контуры выделения вдоль каждой линии сетки, как горизонтальной, так и вертикальной:
Все горизонтальные и вертикальные линии сетки были добавлены в выделение.
Шаг 9: заполните выделение черным
Мы создадим нашу сетку, заполнив горизонтальные и вертикальные выделения черным. Перейдите в меню « Правка» в верхней части экрана и выберите « Заполнить» :
Собираюсь Правка> Заполнить.
Откроется диалоговое окно « Заполнение» в Photoshop. Установите опцию Использовать в верхней части на Черный, затем нажмите OK:
Установите для параметра «Использовать» значение «Черный».
Photoshop заполняет выделение черным, хотя это может быть трудно увидеть с помощью контуров выделения и собственной сетки Photoshop. Чтобы удалить контуры выделения (поскольку они нам больше не нужны), перейдите в меню « Выбор» в верхней части экрана и выберите « Отменить выбор»:
Собираюсь Выбрать> Отменить выбор.
Затем, чтобы отключить сетку Photoshop, перейдите в меню « Вид», выберите « Показать», затем еще раз выберите « Сетка» . Галочка слева от слова Grid означает, что он в данный момент включен. Повторный выбор приведет к удалению галочки и отключению сетки:
Идем в Вид> Показать> Сетка.
С удаленными контурами выделения и сеткой Photoshop мы можем видеть нашу черную сетку в документе:
Документ, показывающий вновь созданную сетку.
Шаг 10. Откройте фотографию, которую хотите отобразить в сетке.
Откройте фотографию, которую вы будете отображать внутри сетки. Фотография откроется в своем собственном документе с вкладками. Вот фотография, которую я использую:
Ваша фотография откроется в отдельном документе с вкладками.
Шаг 11: выбери и скопируй фотографию
На данный момент наша сетка находится в одном документе, а наша фотография — в другом. Нам нужно переместить фотографию в тот же документ, что и сетка. Для этого сначала выберите фотографию, зайдя в меню « Выбрать» в верхней части экрана и выбрав « Все» :
Собираюсь Выбрать> Все.
Контур выделения появится по краям фотографии. Затем перейдите в меню « Правка» в верхней части экрана и выберите « Копировать» :
Собираюсь Правка> Копировать.
Шаг 12: переключись на документ сетки
Переключитесь на документ таблицы, щелкнув его вкладку под панелью параметров в верхней части. В моем случае документ называется просто «Без названия-1»:
Переключение с документа фотографии на документ сетки.
Шаг 13: выбери фоновый слой
Открыв документ сетки, щелкните фоновый слой на панели «Слои», чтобы выбрать его. Таким образом, когда мы вставляем фотографию в документ, Photoshop поместит ее на новый слой непосредственно между фоновым слоем и слоем сетки:
Выбор фонового слоя.
Шаг 14: вставь фотографию
Поднимитесь в меню Edit, выберите Paste Special, затем выберите Paste in Place :
Собираемся Править> Специальная вставка> Вставить на месте.
Фотошоп вставляет и центрирует фотографию в сетке документа. В моем случае (и, скорее всего, также и вашем) размер фотографии нужно будет изменить, но мы исправим это следующим образом:
Фотография была вставлена в сетку.
Если мы посмотрим на панель «Слои», то увидим, что Photoshop добавил фотографию на свой собственный слой между слоями «Фон» и «Сетка», как мы и планировали:
Фотография появится между фоновым и сеточным слоями.
К сожалению, Photoshop дал новому слою общее имя («Слой 1»), поэтому, прежде чем мы продолжим, давайте переименуем его. Дважды щелкните его имя, чтобы выделить его, затем введите «Фото» в качестве нового имени. Нажмите Enter (Win) / Return (Mac) на клавиатуре, когда вы закончите, чтобы принять изменение имени:
Название слоя было изменено с «Слой 1» на «Фото».
Шаг 15: конвертируй слой фотографии в смарт-объект
Через некоторое время мы изменим размер фотографии, чтобы она лучше вписывалась в сетку, но прежде чем мы это сделаем, давайте быстро превратим ее слой в смарт-объект . Таким образом, если мы решим изменить его размер позже, мы не потеряем качество изображения. Выбрав слой «Фото», нажмите на маленький значок меню в верхнем правом углу панели «Слои»:
Нажав на значок меню.
Выберите « Преобразовать в смарт-объект» в появившемся меню:
Выберите «Преобразовать в смарт-объект» в меню панели «Слои».
Похоже, в документе ничего не произошло, но в правом нижнем углу миниатюры предварительного просмотра слоя на панели «Слои» появляется небольшой значок смарт-объекта . Это говорит нам о том, что слой теперь является смарт-объектом:
Миниатюра предварительного просмотра слоя со значком смарт-объекта.
Шаг 16: измени размер фото со свободным преобразованием
Чтобы изменить размер фотографии, мы будем использовать команду Photoshop Free Transform. Перейдите в меню « Правка» в верхней части экрана и выберите « Свободное преобразование» :
Собираемся Правка> Свободное Преобразование.
Это помещает ограничивающую рамку Free Transform и обрабатывает изображение. Если вы не видите маркеры, потому что края вашей фотографии выходят за пределы видимой области документа, перейдите в меню « Вид» и выберите «По размеру экрана» :
Идем в View> Fit на экране.
Photoshop мгновенно уменьшит изображение настолько, чтобы все, включая маркеры «Свободное преобразование», поместилось в видимой области документа. Чтобы изменить размер фотографии, нажмите и удерживайте клавишу Shift, затем нажмите любую из четырех угловых ручек и перетащите их. Удерживая клавишу Shift при перетаскивании, вы сохраните исходное соотношение сторон изображения, чтобы вы случайно не исказили его внешний вид. Если вы хотите изменить размер фотографии из ее центра, а не из угла, нажмите и удерживайте Shift + Alt (Победа) / Shift + Option (Mac) при перетаскивании любой из угловых ручек. Если вам нужно переместить изображение внутри документа, щелкните в любом месте внутри ограничительной рамки «Свободное преобразование» и перетащите его на место. Когда вы закончите, нажмите Enter (Win) / Return (Mac), чтобы принять преобразование и выйти из команды Free Transform:
Перетащите угловой маркер, чтобы изменить размер изображения внутри сетки.
Если вы сократили изображение минуту назад с помощью команды «Подогнать на экран» и хотите увеличить масштаб теперь, когда вы закончили изменять размер изображения, вернитесь в меню « Вид» и выберите « 100%» :
Собираюсь посмотреть> 100%.
Связанное Чтение: Масштабирование и Панорамирование В Фотошопе
Шаг 17: выбери слой сетки
На этом этапе тяжелая работа сделана. Мы создали нашу сетку, мы скопировали и вставили нашу фотографию в документ сетки, а также изменили размеры и переместили фотографию в нужное положение. Мы готовы немного покрасить сетку! Сначала нажмите на слой Grid на панели Layers, чтобы выбрать его:
Выбор слоя сетки.
Шаг 18: выбери инструмент волшебной палочки
Чтобы раскрасить сетку, нам нужен способ выбора отдельных квадратов, и мы можем сделать это легко, используя Photoshop Magic Wand Tool . По умолчанию инструмент «Волшебная палочка» вложен за инструментом « Быстрый выбор» на панели «Инструменты», поэтому нажмите и удерживайте инструмент «Быстрый выбор», пока не появится всплывающее меню, затем выберите инструмент «Волшебная палочка» из меню:
Нажмите и удерживайте инструмент быстрого выбора, затем выберите инструмент «Волшебная палочка».
Шаг 19: выбери квадраты внешнего края
Чтобы выбрать квадрат в сетке, убедитесь, что на панели «Слои» выбран слой «Сетка» (очень важно!), Затем просто щелкните внутри квадрата с помощью инструмента «Волшебная палочка». Контур выделения появится вокруг внешних краев квадрата. Чтобы затем добавить дополнительные квадраты к выделению, нажмите и удерживайте клавишу Shift и щелкните внутри других квадратов. Вы будете выбирать каждый новый квадрат, по которому щелкаете внутри, и выбор будет добавлен к ранее выбранным квадратам. Давайте начнем с выбора всех квадратов вокруг внешнего края сетки. Сначала щелкните внутри квадрата в верхнем левом углу сетки. Вокруг него появится контур выбора. Чтобы было легче увидеть, какой квадрат я выбрал, я выделил его желтым на скриншоте. Это не часть эффекта; это просто, чтобы было легче увидеть, какой квадрат выбран:
Квадрат в верхнем левом углу сетки выделен.
Затем нажмите и удерживайте клавишу Shift и продолжайте щелкать с помощью инструмента «Волшебная палочка» внутри каждого из квадратов вокруг внешних краев сетки, чтобы добавить их все в выделение. Опять же, я раскрасил выделенные квадраты в желтый здесь, чтобы было легче увидеть на скриншоте. Желтый не является частью реального эффекта, поэтому не беспокойтесь, что вы не увидите его в своем документе:
Все квадраты вокруг внешних краев сетки теперь выделены.
Я собираюсь добавить еще несколько квадратов к своему выбору, снова нажав и удерживая мою клавишу Shift и щелкнув внутри них, чтобы добавить их к ранее выбранным квадратам:
Мои изначально выделенные квадраты.
Шаг 20: добавь новый слой ниже слоя сетки
Мы заполним эти начальные квадраты белым цветом, что создаст границу для эффекта. Нажмите и удерживайте клавиши Ctrl + Alt (Победа) / Command + Option (Mac) на клавиатуре и нажмите значок « Новый слой» в нижней части панели «Слои»:
Нажав на иконку New Layer, удерживая Ctrl (Победа) / Command (Mac).
Это открывает диалоговое окно New Layer. Назовите этот новый слой «White», затем нажмите OK:
Называя новый слой «Белый».
Photoshop добавляет новый пустой слой под названием «Белый» между слоями «Сетка» и «Фото»:
Панель «Слои» показывает новый белый слой.
Шаг 21: заполните выделение белым
Поднимитесь в меню Edit в верхней части экрана и еще раз выберите команду Fill . На этот раз, когда появится диалоговое окно Fill, измените опцию Use на White, затем нажмите OK:
Установите для параметра «Использовать» значение «Белый».
Фотошоп заполняет выделенные квадраты белым. Чтобы удалить контур выделения вокруг квадратов, перейдите в меню « Выбор» и выберите « Отменить выделение» или просто нажмите клавиши Ctrl + D (Победа) / Command + D (Mac) на клавиатуре:
Вокруг изображения появляется рамка из белых квадратов.
Шаг 22: снова выбери слой сетки
Давайте выберем несколько разных квадратов для раскрашивания. Во-первых, нам нужно активировать слой Grid на панели «Слои», поэтому щелкните по нему, чтобы выбрать его. Помните, что вам всегда нужно выделять слой сетки, прежде чем вы сможете выбрать любые квадраты:
Убедитесь, что вы выбрали слой Grid, прежде чем пытаться выбрать какие-либо квадраты.
Шаг 23: выбери разные квадраты
Когда слой Grid снова активен, нажмите и удерживайте клавишу Shift и щелкните внутри других случайных квадратов с помощью Magic Wand Tool, чтобы выбрать их. Если вы передумали и хотите убрать квадрат из выделения, отпустите клавишу Shift, нажмите и удерживайте клавишу Alt (Победа) / Option (Mac), затем щелкните внутри квадрата, чтобы отменить его выбор. Здесь я выбрал еще несколько квадратов (и покрасил их в желтый цвет, чтобы мы могли видеть, какие из них я выбрал):
Нажмите и удерживайте Shift и щелкните внутри нескольких разных квадратов, чтобы выбрать их.
Шаг 24: выбери фото слой
Выбрав квадраты, нажмите на слой « Фото» (смарт-объект) на панели «Слои», чтобы выбрать его:
Выбор фото слоя.
Шаг 25: Раскрась квадраты с помощью оттенка / корректирующего слоя
Мы раскрасим эти квадраты, используя корректирующий слой Hue / Saturation. Нажмите на значок « Новый корректирующий слой» в нижней части панели «Слои»:
Нажав на значок «Новый корректирующий слой».
Выберите Hue / Saturation из появившегося списка:
Выбор корректирующего слоя Hue / Saturation.
Элементы управления и параметры корректирующего слоя «Цветовой тон / насыщенность» появятся на панели « Свойства» в Photoshop. Сначала выберите опцию Colorize, щелкнув внутри ее флажка. Затем выберите цвет, которым вы хотите раскрасить выделенные квадраты, перетаскивая ползунок Оттенок . Для этих квадратов я собираюсь оставить ползунок Оттенок полностью влево (его положение по умолчанию), что дает мне красный цвет . Конечно, вы можете выбрать любой понравившийся вам цвет. Как только вы выбрали цвет с помощью ползунка Оттенок, вы можете настроить его насыщенность по своему вкусу, перетаскивая ползунок Насыщенность влево или вправо. Для моего красного цвета я собираюсь установить значение насыщенности около 50 . Следите за документом при перетаскивании ползунков для предварительного просмотра результатов:
Выберите опцию Colorize, затем выберите цвет с помощью ползунков Hue и Saturation.
Шаг 26: измени режим смешивания корректирующего слоя на цвет
Если мы посмотрим на панель «Слои», то увидим корректирующий слой, расположенный прямо над слоем «Фото». Убедитесь, что он выбран (выделен синим цветом), затем перейдите к параметру « Режим наложения» в верхней части панели «Слои» и измените его режим наложения с «Обычный» (режим по умолчанию) на « Цветной» . Это позволяет нам изменять только цвета на изображении, а не значения яркости:
Изменение режима наложения корректирующего слоя на Цвет.
Вот мой документ после окрашивания квадратов красным:
Первый из раскрашенных квадратов.
Шаг 27: переименуй корректирующий слой
Поскольку мы будем использовать несколько корректирующих слоев Hue / Saturation, чтобы раскрасить сетку, давайте отследим, какой из них используется для какого цвета, переименовав их. Поскольку я использовал этот первый слой Hue / Saturation для красного цвета, я дважды щелкну его имя на панели «Слои» и изменит его имя с общего «Hue / Saturation 1» на «Red». Нажмите Enter (Win) / Return (Mac) на клавиатуре, чтобы принять изменение имени:
Переименование корректирующего слоя Hue / Saturation в зависимости от цвета.
Шаг 28: выбери и раскрась больше квадратов
Повторите шаги 22-27, чтобы выделить и раскрасить больше квадратов. Сначала выберите слой « Сетка» на панели «Слои», затем нажмите и удерживайте нажатой клавишу « Shift» и щелкните инструмент «Волшебная палочка» внутри нескольких квадратов, чтобы выбрать их. Нажмите на слой « Фото» на панели «Слои», чтобы выбрать его, затем нажмите значок « Новый корректирующий слой» и выберите « Оттенок / Насыщенность» . На панели «Свойства» установите флажок «Цвет», затем выберите цвет с помощью ползунка « Тон» и уровень насыщенности с помощью ползунка « Насыщенность» . Измените режим смешивания нового корректирующего слоя на Color, затем переименуйте корректирующий слой в соответствии с выбранным цветом.
Вы также можете использовать корректирующий слой Hue / Saturation, чтобы полностью обесцветить некоторые квадраты, оставляя их черно-белыми. Чтобы сделать это, выберите несколько квадратов, затем добавьте корректирующий слой Hue / Saturation, как обычно, но вместо того, чтобы выбирать цвет с помощью ползунка Hue, просто перетащите ползунок Saturation полностью влево (до значения -100 ), который удалит все цвета:
Перемещение ползунка «Насыщенность» влево до упора делает выбранные квадраты черно-белыми.
Вот мой результат после выбора и раскраски большего количества квадратов. Всего я использовал шесть корректирующих слоев Hue / Saturation — один для красного (оттенок: 0, насыщенность: 50), желтый (оттенок: 40, насыщенность: 50), зеленый (оттенок: 120, насыщенность: 20), синий ( оттенок: 200, насыщенность: 20) и фиолетовый (оттенок: 300, насыщенность: 20), плюс один для черно-белого (насыщенность: -100):
Эффект после раскрашивания большего количества квадратов.
И здесь мы видим все шесть моих корректирующих слоев Hue / Saturation на панели Layers, каждый из которых назван в соответствии со своим цветом:
Панель «Слои», показывающая корректирующие слои.
Шаг 29: измени цвет линий сетки на белый
Теперь, когда мы раскрасили наши квадраты, давайте изменим внешний вид самих линий сетки, сначала изменив их цвет с черного на белый. Нажмите на слой « Сетка» на панели «Слои», чтобы выбрать его:
Нажав на слой сетки, чтобы выбрать его.
Затем щелкните значок « Блокировать прозрачные пиксели» чуть ниже параметра «Режим наложения» в верхней части панели «Слои»:
Нажав значок блокировки прозрачных пикселей.
При включенной опции «Блокировать прозрачные пиксели» все, что мы делаем со слоем, влияет только на сами линии сетки. Это не повлияет на прозрачные области слоя. Таким образом, если мы заполним слой, скажем, белым (как мы собираемся сделать), только линии сетки будут заполнены белым. Прозрачные области останутся прозрачными.
Подойди к меню Edit и еще раз выбери Fill . Когда появится диалоговое окно «Заливка», для параметра « Использовать» уже должно быть выбрано значение « Белый», поскольку мы установили его в последний раз, поэтому просто нажмите кнопку «ОК», чтобы закрыть диалоговое окно:
Оставьте опцию Use установленной на White и нажмите OK.
Фотошоп заполняет линии сетки белым:
Эффект после изменения цвета линий сетки на белый.
Шаг 30: добавь стиль слоя обводки
Если вы хотите увеличить толщину линий сетки, щелкните значок « Стили слоев» (значок «fx») внизу панели «Слои»:
Нажав на значок Стили слоя.
Выберите Stroke из появившегося списка:
Выбор стиля слоя обводки.
Откроется диалоговое окно « Стиль слоя» в Photoshop с параметрами обводки в средней колонке. Во-первых, давайте изменим цвет обводки на белый. Нажмите на образец цвета справа от слова Color :
Нажав образец цвета в настройках обводки.
Это открывает палитру цветов . Выберите белый цвет в качестве нового цвета для обводки, затем нажмите OK, чтобы закрыть его:
Выбор белого цвета в палитре цветов.
Теперь, когда в качестве цвета обводки используется белый, установите для параметра « Положение» значение « Снаружи», а затем отрегулируйте ширину обводки, перетаскивая ползунок «Размер». Вы, вероятно, не захотите сильно увеличивать размер. Я собираюсь установить мой на 2 px :
Установка положения снаружи и размера до 2 пикселей.
Нажмите OK, когда закончите, чтобы закрыть диалоговое окно Layer Style. Вот мой эффект с белыми и немного более широкими линиями сетки:
Изображение после применения стиля слоя Stroke.
Шаг 31: переместите и измените размер фотографии снова, если это необходимо
На этом этапе, теперь, когда дизайн сетки завершен, вы можете решить, что вам нужно изменить размер и / или изменить положение фотографии. В моем случае, я думаю, что я очень доволен тем, как все выглядит, но если вам нужно переместить или изменить размер фотографии, нажмите на слой « Фото» на панели «Слои», чтобы выбрать его:
Повторный выбор слоя «Фото».
Затем просто используйте те же шаги, которые мы рассмотрели в шаге 16, чтобы изменить размер и / или переместить изображение. Сначала перейдите в меню « Правка» и выберите « Свободное преобразование» (или нажмите Ctrl + T (Win) / Command + T (Mac) на клавиатуре), чтобы открыть окно «Свободное преобразование» и обвести фотографию. Если вы не видите маркеры, потому что ваша фотография выходит за пределы видимой области документа, перейдите в меню « Вид» и выберите «По размеру экрана» (или нажмите клавиши Ctrl + 0 (Win) / Command + 0 (Mac) на клавиатуре). ). Нажмите и удерживайте Shift, одновременно нажимая и перетаскивая любой угловой маркер, чтобы изменить размер фотографии, или нажмите и удерживайте Shift + Alt (Победа) / Shift + Option (Mac), чтобы изменить размер фотографии от ее центра, а не от угла. Чтобы переместить фотографию, просто щелкните и перетащите в любое место внутри поля «Свободное преобразование». Я собираюсь немного перетащить свою фотографию вниз, но оставлю размер таким же, как и раньше:
Повторно отрегулируйте размер и положение фотографии (при необходимости) с помощью Free Transform.
Обратите внимание, что поскольку мы преобразовали фотографию в смарт-объект еще на шаге 15, мы можем безопасно изменить его размер снова без потери качества изображения. Когда вы будете довольны окончательным размером и положением вашего изображения, нажмите Enter (Win) / Return (Mac), чтобы принять его и закрыть команду Free Transform. Затем, чтобы снова увеличить изображение, перейдите в меню « Вид» и выберите 100% (или нажмите Ctrl + 1 (Win) / Command + 1 (Mac) на клавиатуре):
Окончательный размер и положение фотографии.
Шаг 32: обрезать изображение (необязательно)
Этот последний шаг не является обязательным, но если вы хотите обрезать часть белой границы вокруг сетки, выберите инструмент обрезки Photoshop на панели «Инструменты»:
Выбор инструмента Crop.
Выбрав инструмент обрезки, установите для параметра « Соотношение сторон» в левой части панели параметров значение « Исходное соотношение» :
Установите для параметра «Соотношение сторон» значение «Исходное соотношение».
По краям документа вы увидите рамку обрезки с метками обрезки со всех четырех сторон и по углам. Нажмите и удерживайте клавишу Alt (Победа) / Option (Mac) на клавиатуре, нажимая и перетаскивая любую из четырех угловых меток обрезки внутрь, чтобы обрезать часть белой границы:
Нажмите Alt (Win) / Option (Mac) и перетащите метку обрезки угла.
Нажмите Enter (Win) / Return (Mac) на клавиатуре, чтобы обрезать изображение, и все готово! Вот, после обрезания части границы, мой окончательный результат:
Конечный эффект.
Куда пойти дальше …
И там у нас это есть! Вот так можно отобразить фотографию внутри сетки цветов с помощью Photoshop! Подобные учебные пособия см. В наших фотоэффектах Shape Cluster Photo или в наших вертикальных фотоэффектах. Или посетите наш раздел «Фотоэффекты» для получения дополнительных уроков по фотошопу!
Как сделать турнирную таблицу в фотошоп.
Шаг 1
Откройте Фотошоп и нажмите Ctrl+N, чтобы создать новый документ. Введите все данные, показанные ниже, и нажмите ОК.
Активируйте Сетку (Вид – Показать – Сетка (View – Show – Grid)) и Привязать к Сетке (Вид – Привязка – Сетка (View – Snap to – Grid)). В данном случае вам нужна сетка в 5 пикселей. Пройдите в Редактирование – Параметры – Направляющие, сетка и фрагменты (Edit – Preferences – Guides, Grid&Slices) и сфокусируйтесь на разделе Сетка. Введите значение 5 в раздел Направляющие Каждые (Gridline Every) и значение 1 в раздел Внутреннее деление (Subdivision). Также установите цвет сетки на #a7a7a7.
После того как установите все указанные параметры, нажмите ОК. Не пугайтесь всей этой картины. Данная сетка облегчит вам работу позже.
Также вам необходимо открыть Панель информации (Info) (Окно – Инфо (Window – Info)) для отображения размера и положения ваших фигур в режиме реального времени.
Шаг 2
Установите Основной цвет (Foreground color) на #205d7a, возьмите инструмент Скругленный Прямоугольник (Rounded Rectangle Tool), установите радиус в 5 пикселей и нарисуйте векторную фигуру размером 145 на 420 пикселей.
Переместитесь к Панели слоев и щелкните два раза по скругленному треугольнику, чтобы открыть окно Стилей слоя.
Активируйте Тень (Drop Shadow), Внутреннюю тень (Inner shadow), Внешнее свечение (Outer Glow), Внутреннюю тень (Inner Shadow) и Обводку (Stroke), затем введите параметры, указанные на следующем изображении.
В конечном счете, должно поучиться что-то похожее на второе изображение. Вы можете дезактивировать Сетку (Вид – Показать – Сетка или нажмите Ctrl+”) на некоторое время если хотите увидеть ваше изображение в лучшем виде.
Шаг 3
Установите Основной цвет на черный, возьмите инструмент Прямоугольник (Rectangle Tool), создайте фигуру размером 145х70 пикселей и поместите ее, как показано на первом изображении.
Перейдите в панель слоев, откройте Стили слоя для новой фигуры и введите параметры указанные ниже.
Шаг 4
Выделите еще раз векторный рисунок, сделанный на предыдущем шаге, и продублируйте его (Ctrl+J).
Сфокусируйтесь на Панели Слоев, щелкните правой клавишей по этой копии и щелкните Очистить Стиль Слоя (Clear Layer Style).
Выделите эту копию, уменьшите Заливку (Fill) до 0%, затем откройте окно Стилей слоя и введите параметры, указанные ниже.
Шаг 5
Для этого шага нам понадобится сетка в 1 пиксель. Просто пройдите в Редактирование – Параметры – Направляющие, Сетка и Фрагменты и введите 1 в поле Направляющие каждые.
Установите Основной цвет на #ed1c24 и возьмите инструмент Прямоугольник. Создайте фигуру размером 145х1 пиксель, поместите ее как показано ниже на первом изображении, затем продублируйте ее (Ctrl+J).
Выделите эту копию, передвиньте ее на 1 пиксел вниз и замените темно красный цвет на #fed700.
Шаг 6
Выделите красную фигуру, сделанную на предыдущем шаге, уменьшите заливку до 0%, затем откройте Стили слоя и введите параметры указанные ниже.
Шаг 7
Выделите желтую фигуру, сделанную на первом шаге, уменьшите Заливку до 0%, затем откройте Стили слоя и введите параметры указанные ниже.
Шаг 8
Вернитесь к сетке в каждые 5 пикселей. Пройдите в Редактирование – Параметры – Направляющие, Сетка и Фрагменты и введите значение 5 в поле Направляющие каждые.
Выделите два тонких прямоугольника, которые мы отредактировали в предыдущих двух шагах и сгруппируйте их (Ctrl+G).
Перейдите в Панель слоев, щелкните по новой группе, затем Продублируйте группу.
Выделите эту копию группу и перетащите ее ниже, как показано на изображении ниже.
Шаг 9
Сделайте еще пять копий ранее созданной группы, и поместите их, как показано ниже.
Шаг 10
Установите основной цвет на #a1d8ff, возьмите инструмент Скругленный Прямоугольник, установите радиус в 3 пикселя, создайте фигуру размером 95х25 пикселей и поместите ее, как показано ниже на первом изображении.
Перейдите в Панель слоев, откройте окно Стилей слоя для нового скругленного прямоугольника и введите параметры показанные ниже.
Шаг 11
Дезактивируйте Сетку (Вид – Показать – Сетка).
Откройте панель Символов (Окно – Символ (Window – Character)), возьмите инструмент Горизонтальный текст (Type tool), установите цвет на #ddf1ff и добавьте слово ‘BASIC’, как показано ниже.
Возьмите шрифт Sakkal Majalla со стилем Жирный и размером в 25тч. Перейдите в Панель слоев, откройте окно Стилей слоя для этого маленького текста и введите параметры указанные ниже.
Шаг 12
Возьмите инструмент Текст (T), установите цвет на #205d7a и добавьте цену, как показано ниже.
Возьмите шрифт Calibry с установленным стилем Жирный (Bold) и размером 35тч.
Шаг 13
Возьмите инструмент Текст (T), установите цвет на #ddf1ff и добавьте другой текст, как показано на первом изображении ниже.
Возьмите шрифт Corbel с установленным стилем Обычный (Regular) и размером 11тч.
Перейдите в Панель слоев, откройте окно Стилей слоя для этого текста и введите параметры указанные ниже.
Шаг 14
Возьмите инструмент Текст (T), установите цвет на #205d7a и добавьте текст ‘ORDER NOW’, как показано на первом изображении ниже.
Возьмите шрифт Corbel с установленным стилем Жирный (Bold) и размером 12тч.
Перейдите в Панель слоев, откройте окно Стилей слоя для этого текста и введите параметры указанные ниже.
Шаг 15
Выделите фигуру и созданный недавно текст и сгруппируйте их в одну группу (Ctrl+G).
Сделайте две копии этой группы и переместите их вправо, как показано ниже.
Сфокусируйтесь на этих новых группах и просто отредактируйте текст, как показано ниже.
Шаг 16
Нажмите Ctrl+N, чтобы создать новый документ. Введите 10 в поле ширины и высоты, затем нажмите ОК.
Переместитесь в панель слоев и удалите Основной (фоновый) слой.
Включите Сетку (Вид – Показать – Сетка) и установите основной цвет на черный.
Возьмите инструмент Прямоугольник и установите Основной цвет на Черный.
Создайте два квадрата размером 5 пикселей и поместите их, как показано ниже.
Далее, вам необходимо превратить этот маленький документ в узор.
Просто пройдите в Редактирование – Определить Узор (Edit – Define Pattern), задайте название узору и нажмите ОК.
Закройте этот документ (Вам не нужно его сохранять) и вернитесь к нашему первому документу.
Шаг 17
Возьмите инструмент Прямоугольник и задайте основной цвет как #282828. Создайте фигуру размером 600×600 пикселей, отправьте ее назад (Shift + Ctrl + [), затем откройте окно Стилей слоя и введите параметры указанные ниже.
Возьмите Образец, сделанный на предыдущем шаге.
Финальное изображение
Вот как должно выглядеть ваше финальное изображение.
1 голос
Доброго времени суток, уважаемые читатели. Сегодня вы на конкретном примере сможете увидеть чем отличается процесс работы новичков от тех, кто потратил достаточно времени на изучение.
Вы также сможете убедиться насколько важны углубленные знания фотошопа. Они сделают вашу работу не только красивее, но и в разы проще. Я думаю этого будет достаточно, чтобы вас заинтересовать.
Не терпится приступить к рассказу о том, как в фотошопе сделать таблицу. Использовать ее можно как в качестве части , так и стильного самостоятельного элемента. Приступим?
Как сделают простую табличку начинающие
Открываем картинку в Photoshop. У меня стоит CС, но насколько я знаю визуально он почти не отличается от CS6. Моя версия считается , профессиональной и крутой, но, откровенно говоря, о большинстве этих профессиональных функций я даже и не знаю. Вернемся к таблицам. Эту программу можно осваивать бесконечно.
Теперь нажмите одновременно на Ctrl и R, чтобы в основном окне у вас появилась линейка. Еще раз щелкните на сочетание этих клавиш, она скроется. Однако совсем скоро линейка будет крайне нужна и полезна.
Первым делом я нарисую форму, в которой будет располагаться моя таблица для каких-то значений. Этого делать не обязательно, но думаю, что при использовании конкретного примера результат будет выглядеть значительно лучше. Если оставить фото таким, какой он есть, то саму таблицу будет плохо видно.
Итак, на несколько секунд я удерживаю левую клавишу мыши на нужной кнопке, под которой прячется прямоугольник со скругленными углами, и выбираю его.
Рисую фигуру.
И уменьшаю непрозрачность, чтобы фон картинки все же остался виден.
Перемещаю изображение в центр. Обращайте внимание на красные линии сечения. Они появляются сами собой и подсказывают как выставить объект ровно.
В фотошопе можно использовать и свои дополнительные линии, их-то нам и нужно будет создать. Называются они направляющими, и исчезают, когда это нужно автору проекта, и появляются.
Что необходимо сделать? Вы кликаете левой кнопкой мыши на линейке и удерживая клавишу ведете вниз, то того значения на линейке, которое необходимо.
Чтобы будущая таблица была ровной, по размеру, используйте при рисовании кнопку Shift. В этом случае направляющие не съедут на доли пикселей, а будут «прилипать» к круглым числам.
Закончили.
Теперь выбираем инструмент «Линия».
Я создаю новый слой, чтобы нарисовать таблицу.
У инструмента «Линия» много настроек. Обычно я использую заливку и толщину, без обводки и остальных. Так проще.
Теперь нужно вести по направляющим, удерживая кнопку Shift. Во-первых, прямые будут ровными, а, во-вторых, для каждой палочки не будет создаваться отдельный слой.
Кстати, Shift можно удерживать только когда рисуете. Нажали и начали водить левой кнопкой мыши. Отпустили. Снова зажали. Подключили мышь.
Чтобы убрать направляющие, нажмите Ctrl+H. Это же сочетание клавиш включает их обратно.
Табличка будет красивее, если добавить тень.
Выставляйте свои значения, экспериментируйте, ищите дополнительные и разные функции. Если справа поставить галочку на «Просмотр», то можно следить за изменениями прежде, чем вы сохраните их.
Осталось немного. Если хотите таблицу с текстом – выбирайте соответствующий инструмент.
Сверху выставляйте шрифт и размер.
И готово.
Можете скачать мой PSD-макет, открыть его в фотошопе и либо использовать, либо менять под себя, либо просто осмотреть (СКАЧАТЬ
).
А сейчас я покажу вам вариант поинтереснее! Не все знают о дополнительных настройках, а между тем они есть!
Как сделают люди со знаниями
При создании этой статьи я наткнулся на несколько публикаций и почти везде были почти такие же мануалы, как я представил вам выше. Так работают новички или просто ленивые копирайтеры, которым впадлу задуматься или хотя бы посмотреть что-то дополнительно.
Я хочу показать вам более удобную альтернативу. Смотрите. Открываем фотку и в разделе «Просмотр» выбираем «Новый макет направляющей».
Тут можно вписать количество столбцов.
Добавить строки.
А также выставить отступы от краев рисунка.
Первое время придется поковыряться, чтобы понять что тут и как. Советую это сделать. Полезный навык, существенно ускоряет работу и делает таблицу ровной буквально за пару минут. При учете, что вы обладаете навыками.
Не отчаивайтесь, если времени уже потрачено уйма, а ничего не выходит. Можно взять инструмент «Перемещение» и подвинуть линию вручную.
Просто тащите и не забывайте про Shift.
Теперь можно взять прямоугольник со скругленными углами.
Нарисовать две колонки.
Убавить непрозрачность. Естественно, это не обязательно, но я обожаю этот эффект.
Кликнув на первый прямоугольник и тем самым активировав его, создайте новый слой. Он должен располагаться именно над этим слоем. Как на рисунке.
Теперь выбираем прямоугольное выделение и рисуем шапку. Не обращайте внимания на ровность границы. Все поправится в процессе.
Берем заливку и кликаем внутри выделенной области. Следите, чтобы активным был именно новый слой.
Теперь зажимаете Alt и наводите курсор между двумя слоями одной фигуры (левым столбцом и новым, шапкой с заливкой). Курсор должен преобразоваться в прямоугольник со стрелкой вниз. Как только это случится нажимаете на левую кнопку мыши. В результате должен получиться вот такой эффект.
То же самое проделайте со вторым столбцом.
Активируете, создаете новый слой.
Выделение. Заливка.
Создаете обтравочную маску. Да, только сейчас вы научились это делать.
Готово. Убираем направляющие.
Таблица готова и в ней текст с рисунками.
Можете скачать этот PSD-макет
.
Как вы видите, знания фотошопа очень важны. Именно поэтому я настоятельно, из раза в раз советую вам изучать инструменты. Это скучно, а потому сделайте этот процесс максимально быстрым и комфортным. Подробную статью о том, как это сделать, вы можете найти в моем блоге. Создана она совсем недавно.
Знаете, что отличает успешного человека от всех остальных? Он сумел получить те знания, которые остальным кажутся невыносимо скучными. Если вы хотите стать профессионалом, обратите внимание на курс Зинаиды Лукьяновой «Фотошоп с нуля 3.0»
и узнайте все, что только можно об инструментах.
Это базовые знания, основы, без которых дальнейший путь в целом, и уж тем более заработок, невозможен.
Если вас интересует фотошоп и вы задумываетесь , то советую вам бесплатный курс, который поможет «въехать» в профессию. Понять что от вас потребуется и каким образом этого достичь «ПРОФЕССИЯ ВЕБ-ДИЗАЙНЕР ЗА 10 ДНЕЙ»
.
Значительно прибыльнее уметь придумать задачу и самостоятельно догадаться каким образом ее можно решить. В противном случае вы будете бесконечно работать за копейки, если не бесплатно, и повторять за другими. Одни и те же приемы. Одни и те же методы.
Развивайте собственную фантазию и зарабатывайте больше.
Создание таблиц в различных программах, специально предназначенных для этого, дело достаточно простое, но, по каким-то причинам нам понадобилось нарисовать таблицу именно в программе Фотошоп.
Если такая необходимость возникла, то изучите этот урок и больше не будете иметь трудностей в создании таблиц в Фотошопе.
Вариантов создания таблицы немного, всего два. Первый – сделать все «на глаз», потратив при этом кучу времени и нервов (проверено на себе). Второй – немного автоматизировать процесс, тем самым сэкономив и то и другое.
Естественно, мы, как профессионалы пойдем по второму пути.
Для построения таблицы нам понадобятся направляющие, которые будут определять размеры самой таблицы и ее элементов.
Для точной установки направляющей линии необходимо пройти в меню «Просмотр»
, найти там пункт «Новая направляющая»
, задать значение отступа и ориентацию…
И так для каждой линии. Это долго, так как направляющих нам может понадобиться очень, очень много.
Хорошо, не буду больше тянуть время. Нам нужно на данное действие назначить сочетание горячих клавиш.
Для этого идем в меню «Редактирование»
и ищем внизу пункт «Клавиатурные сокращения»
.
В открывшемся окне в выпадающем списке выбираем «Меню программы», ищем пункт «Новая направляющая» в меню «Просмотр»
, кликаем по полю рядом с ним и зажимаем нужную комбинацию так, как если бы мы ее уже применили. То есть зажимаем, к примеру, CTRL
, а затем «/
». Именно такую комбинацию я и выбрал.
По завершению нажимаем «Принять»
и ОК
.
Затем нажимаем CTRL+/
, и в открывшемся окне прописываем значение для первой направляющей. Я хочу задать отступ в 10
пикселей от края документа.
Для удобства расчетов перетащите начало координат из угла, указанного на скрине, на пересечение первых направляющих, определяющих отступ:
Если у вас до сих пор не включены линейки, то активируйте их сочетанием клавиш CTRL+R
.
У меня получилась вот такая сетка:
Теперь нам необходимо создать новый слой, на котором и будет находиться наша таблица. Для этого нажимаем на значок в нижней части палитры слоев:
Рисовать (ну, ладно, чертить) таблицу мы будем инструментом «Линия»
, он имеет наиболее гибкие настройки.
Настраиваем толщину линии.
Выбираем цвет заливки и штриха (штрих выключаем).
И теперь, на только что созданном слое рисуем таблицу.
Делается это так:
Зажимаем клавишу SHIFT
(если не зажать, то каждая линия будет создаваться на новом слое), ставим курсор в нужное место (сами выберите, откуда начать) и проводим линию.
Совет: для удобства работы включите привязку к направляющим. В этом случае не придется дрожащей рукой искать конец линии.
Таким же образом рисуем остальные линии. По завершению работы направляющие можно отключить сочетанием клавиш CTRL+H
, а если они понадобятся, то снова включить этой же комбинацией.
Наша таблица:
Данный способ создания таблиц в Фотошопе поможет вам значительно сэкономить время.
Всем привет! Сегодня мне хотелось бы рассказать вам, как в фотошопе сделать таблицу по размерам с текстом или картинками для своих нужд. Конечно, многие скажут, что смысла составлять таблицы в фоторедакторах нет, так как это можно проделать с помощью html кода или офисных программ типа Word или Excel. И конечно, все это здорово, но в фотошопе можно создать такое, что нельзя будет воплотить в жизнь нигде, и таким образом вы получите потрясающий элемент дизайна.
Вкратце рассмотрим, для чего это вообще нужно. Представьте, что вы делаете макет страницы или дизайн какого-либо баннера, где необходим данный элемент. Не дадите же вы верстальщику пустой макет с надписью «Здесь должна быть таблица», да и обычная сетка из черных линий врядли будет круто смотреться на хорошем макете. А в графическом редакторе мы сможем воплотить в жизнь все наши дизайнерские извращения.
Кстати, если вы хотите научиться делать офигенные дизайны для сайтов, социальных сетей или улетные баннеры, то рекомендую вам пройти обучение в этой классной онлайн школе веб-дизайна
. Здесь есть много классных направлений. Поэтому вы сможете выбрать для себя то, что вам нравится. Подойдет любому, даже абсолютному новичку в фотошопе. Вам всё разжуют так, что вопросов просто не останется. А после этого вы сможете уже делать дизайны сами, предлагая свои услуги на биржах фриланса, таких как Кворк
.
Мы сможем вставлять красивые картинки, делать эффекты, искривлять рамки, как сами пожелаем, и многое другое. Благодаря фотошопу, с помощью таблиц мы сможем сделать даже полноценные красочные настольные игры. Главное только придумать концепцию и сценарий, а остальное уже дело техники.
Да и при составлении оригинальных кроссвордов или календарей, такое умение может пригодиться. Например, в этой статье я рассматривал, Но там я использовал готовую сетку в формате PNG. А что, если такой сетки нет или она вам не подходит? В общем, сделаем всё сами, без посторонней помощи.
Как сделать простую таблицу по линиям
Любой уважающий себя дизайнер вначале продумывает всю концепцию проекта и делает макет на бумаге. Даже в таком мелком деле как составление табличной сетки нужна подготовка. Поэтому берем лист бумаги и начинаем чертить строки и столбцы, заполните ее данными, либо сделайте ее в ворде. Важно, чтобы у вас уже была готовая идея и к этому моменту не пришлось больше возвращаться.
Направляющие
Без в дизайне просто никуда. По ним мы сможем ориентироваться, и благодаря им мы не промахнемся, когда нам потребуется чертить или делать другие функции с высокой точностью.
Подготовка закончена. Следующим шагом будет непосредственно обрисовка, так как сами направляющие не являются линиями.
Расчерчивание
Теперь, чтобы в фотошопе сделать таблицу по заданным размерам, нам нужно обрисовать направляющие в нужной зоне. Поэтому, идем в панель инструментов и выбираем «Фигуры»
— «Инструмент Линия»
.
Теперь, начинайте чертить линии из углов предполагаемой таблицы. Для этого зажмите левую кнопку мыши в одном из углов, и тяните его в другой угол, который должен быть концом нашей таблицы. Лишь после этого отпустите кнопку мыши, чтобы линия нарисовалась. Благодаря направляющим, линия получится ровной и примагнитится прямо к углам.
Теперь остается проделать то же самое с внутренними линиями. Главное — делать всё четко по направляющим. После этого у вас должно получиться что-то в этом роде.
Теперь, вы можете либо убрать направляющие вручную с помощью инструмента «Перемещение», либо просто временно скрыть их, войдя в меню «Просмотр»
— «Показать»
— «Направляющие»
. После этого они скроются с глаз долой и не будут мешать отображению таблицы.
Не смотрите на мой фон, я его сделал от балды. Вы сможете сделать то же самое на другом фоне или картинке.
Следующим шагом я рекомендовал бы вам объединить все линии в один слой или хотя бы группу, чтобы при малейшем изменении мы могли бы затронуть всю таблицу, а не каждую черточку. Сами представляете, как это муторно и дико Для этого нажмите на первый слой с линией, зажмите клавишу SHIFT
и кликните на последний слой с линиями. После того, как все слои выделятся, нажмите на них правую кнопку мыши и выберите пункт «Объединить фигуры»
.
Теперь останется только заполнить данную таблицу текстом. Здесь уже никаких премудростей быть не должно. Просто берете инструмент «Текст»
и начинайте заполнять каждую ячейку. Главное, делайте так, чтобы надписи были ровными, относительно друг друга и по размеру ячеек. В этом вам помогут быстрые направляющие, которые подскажут вам все во время передвижения объекта. Вот, что получилось у меня на скорую руку.
Улучшение таблицы
Чтобы сделать таблицу в фотошопе более необычной, можно добавить к ней дополнительные эффекты и плюшки.
Добавление эффектов с помощью стилей слоя
В плане изменения внешнего вида очень пригодится использование . Для того, чтобы ими воспользоваться нажмите дважды на слое с нашими линиями, которые мы успели объелинить.
Здесь вы также можете пробежаться по настройкам каждого пункта и выбрать то, что понравится вам. Например, для своей таблицы, я предпочел выбрать «Обводку»
и «Тень»
, после чего подстроил их по своему вкусу. Получилось примерно так.
Изменение рамки с помощью инструмента «Кисть»
Но не только одними линиями вы можете создать таблицу в фотошопе. С этом делом вполне справится обычный инструмент «Кисть». Причем, вам не придется потом объединять слои, чтобы соединить их в один. Более того, вы можете выбрать кисточку, которая сделает вашу рамку действительно необычной. Но для начала либо скройте слой с уже готовой табличной рамкой, либо удалите его, чтобы он нам не мешал, а вот данные можно оставить. После этого верните направляющие, которые мы скрыли до этого. Сейчас они нам снова понадобятся.
Вставка картинок в таблицу
Ну и конечно, я не мог не упомянуть данный пункт. Но тут ничего сложного нет. Вы, как и в обычном случае, вставляете фотографию на холст, после чего подгоняете размеры картинки с помощью (CTRL+T
), потянув за уголки с зажатой клавишей SHIFT
, чтобы сохранить пропорции.
Я надеюсь, что вы поняли всю суть составления таблиц в фотошопе по заданным размерам. И теперь у вас не возникнет в этом плане никаких проблем.
Ну а если вы хотите прекрасно разбираться в фотошопе и без посторонней помощи работать в этом графическом редакторе, то рекомендую вам посмотреть эти классные видеоуроки
. Все уроки подойдут для любого уровня пользователя, так как рассказано всё понятным человеческим языком. Через нескольких недель вы будете плавать в фотошопе как рыба в воде.
Ну а на этом у меня всё. Надеюсь, что статья вам понравилась. Обязательно подписывайтесь на мой блог и паблики в социальных сетях. Жду вас снова. Удачи вам. Пока-пока!
С уважением, Дмитрий Костин.
Как сделать календарь в Фотошопе
Каждый год нам приходится обновлять календарь, который висит на стене в комнате (офисе, кабинете). Можно, конечно, приобрести готовый, но, поскольку мы с вами профессионалы, создадим свой эксклюзивный календарь в Фотошопе.
Создание календаря в Photoshop
Сегодня мы сделаем свой календарь двумя способами. В первом случае создадим с нуля универсальную заготовку для месяцев, а во втором воспользуемся готовой календарной сеткой.
Способ 1: Разработка с нуля
В этом части мы самостоятельно создадим календарную сетку, применив одну хитрость, а точнее, особенность текстовых блоков Фотошопа. Для начала разработаем универсальную заготовку, а затем соберем из таких элементов композицию.
Создание заготовки
- Создаем новый документ.
Размеры не важны, главное, чтобы было удобно работать. Пусть это будет 600х600 пикселей. Разрешение 300 dpi.
- Теперь нам понадобится вспомогательный инструмент. Это будет обычный блокнот Windows. В нем необходимо в одну строку написать числа от 1 до 31, разделенные табом (клавиша TAB). Для того чтобы не было переносов строк, идем в меню «Формат» и снимаем флажок, указанный на скриншоте.
Пишем числа: 1, TAB, 2, TAB и так далее. Перед 1 и после 31 таб не нужен.
- Далее нам нужно, чтобы одинарные числа были выровнены относительно двойных. Для этого ставим дополнительный пробел перед цифрами 1-9. Обратите внимание, не перед табом, а перед цифрой (после таба).
- Копируем строку. Лучше это сделать сочетаниями клавиш CTRL+A и CTRL+C, чтобы ничего не потерять.
- Возвращаемся в Фотошоп и выбираем инструмент «Горизонтальный текст».
На верхней панели выбираем шрифт и настраиваем его размер. Поскольку разрешение у нас 300dpi, кегль придется выбрать поменьше, например, 6 пикселей. Выравнивание по левому краю. Эти настройки только для заготовки. Впоследствии мы можем их поменять. Основными критериями являются удобство работы и одна особенность программы (см. ниже).
Читайте также: Редактируем текст в Фотошопе
- Зажимаем левую кнопку мыши и растягиваем текстовый блок на холсте. Здесь есть один нюанс. Фотошопу «не нравится», если сразу весь текст не поместился в блок. В таких случаях программа может нарушить настроенное нами расположение символов. Поэтому блок делаем побольше, а размер шрифта поменьше.
- Вставляем скопированную строку сочетанием клавиш CTRL+V.
- Беремся за правый маркер и тянем его влево до тех пор, пока в первой строчке не останется 7 чисел (количество дней в неделе).
- Нажимаем на значок с галкой на верхней панели. При этом с текстового блока должна пропасть рамка. Будьте внимательнее: если этого не сделать, дальнейшие действия не принесут результата.
- Теперь нужно настроить интервал между строками. Для этого идем в меню «Окно» и выбираем пункт «Символ».
Для начала отжимаем все кнопки в разделе, указанном на скриншоте.
Затем задаем значения 100 процентов для высоты и ширины символов (просто пишем в каждом поле «100» без кавычек).
Далее задаем межстрочный интервал. Можно выбрать из представленных в списке вариантов или прописать вручную. Пусть будет 12 пикселей.
Результат:
Как видим, цифры слишком большие, поэтому уменьшаем размер до 4 пикселей.
- Закрываем окно «Символ», оно нам пока не нужно.
- Теперь создадим в блокноте строку с днями недели таким же способом, что и ряд с числами, только без дополнительных пробелов.
- Далее все аналогично: создаем текстовый блок и вставляем в него строку. Ничего настраивать не нужно, разве что ширину и высоту самого блока, потянув за маркеры. Не забываем после всех действий нажать на галку на верхней панели (см. п. 9).
- Берем инструмент «Перемещение».
Помещаем блок с днями недели над числами.
- Идем в палитру и выделяем оба текстовых слоя (кликаем по первому, зажимаем CTRL и кликаем по второму).
- Инструментом «Перемещение» двигаем блоки ближе к центру холста.
- Помещаем слои в группу, нажав сочетание клавиш CTRL+G.
- Нам предстоит перекрасить выходные дни в красный цвет. Дополнительные праздничные дни мы отметим в самом конце, чтобы не производить лишних манипуляций при редактировании. Вот тут и начинается все самое интересное. Раскрываем группу и выбираем слой с числами.
- Берем инструмент «Горизонтальный текст» (см. выше) и кликаем внутри блока, активируя его (должна появиться рамка).
Переводим курсор в самое начало строки, перед первым пробелом (перед цифрой 1).
Нажимаем несколько раз клавишу TAB, пока цифра 1 не переместится под воскресенье. Так мы определим максимальную высоту блока.
- Потянув за нижний маркер, подгоняем высоту.
- Переходим в палитру, закрываем группу и нажимаем на значок корректирующих слоев в нижней части.
Выбираем пункт «Цвет».
В открывшемся окне настроек выбираем красный цвет и жмем ОК.
- Зажимаем клавишу ALT и кликаем по границе между группой и корректирующим слоем. Это действие привяжет его к содержимому группы. Слева от слоя должна появиться угловая стрелка.
На холсте все символы окрасятся в красный цвет.
- Берем инструмент «Прямоугольная область».
Создаем выделение. Обратите внимание, что его нижняя граница должна немного заходить за последнюю строку.
- Кликаем по маске корректирующего слоя «Цвет».
- Нажимаем клавишу D, сбрасывая цвета, а затем клавишу X, делая черный основным цветом, а белый фоновым.
- Инвертируем выделение комбинацией CTRL+SHIFT+I (ай). Область должна принять вид, как на скриншоте (на границе холста появятся «марширующие муравьи»).
- Далее нажимаем сочетание клавиш ALT+DELETE, заливая выделение основным (черным) цветом. Теперь красными остались только нужные нам символы.
- Снимаем выделение клавишами CTRL+D и продолжаем. Берем инструмент «Рамка».
Перетягивая маркеры на углах и сторонах «Рамки», обрезаем картинку.
Нажимаем ENTER. Результат:
Читайте также: Как обрезать фото в Фотошопе
- Еще один важный шаг. Выбираем слой с красной заливкой, нажимаем по нему ПКМ и выбираем пункт «Растрировать слой».
Выбираем маску, снова жмем ПКМ и применяем ее.
Заготовка создана, теперь разберемся, как с ней работать. Выше мы уже перемещали числа с помощью клавиши TAB (пункты 18 и 19). В другую сторону они двигаются с помощью BACKSPACE. Только помните, что курсор нужно устанавливать перед пробелом, который стоит перед цифрой 1.
Таким образом мы можем настраивать любые месяцы, независимо от того, с какого дня недели они начинаются. Теперь нужно избавиться от фона и сохранить заготовку.
- Дважды кликаем по слою «Фон» и в открывшемся окне жмем ОК.
Нажимаем DELETE, удаляя его.
- Выделяем группу и корректирующий слой с клавишей CTRL.
Объединяем их комбинацией CTRL+G.
- Нажимаем комбинацию CTRL+SHIFT+S, даем имя файлу, выбираем формат PSD и место для сохранения. Жмем «Сохранить».
Создание композиции
Далее следует этап создания непосредственно самого календаря. Для него нужно найти фон. В нашем случае это будет картинка с символом года (2019). Вы можете выбрать любую другую.
Необходимо определиться с тем, как будет использоваться календарь. Мы рассмотрим вариант для распечатывания на принтере.
- Создаем новый документ. В настройках выбираем «Международный формат бумаги». Размер определяем тот, который в состоянии переварить принтер. Путь будет A4. Разрешение 300dpi. Если планируется публикация в сети, достаточно будет 72dpi, а размер можно ввести вручную (не выбирая набор и A4).
- Если требуется альбомная ориентация, идем в меню «Изображение – Вращение изображения» и поворачиваем холст на 90 градусов в любую сторону.
Мы оставим все, как есть.
- Перетягиваем картинку с фоном в рабочую область программы, масштабируем ее с помощью маркеров с зажатой клавишей SHIFT до нужного размера и размещаем в верхней части холста. Внизу должно остаться достаточно места для календаря. После того, как все манипуляции будут произведены, нажимаем ENTER.
Подробнее: Как вставить изображение в Фотошопе
- Теперь открываем нашу заготовку. Просто находим ее там, куда сохранили, и дважды кликаем. Затем открепляем вкладку с заготовкой: берем ее левой кнопкой мыши и тянем вниз.
- Идем в палитру слоев, берем левой кнопкой группу и перетягиваем ее на холст с календарем. После этого документ с заготовкой можно закрыть.
- Выбираем инструмент «Перемещение» и помещаем заготовку на белый фон.
- Нажимаем сочетание клавиш CTRL+T и увеличиваем сетку. Не забываем нажать SHIFT для сохранения пропорций. По завершении жмем ENTER.
Подробнее: Функция «Свободное трансформирование» в Фотошопе
- Приближаем холст сочетанием клавиш CTRL+(плюс) до комфортного размера. Передвигать его по рабочей области можно, зажав SPACE (пробел).
- Раскрываем группу, а затем и вторую, находящуюся внутри. Выбираем слой с числами.
- Берем инструмент «Горизонтальный текст», кликаем внутри блока на холсте и перемещаем строку, как было описано выше. Январь 2019 начался во вторник. Не забудьте нажать на галку на верхней панели, чтобы завершить редактирование.
- Тем же инструментом кликаем в любой свободное место (только не по блоку с числами и днями недели). Пишем «Январь». Также жмем галку.
- Открываем окно «Символ» (см. выше) и настраиваем размер шрифта.
- С помощью инструмента «Перемещение» размещаем текст над сеткой.
- Выбираем верхнюю группу и переименовываем ее в «Январь» (кликаем дважды по названию и пишем).
- Перемещаем группу по холсту в нужное место (инструмент «Перемещение» активен).
- Закрываем группу и нажимаем сочетание клавиш CTRL+J, создав копию.
- Зажимаем SHIFT и перетягиваем содержимое копии вправо.
- Переименовываем в «Февраль». Раскрываем все группы, выбираем слой с названием месяца, берем «Горизонтальный текст», ставим курсор на слово и переписываем. Также можно удалить этот слой, после чего создать новый и написать название.
- Переходим на слой с числами, перемещаем строку на пятницу и удаляем лишние цифры.
- Таким же способом создаем еще четыре группы с месяцами.
- Как видим, размеры были подобраны неверно. Исправим это. Выделяем все группы в палитре (кликаем по первой, зажимаем SHIFT и кликаем по последней).
Нажимаем CTRL+T и масштабируем все содержимое. Зажатая клавиша SHIFT поможет сохранить пропорции.
- Оставив выделенными все группы в палитре, берем инструмент «Перемещение» и нажимаем кнопку, указанную на скриншоте. Данная функция называется «Распределение центров по горизонтали» и позволяет сделать равными интервалы между месяцами (группами).
- Теперь копируем эти шесть групп сочетанием клавиш CTRL+J (они все еще выделены).
- Перетягиваем вниз и редактируем.
- Выделяем в палитре все, кроме картинки и слоя «Фон».
Перемещаем сетку немного ниже (инструментом «Перемещение»).
- Увеличиваем картинку, выбрав ее в палитре и нажав CTRL+T. Также можно дописать и год в верхней части календаря. Вот что у нас в результате получилось:
Дополнительные выходные
Как и обещали, раскрасим дополнительный выходные (праздничные дни). Делается это просто:
- Раскрываем группу с нужным месяцем и переходим на слой с красной заливкой.
- Берем «Кисть».
Форма «Жесткая круглая».
«Непрозрачность» и «Нажим» 100%.
Цвет красный (тот же, что и у заливки).
Размер подбираем квадратными скобками на клавиатуре.
- Оставаясь на слое с заливкой, кликаем кистью по нужным числам.
Читайте также: Как пользоваться кистью в Фотошопе
Далее этот календарь нужно сохранить в формате JPEG или PDF, а затем распечатать на принтере.
Читайте также: В каком формате сохранять фото в Фотошопе
Мы познакомились с приемом, который позволят вручную создать календарь из заготовки. Ею можно пользоваться каждый год, редактируя сетку и придумывая новое оформление.
Способ 2: Готовая сетка
Процесс создания календаря этим способом заключается в простом подборе фона и поиска подходящей календарной сетки. С фоном все просто. Ищем в публичном доступе, или покупаем на фотостоке подходящую картинку. Желательно крупного размера, поскольку календарь мы будем печатать, а он должен быть не 2х3 см. Мы подобрали вот такой:
Календарные сетки в ассортименте представлены в сети. Для их поиска задаем Яндексу (или Гуглу) запрос вида «календарная сетка 2017» (год замените на актуальный). Нас интересуют сетки большого размера в формате PNG или PDF.
Выбор дизайнов сеток очень большой, можете выбрать по своему вкусу. Приступим к созданию календаря.
Читайте также: Создаем заготовку для фото на документы в Фотошопе
- Как уже было сказано выше, календарь мы будем печатать, поэтому создаем новый документ со следующими настройками. Здесь указываем линейные размеры календаря в сантиметрах и разрешение 300dpi.
- Затем перетаскиваем картинку с фоном в рабочую область программы на вновь созданный документ. При необходимости растягиваем ее при помощи «Свободного трансформирования» (CTRL+T).
Читайте также: Функция «Свободное трансформирование» в Фотошопе
- То же проделываем и со скачанной сеткой.
- Осталось только сохранить готовый календарь в формате JPEG или PDF, а затем распечатать на принтере.
Подробнее:
Сохраняем изображения в Фотошопе
В каком формате сохранять фото в Фотошопе
Мы разобрали два способа создания календаря в Фотошопе. Каким из них пользоваться, решайте сами. Если нет времени, то можно воспользоваться чужими разработками, а если требуется иметь под рукой универсальный инструмент, то лучше сделать все самостоятельно.
Мы рады, что смогли помочь Вам в решении проблемы.
Опишите, что у вас не получилось.
Наши специалисты постараются ответить максимально быстро.
Помогла ли вам эта статья?
ДА НЕТ
Как обрезать фото в Фотошопе / Фотообработка в Photoshop / Уроки фотографии
Дата публикации: 04.12.2017
Кадрирование фотографии позволяет немного изменить композицию или выделить какой-то один объект, убрать отвлекающие детали с периферии кадра. Кроме этого, обрезать фотографию в Фотошопе бывает нужно при подготовке к печати, чтобы во время процесса важные части кадра не оказались отрезанными.
В этой статье мы поговорим о том, как в Фотошопе обрезать фотографию.
В Adobe Photoshop есть специальный инструмент, который называется Crop Tool/«Инструмент “Рамка”». И с помощью него мы узнаем, как обрезать фотографию в Фотошопе легко, наглядно и быстро.
Давайте на примере рассмотрим, как в Фотошопе обрезать фото.
Открываем фотографию в программе и выбираем инструмент Crop Tool/«Инструмент “Рамка”» в левой панели инструментов.
Просто кликаем на инструмент и мышкой выделяем нужную область на фотографии. Всё, что будет отрезано, станет более тёмным, а часть, которая останется после кадрирования — светлой. Когда основная рамка кадрирования нарисована, можно изменять её размеры или положение с помощью мыши.
Для того, чтобы изменить размер рамки, просто подведите мышку к её краю и переместите границу, удерживая нажатой левую клавишу мыши. Для пропорционального изменения границ кадрирования можно «перетащить» угол.
Чтобы обрезать фотографию в Фотошоп и применить изменения, надо либо нажать на клавишу Enter, либо на кнопку Ok (обозначена галочкой) в верхней панели инструментов.
Описанный ранее способ позволяет обрезать фотографию в Фотошопе под произвольный размер. А чтобы сделать кадрирование под определённые пропорции, нужно задать необходимые значения в настройках.
С помощью выпадающего списка в меню Ration можно задать различные варианты пропорций будущего кадрирования, чаще всего используемые при решении различных задач.
W x H x Resolution/«Ш х В x Разрешение» — указать ширину и высоту в пикселях при заданном разрешении снимка.
Original Ratio/«Исходные пропорции» — сохранять оригинальные пропорции; в этом случае при изменении одной стороны рамки кадрирования вторая будет изменяться пропорционально.
Пропорции от 1:1 до 16:9 указывают принятые соотношения сторон; рамка кадрирования будет автоматически изменяться, чтобы соответствовать заданным пропорциям.
New Crop Preset/«Новый набор кадрирования» — создать и сохранить свой набор предустановленных настроек для кадрирования.
Ещё один полезный блок настроек позволяет включить или отключить показ сетки кадрирования поверх изображения. Это может помочь, если вы хотите немного изменить композицию снимка и подогнать его под различные правила кадрирования.
На скриншоте снизу приведены различные варианты сеток, которые могут подойти под ту или иную ситуацию.
- Rule of Thirds/«Правило 1/3» — сетка по правилу третей;
- Grid/«Сетка» — обычная сетка;
- Diagonal/«По диагонали» — диагональная сетка;
- Triangle/«Треугольник» — треугольная сетка;
- Golden Ratio/«Золотое сечение» — золотые пропорции;
Golden Spiral/«Золотая спираль».
- Auto Show Overlaу/«Автоматически показывать перекрытие» — показывать сетку автоматически;
- Always Show Overlay/«Всегда показывать перекрытие»;
Never Show Overlay/«Никогда не показывать перекрытие» — не показывать сетку.
- Cycle Overlay/«Цикл перекрытия» — позволяет циклически перебирать все варианты сеток.
На этом примере наглядно видно, как откадрировать фотографию в Фотошопе с использованием правила композиции, основанного на принципе «золотой спирали».
Таким образом, с помощью инструмента Crop Tool/«Инструмент “Рамка”» можно наглядно и легко обрезать фотографию в Фотошопе и убрать всё лишнее.
Как использовать правило третей в фотографии • Оки Доки
Правило третей, наверное, первое правило фотографии, о котором вы слышали. И это будет техника, которую вы используете больше всего. Короче говоря, это способ лучше сфотографировать ваши фотографии и привлечь внимание зрителя к объекту внимания.
Эта техника используется в любой визуальной среде … от рекламных щитов на обочинах дорог до фильмов, которые вы смотрите в кинотеатрах. Итак, в этой статье мы объясним, что такое правило третей и как его использовать. Мы также объясняем, почему это не всегда лучший метод для применения.
Что такое правило третей?
Правило третей имеет одну главную цель для лучшей композиции ваших фотографий: баланс.
Это основной принцип фотографии. Представьте, что ваш кадр разделен на три горизонтальные секции и три вертикальных секции двумя горизонтальными линиями и двумя вертикальными линиями. Для более динамичных фотографий любой интересный элемент в сцене должен быть расположен вдоль одной из этих линий или на одном из их пересечений.
Лучший способ представить это как крестики-нолики на вашей фотографии.
Правило третей работает, потому что наука говорит, что наши глаза естественным образом обращены к объектам, которые немного смещены от центра, а не к центру изображения. Четыре пересекающиеся точки являются наиболее эффективными нецентральными точками визуального интереса.
Интересный момент пустяков: термин был впервые упомянут в книге Джона Томаса Смита «Замечания о сельском пейзаже», опубликованной в 1797 году. Есть и другие важные правила фотографии, которые были заимствованы из математики и психологии.
Как использовать правило третей
Правило третей не является жестким правилом, которому вы всегда должны придерживаться. Размещение основного объекта вашей фотографии вдали от центра не всегда даст вам более приятную фотографию.
Правило третей может быть применено к любому предмету, и оно заставляет вас задуматься о своей композиции, прежде чем щелкнуть затвор. Это может улучшить ваши шутливые снимки. И это также может быть быстрый способ сделать фотографию, когда у вас нет времени, чтобы подумать и скомпоновать сцену.
Используйте сетку в вашей камере
Почти все камеры имеют сетку с правилом третей на своих электронных дисплеях и видоискателях. Возможно, вам придется включить его. Для этого зайдите в настройки вашей камеры и найдите опцию включения линий сетки. Некоторые производители будут включать несколько разных вариантов.
Смартфоны также оснащены опциями наложения сетки, которые вы можете включить или отключить в настройках камеры.
Сетки и накладываемые изображения в Photoshop и Lightroom
Вы всегда можете обрезать свои снимки в любом программном обеспечении для редактирования и улучшить их с правилом третей. В Photoshop и Lightroom есть оверлейные ориентиры, которые включают сетку с правилом третей. Используйте эту сетку, чтобы обрезать изображение, чтобы расположить наиболее интересные элементы вдоль пересекающихся линий.
Вы также можете настроить параметры сетки для создания наложения.
В Photoshop используйте сочетание клавиш Ctrl + K (Mac: Command + K), чтобы открыть ваши настройки. Нажмите «Направляющие, сетка и фрагменты» в списке слева и измените параметры раздела «Сетка» следующим образом:
- Сетка каждые 100 процентов. Подразделения 3.
- Нажмите ОК.
- Нажмите Ctrl + ‘(Command +’), чтобы каждый раз переключать сетку на фотографии.
Вы также получаете сетку с помощью наиболее часто используемого инструмента в Photoshop — инструмента Обрезка. Когда вы щелкаете по нему на панели инструментов (или нажимаете C), он мгновенно помещает сетку с правилом третей на ваше изображение.
В Lightroom откройте свое фото и…
- Перейдите в модуль Develop.
- Нажмите Инструменты> Наложение направляющих кадрирования> Третьи, чтобы отобразить сетку в верхней части фотографии.
Правило третей в действии
Давайте применим руководства к двум распространенным сценариям: пейзажи и портреты.
Пейзажи
Часто сложно сбалансировать пейзажные снимки. Вы не можете ничего двигать, чтобы создать сильный фокус. Правило третей помогает создать визуальную привлекательность. Например, вы можете выровнять горизонт по одной из пересекающихся линий. Как правило, размещение горизонта в нижней строке лучше всего передать ширину неба, а не отрезать небо, поместив горизонт в центр.
Другие элементы на фотографии (например, дерево или дом) можно разместить рядом с одной из четырех пересекающихся точек.
Портреты
Хотя большинство портретов удерживают объект в центре кадра, вы можете создать интерес, разместив объект вдали от центра. Глаза всегда интересны, поэтому вы должны расположить их вдоль пересечений сеток.
Также попробуйте выровнять ось тела человека вдоль одной из вертикальных линий сетки. Используйте направление взгляда, чтобы поместить человека на правую или левую вертикальную линию.
Когда не следует использовать правило третей
Правило третей затрагивает естественное движение наших глаз. Это может быть метод по умолчанию, и вы будете делать это по мере того, как станете лучше в фотографии. Но помните, что сцена должна диктовать композицию, а не наоборот.
Это не жесткие и быстрые правила, но будет много ситуаций, когда вам следует избегать использования правила третей. Вот только три:
1. Когда вы хотите заполнить кадр
Наиболее распространенной альтернативой правилу третей является размещение фокуса фотографии в центре. Например, симметричные фотографии, такие как портреты, потребуют немедленного и прямого внимания к основной теме. В таких ситуациях вы можете смело заполнять кадр своим объектом в мертвой точке.
Некоторые фотографии, например архитектура или одна часть здания с повторяющимся узором, могут иметь несколько точек фокусировки. Вы можете игнорировать правило третей, если некоторые из них лежат на пересекающихся линиях.
2. Для Instagram Достойная Площадь Фотографии
Сосредоточение интересного элемента в мертвой точке фотографии хорошо работает для квадратных фотографий. Элемент тогда равноудален от всех четырех углов, создавая симметрию.
3. На фотографиях с занятым фоном
Вы можете нарушить правило третей, когда фон вашей фотографии занят. Например, поле цветов или толпа на ярмарке. Используйте небольшую глубину резкости и отцентрируйте основной объект внимания.
4. Когда ведущие линии работают лучше
Ведущие линии — это еще одна техника композиции. На этой фотографии дорожка ведет взгляд зрителя к отдаленной точке от центра кадра. Ваш взгляд не будет путешествовать с железнодорожными путями на расстояние, если вы использовали правило третей, чтобы сделать снимок.
Составь фото на свой вкус
Глядя на все из-за решетки, вы можете превратить правило третей в мышечную память. Но всегда старайся пробиться и пробовать разные композиции. Идея позади фотографии побеждает все остальное. Правило третей не сработает, если история на фото слабая.
Трудно объяснить словами, какой выбор вам нужно будет сделать, используя (или не используя) правило третей. Позвольте вашему глазу вести вас. Лучший совет — сделать несколько снимков со всех сторон и принять решение позже. Эти базовые упражнения по фотографии помогут вам развить зрение к сцене.
Как создать абстрактный фон из проволочной сетки с волнами в Illustrator и Photoshop
Preview
Вот предварительный просмотр абстрактного фона, который мы будем создавать в этом уроке.
Шаг 1
Начните с запуска Illustrator и создания нового документа.
- 3000 x 2000 px
- Ориентация: Пейзаж
- Артборды: 1
- Растекание: Нет
- Цветовой режим: RGB
Шаг 2
Выберите Pen Tool и нарисуйте случайную волнистую линию по ширине монтажной области.Я рекомендую придерживаться довольно близко к линии, которую я создал и показанную ниже, чтобы следовать вместе с руководством.
Задайте обводку черной обводкой размером 1 пункт, чтобы ее можно было увидеть.
Шаг 3
Нарисуйте вторую векторную линию под оригиналом. Опять же, я рекомендую имитировать линию, которую я нарисовал здесь, или создать что-то довольно похожее, если вы не хотите отслеживать.
Шаг 4
Выберите инструмент Blend Tool (W) и щелкните верхнюю линию, затем щелкните нижнюю линию, чтобы соединить их.
Между исходными строками должна появиться новая строка. Это означает, что они были успешно смешаны.
Шаг 5
Нажмите клавишу Enter, при этом инструмент Blend Tool все еще активен и обе линии выделены.
В окне Blend Options выберите:
- Особые шаги
- Шаги: 64
Шаг 6
К сожалению, при использовании Blend Tool со сложными формами мы иногда можем столкнуться с визуальными сбоями, подобными показанным на изображении ниже, когда в некоторых разделах слишком много или слишком мало места.
Тщательно проверьте векторную волну и определите все проблемы, прежде чем продолжить.
Если у вас нет проблем, пропустите следующий шаг.
Шаг 7
Чтобы исправить эти сбои, используйте Прямой выбор, чтобы вручную настроить исходные векторные линии (первые 2, с которых мы начали).
Может быть немного сложно скрыть эти раздражающие проблемы, но я обнаружил, что небольшое перемещение положения векторных точек и экспериментирование с их ручками, чтобы попытаться сгладить линии, обычно работают.
Шаг 8
Выберите векторные линии и откройте Окно обводки, чтобы применить следующие настройки:
- Обводка Вес: 2 пт.
- Углы: Круглые
- Пунктирная линия: ВКЛ.
- Штрих: 0
- Промежуток: 6 пт.
Теперь у вас есть пунктирная линия вместо основной сплошной линии. На этом шаге может быть интересно поэкспериментировать с различными настройками.
Шаг 9
Используя инструмент «Прямое выделение», выберите только верхнюю векторную линию и установите толщину обводки на 0.
Благодаря функции наложения в Illustrator векторные линии теперь будут постепенно исчезать, как будто они уходят вдаль.
Шаг 10
Пора переходить, Откройте Photoshop CC .
Создать новый документ:
- 3000 x 2000 пикселей
- Разрешение: 300 PPI
- Цветовой режим: 8-битный RGB
Шаг 11
Выберите векторную волну в Illustrator, скопируйте и вставьте ее в документ Photoshop как смарт-объект .
Шаг 12
Используйте инструменты преобразования или ручки вокруг слоя векторного смарт-объекта, чтобы изменить его размер и подогнать под размер холста.
В идеале концы волны не будут видны и вместо этого будут расширять границы монтажной области.
Шаг 13
Перейдите в Слой > Новый слой заливки> Градиентная заливка и нажмите ОК.
Слой должен быть выше фона, но ниже векторного смарт-объекта на панели «Слои».
Шаг 14
В окне параметров заливки для нового слоя градиентной заливки введите следующие переменные:
- Цвет точки градиента 1: # 13201f
- Цвет точки градиента 2: # 244647
- Положение точки градиента 1: 0
- Положение точки градиента 2: 100
- Стиль: Линейный
- Угол: 45
- Масштаб: 100%
- Обратное выключение, Дизеринг включено, Выравнивание
Шаг
Дублируйте слой градиентной заливки и дважды щелкните миниатюру слоя, чтобы снова войти в окно параметров градиентной заливки.
Используйте те же настройки, что и в прошлый раз, но с двумя изменениями:
- Цвет точки градиента 1: # 37d8dd
- Цвет точки градиента 2: # 58a7f1
Шаг
Переместите вторую градиентную заливку в верхнюю часть стопки слоев.
Щелкните правой кнопкой мыши слой градиентной заливки и выберите Создать обтравочную маску из контекстного меню.
Результат и заключение
Вот окончательный результат, и он выглядит еще лучше при полном разрешении и большем разрешении. Все, что мы сделали для создания этого абстрактного волнового фона, можно безупречно масштабировать в Photoshop.Ничто не мешает вам использовать Изображение> Размер изображения … для увеличения до 7680 x 4329 пикселей (8K).
Спасибо за чтение. Надеюсь, вам понравилось следовать этому руководству и вы узнали что-то новое об использовании инструмента наложения в Illustrator и создании потрясающего фона в Photoshop.
Набор фона полигональной сетки
K92W3UC
Набор фона многоугольной сетки K92W3UC
2005274 Набор фона многоугольной сетки K92W3UC
Photoshop PSD, PNG, JPG | 179 Мб
Абстрактные геометрические фоны многоугольники
Этот абстрактный геометрический фон иллюстрирует хаотические многоугольники сетки, но чем больше вы смотрите на него, тем больше деталей бросается в глаза.Наш набор абстрактных трехмерных геометрических многоугольников — это удивительный дизайн, который выражает сокращение полигонов.
Минималистичная поверхность с многоугольными формами разного размера выглядит необычно и сразу привлекательно. Благодаря гладкой геометрии ваши иллюстрации, принты и другие декоративные работы будут иметь поразительное впечатление, но при этом не будут слишком навязчивыми.
Что вы получите?
Концепция включает 10 различных полигональных визуализаций в прозрачных изображениях JPG и PNG.Все файлы качественные и с высоким разрешением. Его реалистичные текстуры из полиэстера низкой плотности выглядят эффектно и помогают сосредоточиться благодаря отсутствию отвлекающих элементов.
Можете ли вы настроить эти многоугольные фоны?
В ответ на этот вопрос будет уместно сказать, что предлагаемые файлы работают как растровые изображения высокого разрешения. Благодаря изолированным текстурам вы можете использовать эти материалы, размещая их в любом своем проекте. Поэтому делать цветокоррекцию можно только в Photoshop.
Где можно использовать эти геометрические текстуры?
- Визитка с такими фактурами подчеркнет изысканный вкус своего обладателя;
- Миниатюры для видео YouTube с такой иллюстрацией подчеркнут тему вашего видео;
- Абстрактные многоугольные фоны идеально подходят в качестве элементов дизайна в веб-интерфейсе;
- Канцелярские товары: тетради, блокноты, дневники, альбомы для рисования порадуют спокойным оформлением;
- Это прекрасная возможность использовать отдельные формы или фигуры из этого шаблона для брошюры, плаката и рекламы, а также для презентации, заполненной отдельными объектами.
Дополнительная информация:
- Включенные графические файлы: изображение JPG, прозрачный PNG, многослойный PSD (не вектор)
- Размеры пикселей: 5000 × 3333 .
- Разрешение: 300 dpi .
Отделение переднего плана от заднего плана
Отделение переднего плана от фона в Photoshop — идеальное решение для любой неудобной позы, объекта не по центру и отвлекающего фона.
В этом уроке вы узнаете, почему отделение переднего плана от фона — это лучший секрет фотошопа, который вы не используете! Даже если вы не занимаетесь композитингом, а работаете с одной фотографией.
В этом примере мы будем использовать изображение бегуна, пойманного в середине движения, и вы узнаете, как, отделив задний план от переднего, вы сможете легко изменить позу бегуна, придать одежде идеальный вид и переместите объект в другое место на изображении.
Приступим!
Выберите основную тему фотографии
Вы можете следить за этим Adobe Stock. Изображение бегущего человека.
Сначала сделайте выбор вокруг бегуна.
Существует несколько различных способов выделения основного объекта: вы можете использовать инструмент «Перо» , инструмент «Магнитное лассо», инструмент «Волшебная палочка» или инструмент «Быстрое выделение», . Однако эти инструменты потребуют вашего времени и усилий, чтобы выбрать нужные участки.
Если вы используете Photoshop 2020 и новее, вы можете сократить время, просто зайдя в Select> Select Subject .
Использование команды «Выбрать тему» автоматически выделит объект.
Select Subject использует Adobe Sensei, который представляет собой искусственный интеллект Adobe (AI) , который использует технологию машинного обучения для определения основного предмета.
Щелкните здесь, чтобы узнать больше об инструменте «Выбрать тему»!
Несмотря на то, что он в высшей степени надежен, он может допускать небольшие ошибки, которые вы легко можете исправить.Ищите области, которые могли быть упущены ИИ.
В этом примере отмените выбор пространства между рукой и телом.
Чтобы отменить выбор, используйте инструмент Quick Selection и удерживайте Alt (Windows) или Option (macOS) , затем нажмите и перетащите вокруг небольшой области, чтобы снять выделение.
Отделение переднего плана от заднего плана
Следующий шаг — продублировать фон, перетащив его на значок Новый слой .Повторите этот шаг дважды, чтобы сделать две копии.
Примечание : поскольку у нас есть активное выделение, мы не можем использовать сочетание клавиш Ctrl J Command J для дублирования слоя. При активном выделении этот ярлык будет дублировать только содержимое выделения, а не весь слой.
Всегда старайтесь давать своим слоям имена, чтобы знать, что они контролируют. В этом случае вы можете переименовать верхнюю копию в «Бегун».
При активном выделении щелкните на слое «Runner» и в нижней части панели Layers щелкните значок New Layer Mask , чтобы сделать маску из выделения.Этот шаг удалит фон с текущего слоя.
Затем выберите два слоя «Runner» и слой Background Copy , удерживая Shift и щелкнув оба, и нажмите Ctrl G (Windows) или Command G (macOS) , чтобы поместить их в группа.
Вы можете вызвать новую группу « Edit».
Отделение переднего плана от заднего плана
Теперь, когда у нас есть два слоя внутри группы Edit , мы можем сосредоточиться на отделении переднего плана от эффекта фона.
Сделайте выделение из маски слоя «Runner» , удерживая Ctrl (Windows) или Command (macOS) и щелкнув миниатюру маски слоя Runner.
Затем перейдите к Select> Modify> Expand . На этом шаге открывается окно Expand Selection , затем установите расширение на 3px и нажмите OK.
Затем удерживайте Shift Backspace (Windows) или Shift Delete (macOS) , чтобы открыть окно Fill.
В раскрывающемся списке «Содержание» выберите Content-Aware и нажмите OK.
Content-Aware заполнит выделение «содержимым», аналогичным окружающим областям выделения, и будет казаться, что бегуна там никогда не было.
Примечание : с более сложным фоном вы можете попробовать Новое Content-Aware Workspace, чтобы получить лучшие результаты.
Нажмите Ctrl D (Windows) или Command D (macOS) , чтобы отменить выбор и отключить марширующих муравьев .
Хотя заливка работает отлично, она не идеальна. Для областей, требующих дополнительной работы, вы можете использовать инструмент Clone Stamp (S), чтобы применить плавный переход и сохранить согласованность между исходным фоном и тем местом, где работал Content-Aware .
После того, как вы закончите, у вас будет чистый фон без бегуна! Как только вы включите слой Runner, у вас будет исходное изображение, но теперь оно состоит из двух слоев!
Как работать с субъектом самостоятельно
Одним из многих преимуществ отделения переднего плана от фона является то, что вы можете настроить объект, не затрагивая ни одного пикселя от фона, и наоборот.
Чтобы иметь еще больший контроль, вы можете выбрать слой «Runner» , щелкнуть правой кнопкой мыши и выбрать Преобразовать в смарт-объект .
Примечание : Смарт-объект — это контейнер, который может содержать один или несколько слоев. Он позволяет применять редактируемые корректировки, искажения, фильтры и преобразования.
Корректировка, которую вы можете внести в свой объект
Фильтр сжижения
- В строке меню нажмите Правка> Пластика .
- В параметрах View установите флажок рядом с Показать фон . Первоначально он покажет «Все слои» , но щелкните по нему, чтобы открыть раскрывающееся меню, и выберите «Фоновая копия».
Марионеточная основа
- В строке меню нажмите Правка> Марионеточная деформация .
- Чтобы отрегулировать углы ног или рук, удерживайте Alt (Windows) или Option (macOS) и щелкайте по точкам, чтобы повернуть его в желаемое положение или угол.
Инструмент перемещения
- Нажмите V на клавиатуре, чтобы использовать инструмент Move , который позволяет перемещать объект в любое место кадра простым щелчком и перетаскиванием.
Это всего лишь три способа настройки изображения после отделения переднего плана от фона.
Чтобы получить больше уроков по Photoshop, обязательно зайдите на канал PTC YouTube и нажмите кнопку подписки!
Окончательное изображение
Перетащите ползунок, чтобы увидеть до и после
Как создать трехмерную сферу в Adobe Photoshop
Трехмерные изображения можно создавать в Photoshop либо с нуля, используя предварительно настроенные формы Photoshop, либо путем импорта каркасов и визуализированных изображений из 3D-приложений, таких как 3D Studio Max или Maya .3D-моделирование в Photoshop требует интенсивной работы процессора, поэтому, если вы увидели сообщение при запуске Photoshop о недостаточном объеме vRAM, вы не сможете работать в 3D. Имейте в виду, что 3D-моделирование — сложная тема, и о ней написаны тома, поэтому это руководство является просто введением, в котором 3D-объект будет создан с использованием второго изображения над слоем фонового изображения.
Эта функция одинаково работает в версиях Adobe Photoshop CS6 и CC. Photoshop CS5 также имеет возможности 3D, но интерфейс изменился.
- Перейдите в меню Edit> Preferences> Performance и убедитесь, что для параметра Use Graphics Processor установлен флажок. Если эта опция неактивна, ваша система не поддерживает Open GL, поэтому ваши возможности 3D будут ограничены и будут работать очень медленно.
- При создании 3D-объекта изображение из слоя под 3D-слоем будет обернуто вокруг объекта. Чтобы сохранить фоновое изображение нетронутым, я создал векторный прямоугольник по всему изображению с Fill и Stroke , установленным на None.Теперь я создам новый пустой слой над ним.
- Чтобы создать 3D-объект, перейдите в 3D> New Mesh from Layer> Mesh Preset и выберите Sphere .
- Нажмите Да, когда получите сообщение с вопросом, хотите ли вы переключиться в рабочее пространство 3D.
- В окне изображения будет отображаться плоскость поверхности и вторичный вид . Нажмите кнопку Close View в верхнем левом углу панели, чтобы закрыть дополнительный вид .
- На панели 3D на панели Dock нажмите Sphere Material .
- Затем перейдите на панель Properties , щелкните меню Diffuse и выберите Replace Texture . В открывшемся каталоге выберите желаемое изображение.
- Чтобы повернуть изображение вокруг трехмерного каркаса, вернитесь на панель 3D и щелкните Sphere .
- Инструмент 3D Axes появится в окне изображения с тремя «рычагами» для осей X, Y и Z.Наведите указатель мыши на разные секции в каждой руке и внимательно просмотрите подсказки.
- Здесь трехмерный объект был повернут вокруг всех трех осей:
- Чтобы переместить трехмерный объект, перейдите на панель параметров и выберите инструмент «Перетащить трехмерный объект ».
- Наведите указатель мыши на границу «куба», чтобы вы видели только значок «Перемещение» без подсказок и плоскостей на кубе, затем щелкните и перетащите трехмерный объект в желаемое место на изображении.
- Чтобы настроить тень, перейдите на панель 3D и нажмите Infinite Light 1 .
- Инструмент 3D Light Source появится на объекте. Перетащите ручку, чтобы отрегулировать угол освещения объекта и положение тени.
- Чтобы лучше оценить эффект тени, отключите сетку базовой плоскости, выбрав View> Show> 3D Ground Plane .
- Посмотрите на панель Properties , и вы увидите варианты отключения тени или регулировки мягкости.
- Трехмерные объекты можно визуализировать для использования в видео или анимации, что занимает довольно много времени.Их также можно растрировать как трехмерный эффект для использования в плоской графике. Чтобы растрировать, перейдите на панель Layers , щелкните правой кнопкой мыши (PC) / Control — щелкните (Mac) на 3D-слое и выберите Rasterize 3D .
- Слой больше не является трехмерным объектом.
Искажение изображения при активированной функции сетки
1. Поместите указатель раздувания © на область самого высокого оранжевого шарика (между розовым и желтым шариками), нажмите и удерживайте кнопку мыши, пока не увидите искажение меша, затем отпустите кнопку мыши.
2. Повторите шаг 1 в синей области над нижним оранжевым шариком.
3. Щелкните инструмент Forward Warp Tool в
В диалоговом окне «Пластика» измените размер кисти на 25.
4. Перетащите указатель Forward Warp © в нижний край розовой юбки ребенка так, чтобы он образовал шипы, как показано на рисунке 18.
5. Щелкните стрелку списка «Размер сетки», затем щелкните «Большой».
Линии сетки кажутся больше.
6. Установите флажок Показать сетку
0 Показать сетку, чтобы отключить сетку.
7. Щелкните OK.
8. Сохраните свою работу, затем сравните изображение с рис. 19.
9. Закройте изображение, затем выйдите из Photoshop.
Вы добавили новые искажения к изображению и изменили размер сетки. После просмотра искажений на более крупной сетке вы отключили сетку и просмотрели изображение.
СПРАВОЧНИК ПО НАВЫКАМ
Ярлыки опытных пользователей для этого: используйте этот метод:
Раздувание площади | Фильтр> Пластика, или B | |
Изменить цвет стоп-кадра | Фильтр> Пластика, стрелка списка цветов маски | |
Изменить цвет сетки | Коробка фильтра | > Пластика, выберите Показать проверку сетки |
Серый v | ||
Изменить размер ячейки | Filter> Liquify, выберите Show Mesh check | |
ящик, | Средний v | |
Изменить размер кисти | Фильтр> Пластика.I1 | |
Стоп-пиксели | Фильтр> Пластика, fc? или F | |
Открыть диалоговое окно «Пластика» | Фильтр> Пластика или [Shift] [Ctrl] [X] (Win) или jx] [shift] [X] (Mac) | |
Сморщивающая зона | Фильтр> Пластик, O или S | |
Восстановить пиксели в области | Фильтр> Пластика, V.на палитре истории | |
Сдвиг пикселей в области | Фильтр> Пластика,!:; «• или 0 | |
Размораживание замороженных пикселей | Фильтр> Пластика, или D | |
Включение / выключение сетки | Фильтр> Пластика, □ Показать сетку | |
Включение и выключение фона | Фильтр> Пластика, □ Показать фон | |
Закрутите область по часовой стрелке | Фильтр> Liquify, £ или C | |
Деформация области | Фильтр> Пластика и или W |
Клавиша: пункты меню обозначаются значком> между именем меню и его командой.Синие жирные буквы — это ярлыки для выбора инструментов на панели инструментов.
РЕЗЮМЕ ГЛАВЫ
Функция Photoshop Liquify позволяет перемещать пиксели в изображении. Пиксели можно сдвигать, вращать или перетаскивать к центру кончика кисти или от центра кисти либо перпендикулярно мазку кисти. Вы можете использовать функцию «Пластика» для копирования или случайного шифрования частей изображений. Эту функцию можно использовать для создания странных и причудливых образов (например, сделать кому-то действительно диковатую прическу) или для внесения незначительных изменений в образы (например, удаления лишних килограммов с чьей-то талии).Части изображения можно защитить от изменений путем замораживания, а затем размораживания отдельных областей, а изменения, сделанные во время сеанса Liquify, можно восстановить с помощью различных настроек.
Что вы узнали:
• Как искажать изображения с помощью инструментов «Пластика»
• Как изменить настройки Liquify
• Как управлять сеансом Liquify путем замораживания и оттаивания
• Как восстановить искажения
• Как визуализировать искажения с помощью сетки
• Как изменить отображение сетки
Ключевые термины
Freeze Возможность блокировать области изображения, чтобы на них не влияли инструменты «Пластика».
Функция «Пластика» Применяет искажения к слоям с помощью различных инструментов в диалоговом окне «Пластика».
Сеанс «Пластика» Продолжительность с момента открытия диалогового окна «Пластика» до его закрытия.
Сетка. Набор горизонтальных и вертикальных линий сетки, наложенных на окно предварительного просмотра «Пластика».
Thaw Возможность вернуть области в изображении, чтобы на них можно было воздействовать инструментами «Пластика».
Глава
Продолжить чтение здесь: Хирургия
Была ли эта статья полезной?
3 способа объединения двух изображений в Photoshop
Автор Стив Паттерсон.
В этом уроке я покажу вам три простых способа объединить два изображения вместе в Photoshop! Мы начнем с самого простого способа смешивания изображений — с помощью параметра «Непрозрачность» на панели «Слои». Затем мы рассмотрим, как получить более интересные и творческие результаты, используя режимы наложения слоев Photoshop. И, наконец, мы узнаем, как легко смешать два изображения вместе с помощью маски слоя. Я также добавлю краткую подсказку в каждый из трех разделов, чтобы помочь ускорить рабочий процесс и получить наилучшие результаты.
Загрузите это руководство в виде готового к печати PDF-файла!
Как совмещать изображения в Photoshop
В этом уроке я использую Photoshop CC, но все совместимо с Photoshop CS6.
Вы также можете следить за моим видео этого урока на нашем канале YouTube. Или загрузите это руководство в формате PDF и получите в качестве бонуса мое полное руководство по режимам наложения слоев в формате PDF!
Метод 1. Параметр непрозрачности слоя
Первый способ, который мы рассмотрим для смешивания двух изображений, — это использование параметра Photoshop непрозрачности слоя .Вот первое изображение, которое я буду использовать:
Первое изображение. Фото: Adobe Stock.
А вот и второе изображение:
Второй образ. Фото: Adobe Stock.
Если мы посмотрим на панель «Слои», мы увидим оба изображения на отдельных слоях. Фотография пляжа находится на фоновом слое, а портрет — на «слое 1» над ним:
Панель «Слои», отображающая каждое изображение на отдельном слое.
Связано: как переместить изображения в один и тот же документ Photoshop
Значение непрозрачности
Параметр « Непрозрачность» находится в правом верхнем углу панели «Слои».По умолчанию он установлен на 100%, что означает, что текущий выбранный слой («Слой 1») полностью блокирует вид под ним:
Параметр «Непрозрачность» по умолчанию равен 100%.
Значение «Непрозрачность» управляет уровнем прозрачности слоя. Просто уменьшив значение, мы делаем слой более прозрачным, позволяя просвечивать часть изображения под ним. Чем больше мы уменьшаем непрозрачность, тем больше верхнее изображение будет переходить в нижнее. Я уменьшу непрозрачность со 100% до 75%:
Понижение непрозрачности верхнего слоя до 75%.
Это означает, что теперь мы смешиваем 75% изображения на верхнем слое с 25% изображения на нижнем слое. И тут мы видим, что женщина начинает сливаться с пляжем. Фото:
Результат с непрозрачностью верхнего слоя, сниженной до 75%.
Если бы я хотел еще больше отодвинуть ее на задний план, я мог бы просто еще больше понизить значение непрозрачности. Понижу до 30%:
Установка значения непрозрачности на 30 процентов.
При непрозрачности 30% мы видим только 30% верхнего изображения и 70% нижнего изображения, создавая хороший эффект смешивания.При необходимости вы захотите отрегулировать значение непрозрачности для ваших изображений:
Результат с непрозрачностью верхнего слоя 30%.
Совет: установка значения непрозрачности с клавиатуры
Вот небольшой совет, который поможет ускорить рабочий процесс. Вы можете изменить значение непрозрачности слоя прямо с клавиатуры. Нажмите 1 для 10%, 2 для 20%, 3 для 30% и так далее. Быстро нажмите две цифры, одну за другой, для получения более конкретных значений (например, 2, а затем 5 для 25%). Вы также можете нажать 0 для 100% непрозрачности или дважды быстро нажать 0 для 0%.
Метод 2: Режимы наложения слоев
Второй способ смешивания двух изображений, который мы рассмотрим, — это использование режимов наложения слоя в Photoshop. Режимы наложения отлично подходят для смешивания любых двух изображений вместе, но они особенно полезны для смешивания текстуры с фотографией. Вот открытое мной портретное изображение:
Первое изображение. Фото: Adobe Stock.
Я совмещу портрет с этим изображением текстуры:
Второй образ. Фото: Adobe Stock.
Опять же, если мы посмотрим на панель «Слои», мы увидим каждое изображение на отдельном слое. Портрет находится на фоновом слое, а текстура — на слое над ним:
Панель «Слои» снова показывает каждое изображение на отдельном слое.
Опция режима наложения
Режимы наложения в Photoshop — это разные способы взаимодействия слоев друг с другом. Параметр «Режим наложения» находится в верхнем левом углу панели «Слои», прямо напротив параметра «Непрозрачность». По умолчанию режим наложения слоя установлен на Нормальный.»Нормальный» просто означает, что слой вообще не смешивается со слоями под ним:
Опция режима наложения.
Щелкните слово «Нормальный», чтобы открыть меню с множеством различных режимов наложения на выбор. Мы не будем рассматривать все из них здесь, но я подробно расскажу о самых важных в моем руководстве по основным режимам наложения. Три самых популярных и полезных режима наложения, которые вы захотите попробовать, — это Multiply , Screen и Overlay . Режим наложения Multiply создает эффект затемнения, Screen создает эффект осветления, а Overlay смешивает два слоя для увеличения общей контрастности:
Результат с режимом наложения, установленным на «Умножение» (слева), «Экран» (в центре) и «Наложение» (справа).
Результаты, которые вы получите от различных режимов наложения, будут полностью зависеть от ваших изображений. В моем случае лучший результат я получаю при использовании режима наложения Soft Light :
Изменение режима наложения на Мягкий свет.
Подобно режиму наложения Overlay, Soft Light смешивает два изображения вместе, повышая общий контраст. Разница в том, что Soft Light создает более тонкий и естественный эффект:
Результат с режимом наложения слоя текстуры, установленным на Soft Light.
Еще один режим наложения, который действительно хорошо работает с этими двумя изображениями, — Divide :
.
Изменение режима наложения на Divide.
Divide — один из малоизвестных и редко используемых режимов наложения в Photoshop. Но с этими двумя изображениями эффект выглядит довольно круто:
Эффект смешивания со слоем текстуры, установленным на «Разделение».
Комбинирование режимов наложения с непрозрачностью слоя
После того, как вы выбрали режим наложения, вы можете точно настроить результат, отрегулировав непрозрачность слоя, как мы видели ранее.Я оставлю режим наложения слоя текстуры, установленный на Divide, и уменьшу непрозрачность со 100% до 50%:
Оставляем режим наложения «Разделение» и уменьшаем непрозрачность до 50%.
И вот результат:
Комбинация режима наложения с более низкой непрозрачностью дает менее интенсивный эффект.
Загрузите это руководство в виде готового к печати PDF-файла!
Совет: как переключаться между режимами наложения с клавиатуры
Вот еще один быстрый совет, который поможет ускорить рабочий процесс и упростить работу с режимами наложения.Вы можете переключаться между различными режимами наложения Photoshop прямо с клавиатуры. Нажмите на букву V , чтобы быстро выбрать Move Tool . Затем нажмите и удерживайте клавишу Shift и используйте клавиши плюс ( + ) и минус ( — ) для перемещения вверх или вниз по списку. Это позволяет вам быстро опробовать различные режимы наложения, чтобы найти наиболее подходящий.
Метод 3. Использование маски слоя
Третий способ, который мы рассмотрим для смешивания двух изображений в Photoshop, и, безусловно, самый популярный, — это использование маски слоя .В отличие от параметра непрозрачности слоя или режимов наложения, которые смешивают все изображения как единое целое, маски слоев позволяют нам точно контролировать, где два изображения смешиваются вместе. С масками слоев мы можем сделать многое, больше, чем мы могли бы охватить в одном уроке. Итак, здесь мы просто изучим основы.
Вот первое изображение, которое я буду использовать:
Первое изображение. Фото: Adobe Stock.
А вот и второе изображение:
Второй образ. Фото: Adobe Stock.
Снова заглянув в панель «Слои», мы видим каждую фотографию на отдельном слое. Фотография одуванчика находится на фоновом слое, а девушка находится на «слое 1» над ним:
Каждая фотография находится на отдельном слое.
Добавление маски слоя
Чтобы добавить маску слоя, сначала убедитесь, что выбран верхний слой. Затем щелкните значок Добавить маску слоя в нижней части панели «Слои»:
Щелкните значок «Добавить маску слоя».
Миниатюра маски слоя появляется рядом с миниатюрой предварительного просмотра слоя:
Миниатюра новой маски слоя.
Как работает маска слоя
Маски слоя управляют прозрачностью слоя, как мы видели с параметром «Непрозрачность» на панели «Слои». Но в то время как параметр «Непрозрачность» влияет на прозрачность всего слоя в целом, маска слоя позволяет нам добавлять разные уровни прозрачности к разным частям слоя. Другими словами, мы можем использовать маску слоя, чтобы показать одни области и скрыть другие, что делает маски слоя идеальными для смешивания изображений.
Они работают с использованием черного и белого.Любая часть слоя, где маска слоя заполнена белым, остается видимой. И любая часть слоя, где маска залита черным, скрывается. Давайте посмотрим, как мы можем быстро совместить наши два изображения вместе, нарисовав градиент от черного к белому на маске слоя.
Выбор инструмента «Градиент»
Выберите инструмент «Градиент» на панели инструментов:
Выбор инструмента «Градиент».
Выбор черно-белого градиента
Выбрав инструмент «Градиент», перейдите на панель параметров и щелкните стрелку, направленную вниз, рядом с образцом градиента:
Щелкните стрелку рядом с образцом градиента.
В палитре градиентов выберите градиент Черный, Белый , дважды щелкнув его миниатюру (третья слева, верхняя строка):
Выбор черно-белого градиента.
Объединение двух изображений вместе
Убедитесь, что маска слоя, а не само изображение, выбрана, щелкнув миниатюру маски слоя. Вы должны увидеть границу выделения вокруг него:
Щелкните миниатюру, чтобы выбрать маску слоя.
Затем щелкните изображение и растяните градиент от черного к белому.Помните, что черный цвет скроет эту часть слоя, а белый покажет ее. В моем случае я хочу, чтобы левая сторона фотографии (часть с девушкой) оставалась видимой, поэтому левая сторона маски должна быть белой. Я хочу, чтобы правая сторона была скрыта, а это значит, что правая сторона маски должна быть черной. Поскольку градиент будет начинаться черным цветом и заканчиваться белым, я нажимаю на правую сторону изображения и перетаскиваю горизонтально влево. Нажмите и удерживайте клавишу Shift при перетаскивании, чтобы перемещаться прямо:
Рисование градиента от черного к белому на маске слоя справа налево.
Когда вы отпускаете кнопку мыши, Photoshop рисует градиент на маске слоя и смешивает две фотографии вместе. Здесь мы видим, как девушка с верхнего изображения сливается с одуванчиками нижнего изображения. Если вас не устраивает первый результат, просто нарисуйте еще один градиент на маске, чтобы повторить попытку:
Две фотографии теперь смешиваются.
Просмотр маски слоя
Если мы посмотрим на миниатюру маски слоя на панели «Слои», мы увидим, где был нарисован градиент.Черная область справа — это место, где верхнее изображение скрыто в документе, позволяя просвечивать фото на фоновом слое. А белая область слева — это место, где верхнее изображение остается видимым:
Миниатюра маски слоя, показывающая градиент.
Мы также можем просмотреть саму фактическую маску слоя в документе. Если вы нажмете и удерживаете клавишу Alt (Win) / Option (Mac) на клавиатуре и щелкнете миниатюру маски слоя, вы переключите вид в документе с изображений на маску слоя.Это упрощает точное понимание того, что происходит. Опять же, черная область справа — это место, где верхний слой скрыт от просмотра, а белая область слева — это место, где он виден.
Но обратите внимание на серую область посередине, где градиент постепенно переходит от черного к белому. Эта область создает плавный переход между двумя слоями, позволяя им плавно переходить друг в друга. Чтобы переключить вид с маски слоя обратно на изображения, снова нажмите и удерживайте клавишу Alt (Win) / Option (Mac) и щелкните миниатюру маски слоя на панели «Слои»:
Градиент от темного к светлому в середине — это то, что позволяет двум изображениям плавно сливаться вместе..
Совет: как включать и выключать маску слоя
Вот небольшой совет по работе с масками слоя. Вы можете включать и выключать маску слоя, нажав и удерживая клавишу Shift и щелкнув миниатюру маски слоя на панели «Слои». Щелкните миниатюру один раз, чтобы временно отключить маску и просмотреть весь слой. На миниатюре появится красный значок «X», сообщающий, что маска отключена. Удерживая Shift, щелкните миниатюру еще раз, чтобы снова включить маску слоя:
Удерживая Shift, щелкните миниатюру, чтобы включить или выключить маску слоя.
И вот оно! Это быстрый взгляд на то, как совместить два изображения вместе с помощью параметра непрозрачности слоя, режимов наложения слоев и маски слоя в Photoshop! Чтобы узнать больше о смешивании изображений с масками слоя, см. Наше руководство по маскам слоя и градиентам. Используйте наше руководство по слоям, чтобы узнать больше о слоях Photoshop, или посетите наш раздел Основы Photoshop для получения дополнительных руководств!
Как удалить фон фотографии в Photoshop
Этот урок Photoshop научит вас некоторым подробным шагам по удалению фона в Photoshop с краями высокого разрешения.У меня есть другие руководства, которые показывают, как быстро избавиться от фона тремя разными способами. Определенно стоит посмотреть. Этот урок покажет вам, как подойти ближе и получить действительно красивые края.
Мы начнем с этой фотографии, которую я нашел на Adobe Stock.
Шаг 1.
Выберите инструмент быстрого выбора.
Шаг 2.
С помощью достаточно большой кисти сделайте грубое выделение вокруг объекта.
Шаг 3.
Используйте меньшую кисть, чтобы очистить края.Alt / Option перетащите, чтобы отменить выбор эпох, в которых вы зашли слишком далеко.
Шаг 4.
Используйте кисть меньшего размера, чтобы прорезать отверстия в отсоединенных областях, таких как внутренние ножки стула и т. Д. Включите давление, если у вас есть планшет Wacom / Surface. (см. видео выше)
Step 5.
Практически ни один учебник по вырезам, который я видел в сети, не делает этого … Увеличьте масштаб до 100%.
Теперь вы можете видеть множество областей, которые не так хорошо выделены.
С помощью очень маленькой кисти обведите изображение по всему периметру, получая действительно красивый, плотный выбор.Посмотрите видео выше, чтобы продемонстрировать это, а также несколько советов по ускорению работы.
Более точный выбор поможет нам при уточнении.
Шаг 6.
Выберите Select And Mask, нажав кнопку на верхней панели инструментов.
Добро пожаловать в рабочее пространство «Выделение и маска». Здесь мы уточняем края.
Выберите белый цвет в качестве фона и полностью увеличьте непрозрачность.
Шаг 7.
Выберите уточняющую кисть, чтобы закрасить участки волос и меха.
Посмотрите, как он красиво подбирает волосы.
Шаг 8.
Посмотрите на прямые края, нужна помощь. Вам понравится совет, которым я собираюсь поделиться.
Выберите кисть под кистью «Уточнить».
Увеличьте масштаб до 100% для этого
Удерживая Alt / Option, закрасьте край.
Шаг 9.
Уменьшите непрозрачность, чтобы вы также могли видеть исходный край на подлокотнике стула.
Шаг 10.
Кликните кистью по краю линии.(1)
Переместите курсор на другую сторону кромки. Убедитесь, что круг кисти совпадает с краем.
Удерживайте Shift и щелкните
Вы увидите, что нарисована прямая линия, дающая идеальный край. Если вы его пропустили, отмените действие и попробуйте еще раз, видео очень хорошо это демонстрирует.
Смотрите край.
Шаг 11.
Повторите то же самое для второго края металлической скобы.
Верните непрозрачность на 100%, чтобы видеть края.
Для получения идеального выреза повторите описанное выше для всех прямых краев.Также сделайте небольшую кисть и исправьте все укромные уголки и трещинки. Это крупный план и детальная работа. В социальных сетях и в Интернете не обязательно становиться слишком совершенным. Однако, если вы занимаетесь коммерческой или печатной работой, вам нужно быть очень точным и точным.
Когда вы закончите (здесь это еще не закончено) Измените вывод на новый слой с маской слоя.
Нажмите ОК
У вас будет красивый вырез и маска слоя, так что вы можете доработать ее, если хотите.
Я очень надеюсь, что вы нашли это видео и письменные инструкции полезными и что это поможет вам вырезать фон из ваших фотографий. Если это было полезно, расскажите всем о PhotoshopCAFE и поделитесь этим уроком в своих социальных сетях. Кроме того, если вы хотите, чтобы вырезать что-либо в Photoshop не удалось, ознакомьтесь с курсом «Секреты выделения» в Photoshop CC.
Ознакомьтесь с другими уроками этой серии о том, как удалить что-либо с фотографии в Photoshop от Колина Смита
Рад видеть вас здесь, в КАФЕ
Колин
PS Не забудьте присоединиться к нашему списку рассылки и подписывайтесь на меня в социальных сетях>
(в последнее время я публиковал забавные истории в Instagram и Facebook)
Вы можете получить мою бесплатную электронную книгу о режимах наложения слоев здесь
НОВЫЙ КУРС КОЛИНА СМИТА
Перестаньте бороться с выбором.