Как создать картинку в фотошопе с нуля: Как сделать картинку в Photoshop

Как сделать картинку в Photoshop

• Анимированный баннер Анимация 3D обложка Картинка Коллаж Слои Маски Инструменты выделения Надпись и Текст CSS-спрайты Видеокурсы Photoshop

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

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

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

Открываем Photoshop и жмём Ctrl+N

(«Файл — Создать»). Вы можете задать другой размер, а я установил 21 х 29,7 см — размер стандартного листа A4:

Картинка будет служить не только для изготовления 3D-обложки, но и как титульная страница при создании электронной книги в формате PDF. Если сделать картинку меньшего размера, то при её увеличении, пострадает качество. Остальные параметры в окне не важны.

Создадим фон картинки, для заливки которого нужно установить цвет. Но т.к. мы будем делать градиентную заливку, нам потребуется выбрать два цвета: основной (Рис.1-1А) и фоновый (Рис.1-1Б). Кликните по квадратику, и откроется «Палитра цветов», где можно подобрать цвет или ввести в отмеченное поле вручную:

Рис.1. Панель инструментов и Палитра цветов

То же самое проделайте со вторым квадратиков, установив цвет потемнее. Инструмент «Заливка» может служить для заливки фона одним цветом, а мы выбираем инструмент «Градиент» (Рис.1-2):

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

Если используется изображение большого размера, то для удобства уменьшаем масштаб в нижнем уголке. Следующим шагом будет нанесение надписи. Выбираем инструмент «Текст» (Рис.1-3) и кликаем примерно в том месте, где он должен начинаться.

Точность места не важна, потому что готовую надпись мы сможем передвинуть, используя инструмент «Перемещение» (Рис.1-4).

Устанавливаем цвет текста (Рис.2-1) и набираем название книги. Если оно длинное, то для переноса строки используем клавишу Enter. Обратите внимание, наши две строчки получились неодинаковой длины:

Для того чтобы править текст, заходим в «Окно — Символ» и используем панель «Символ» (Рис.2). Выделяем надпись или её часть и задаём шрифт (Рис.2-2), у меня это «Impact». Длину строки регулируем размером шрифта (Рис.

2-3) или изменяем её ширину в процентах (Рис.2-5). Рядом можно изменить её высоту (Рис.2-4).

Рис.2. Правка текста в панели «Символ»

В поле (Рис.2-6) регулируем междустрочный интервал, а после завершения всех действий жмём галочку (Рис.2-7), что их сохраняет. Перечёркнутый кружок служит для отмены произведённых изменений. Теперь сдвигаем надпись на её место, а заодно центрируем по горизонтали с помощью инструмента «Перемещение» (Рис.1-4).

Для того чтобы надпись стала более привлекательной наложим на неё тень: «Слои — Стиль слоя — Тень». Я оставил настройки, которые были по умолчанию, но вы можете их подкорректировать. Например, изменить угол отображения тени (тут 120°), или изменить её смещение и размер:

Теперь вы сможете сделать столько надписей, сколько требуется, повторив все процедуры. Для того чтобы повернуть надпись и сделать её вертикальной, идём в «Редактирование — Трансформирование — Поворот на 90° против часовой».

Осталось добавить изображения: сверху логотип, а второе, в формате PNG с прозрачным фоном:

Откройте изображение PNG, выделите его инструментом «Прямоугольная область» (Рис.1-5) и скопируйте: Ctrl+C («Редактирование — Скопировать»). Теперь выделите прямоугольник на нашей картинке и вставьте его: Ctrl+V («Редактирование — Вставить»).

Чтобы подогнать вставленное изображение по размеру, нажмите Ctrl+T («Редактирование — Свободное трансформирование»), и тяните курсором за уголки рамки. Затем подправьте местоположение инструментом «Перемещение» (Рис.1-4).

Чтобы вставить изображение с непрозрачным фоном, нужно уметь пользоваться другими инструментами выделения, например: «Лассо» (Рис.1-6), и некоторыми другими. Или делать картинку с белым фоном. Но вы без особого труда сможете найти изображения PNG с прозрачным фоном, применив фильтры для их поиска в Яндекс Картинках.

Естественно, что всё «гладко» с первого раза может не получиться. Но мы спокойно может отредактировать любую надпись, изображение или даже поменять фон. Все они располагаются на отдельных слоях. Работать со слоями можно из панели «Слои», нажмите F7 («Окно — Слои»):

Рис.3. Работа в панели «Слои»

Видите, и картинки, и каждая надпись расположены в своём слое, которые образовались в процессе работы. Но вы сами можете создавать новые слои (Рис.3-1) или удалять их (Рис.3-2). Слева у каждого слоя находится глазик, он отвечает за его видимость. Кликните по глазику, и слой на картинке станет невидимым.

Рабочий слой всегда выделен, в нашем примере — это надпись «webmastersam.ru». Если сейчас выбрать инструмент «Текст» (Рис.1-3) и выделить эту надпись на нашей картинке, то её снова можно редактировать.

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

Обычные веб-форматы изображений не имеют слоёв. Чтобы иметь шаблон картинки со слоями, для последующего использования, сохраните её в формате PSD: Shift+Ctrl+S («Файл — Сохранить как»).

Ну, а саму картинку, сохраните в формате JPG или PNG-8: Alt+Shift+Ctrl+S («Файл — Сохранить для Web и устройств»). Если требуется повышенное качество картинки, выбирайте формат PNG-24. Получится более полновесный файл, но картинка будет высокого качества.

Уроки Photoshop:

• Анимированный баннер Анимация 3D обложка Картинка Коллаж Слои Маски Инструменты выделения Надпись и Текст CSS-спрайты Видеокурсы Photoshop

Поделиться с друзьями:

О партнёрках

получить

Сайт с нуля

получить

Рисование в Photoshop

Руководство пользователя Отмена

Поиск

1. Руководство пользователя Photoshop
2. Введение в Photoshop
   1. Мечтайте об этом. Сделайте это.
   2. Новые возможности Photoshop
   3. Редактирование первой фотографии
   4. Создание документов
   5. Photoshop | Часто задаваемые вопросы
   6. Системные требования Photoshop
   7. Перенос наборов настроек, операций и настроек
   8. Знакомство с Photoshop
3. Photoshop и другие продукты и услуги Adobe
   1. Работа с графическим объектом Illustrator в Photoshop
   2. Работа с файлами Photoshop в InDesign
      
   3. Материалы Substance 3D для Photoshop
   4. Photoshop и Adobe Stock
   5. Работа со встроенным расширением Capture в Photoshop
   6. Библиотеки Creative Cloud Libraries
   7. Библиотеки Creative Cloud в Photoshop
   8. Работа в Photoshop с использованием Touch Bar
   9. Сетка и направляющие
   10. Создание операций
   11. Отмена и история операций
4. Photoshop на iPad
   1. Photoshop на iPad | Общие вопросы
   2. Знакомство с рабочей средой
   3. Системные требования | Photoshop на iPad
   4. Создание, открытие и экспорт документов
   5. Добавление фотографий
   6. Работа со слоями
   7. Рисование и раскрашивание кистями
   8. Выделение участков и добавление масок
   9. Ретуширование композиций
   10. Работа с корректирующими слоями
   11. Настройка тональности композиции с помощью слоя «Кривые»
   12. Применение операций трансформирования
   13. Обрезка и поворот композиций
   14. Поворот, панорамирование, масштабирование и восстановление холста
   15. Работа с текстовыми слоями
   16. Работа с Photoshop и Lightroom
   17. Получение отсутствующих шрифтов в Photoshop на iPad
   18. Японский текст в Photoshop на iPad
   19. Управление параметрами приложения
   20. Сенсорные ярлыки и жесты
   21. Комбинации клавиш
   22. Изменение размера изображения
   23. Прямая трансляция творческого процесса в Photoshop на iPad
   24. Исправление недостатков с помощью восстанавливающей кисти
   25. Создание кистей в Capture и их использование в Photoshop
   26. Работа с файлами Camera Raw
   27. Создание и использование смарт-объектов
   28. Коррекция экспозиции изображений с помощью инструментов «Осветлитель» и «Затемнитель»
5. Бета-версия веб-приложения Photoshop
   1. Часто задаваемые вопросы | Бета-версия веб-приложения Photoshop 
   2. Общие сведения о рабочей среде
   3. Системные требования | Бета-версия веб-приложения Photoshop
   4. Комбинации клавиш | Бета-версия веб-приложения Photoshop
   5. Поддерживаемые форматы файлов | Бета-вервия веб-приложения Photoshop
   6. Открытие облачных документов и работа с ними
   7. Совместная работа с заинтересованными сторонами
   8. Ограниченные возможности редактирования облачных документов
6. Облачные документы
   1. Облачные документы Photoshop | Часто задаваемые вопросы
   2. Облачные документы Photoshop | Вопросы о рабочем процессе
   3. Работа с облачными документами и управление ими в Photoshop
   4. Обновление облачного хранилища для Photoshop
   5. Не удается создать или сохранить облачный документ
   6. Устранение ошибок с облачными документами Photoshop
   7. Сбор журналов синхронизации облачных документов
   8. Общий доступ к облачным документам и их редактирование
   9. Общий доступ к файлам и комментирование в приложении
7. Рабочая среда
   1. Основные сведения о рабочей среде
   2. Более быстрое обучение благодаря панели «Новые возможности» в Photoshop
   3. Создание документов
   4. Работа в Photoshop с использованием Touch Bar
   5. Галерея инструментов
   6. Установки производительности
   7. Использование инструментов
   8. Сенсорные жесты
   9. Возможности работы с сенсорными жестами и настраиваемые рабочие среды
   10. Обзорные версии технологии
   11. Метаданные и комментарии
   12. Комбинации клавиш по умолчанию
   13. Возможности работы с сенсорными жестами и настраиваемые рабочие среды
   14. Помещение изображений Photoshop в другие приложения
   15. Установки
   16. Комбинации клавиш по умолчанию
   17. Линейки
   18. Отображение или скрытие непечатных вспомогательных элементов
   19. Указание колонок для изображения
   20. Отмена и история операций
   21. Панели и меню
   22. Помещение файлов
   23. Позиционирование элементов с привязкой
   24. Позиционирование с помощью инструмента «Линейка»
   25. Наборы настроек
   26. Настройка комбинаций клавиш
   27. Сетка и направляющие
8. Разработка содержимого для Интернета, экрана и приложений
   1. Photoshop для дизайна
   2. Монтажные области
   3. Просмотр на устройстве
   4. Копирование CSS из слоев
   5. Разделение веб-страниц на фрагменты
   6. Параметры HTML для фрагментов
   7. Изменение компоновки фрагментов
   8. Работа с веб-графикой
   9. Создание веб-фотогалерей
9. Основные сведения об изображениях и работе с цветом
   1. Изменение размера изображений
   2. Работа с растровыми и векторными изображениями
   3. Размер и разрешение изображения
   4. Импорт изображений из камер и сканеров
   5. Создание, открытие и импорт изображений
   6. Просмотр изображений
   7. Ошибка «Недопустимый маркер JPEG» | Открытие изображений
   8. Просмотр нескольких изображений
   9. Настройка палитр цветов и образцов цвета
   10. HDR-изображения
   11. Подбор цветов на изображении
   12. Преобразование между цветовыми режимами
   13. Цветовые режимы
   14. Стирание фрагментов изображения
   15. Режимы наложения
   16. Выбор цветов
   17. Внесение изменений в таблицы индексированных цветов
   18. Информация об изображениях
   19. Фильтры искажения недоступны
   20. Сведения о цвете
   21. Цветные и монохромные коррекции с помощью каналов
   22. Выбор цветов на панелях «Цвет» и «Образцы»
   23. Образец
   24. Цветовой режим (или режим изображения)
   25. Цветовой оттенок
   26. Добавление изменения цветового режима в операцию
   27. Добавление образцов из CSS- и SVG-файлов HTML
   28. Битовая глубина и установки
10. Слои
    1. Основные сведения о слоях
    2. Обратимое редактирование
    3. Создание слоев и групп и управление ими
    4. Выделение, группировка и связывание слоев
    5. Помещение изображений в кадры
    6. Непрозрачность и наложение слоев
    7. Слои-маски
    8. Применение смарт-фильтров
    9. Композиции слоев
    10. Перемещение, упорядочение и блокировка слоев
    11. Маскирование слоев при помощи векторных масок
    12. Управление слоями и группами
    13. Эффекты и стили слоев
    14. Редактирование слоев-масок
    15. Извлечение ресурсов
    16. Отображение слоев с помощью обтравочных масок
    17. Формирование графических ресурсов из слоев
    18. Работа со смарт-объектами
    19. Режимы наложения
    20. Объединение нескольких фрагментов в одно изображение
    21. Объединение изображений с помощью функции «Автоналожение слоев»
    22. Выравнивание и распределение слоев
    23. Копирование CSS из слоев
    24. Загрузка выделенных областей на основе границ слоя или слоя-маски
    25. Просвечивание для отображения содержимого других слоев
    26. Слой
    27. Сведение
    28. Совмещенные изображения
    29. Фон
11. Выделения
    1. Рабочая среда «Выделение и маска»
    2. Быстрое выделение областей
    3. Начало работы с выделениями
    4. Выделение при помощи группы инструментов «Область»
    5. Выделение при помощи инструментов группы «Лассо»
    6. Выбор цветового диапазона в изображении
    7. Настройка выделения пикселей
    8. Преобразование между контурами и границами выделенной области
    9. Основы работы с каналами
    10. Перемещение, копирование и удаление выделенных пикселей
    11. Создание временной быстрой маски
    12. Сохранение выделенных областей и масок альфа-каналов
    13. Выбор областей фокусировки в изображении
    14. Дублирование, разделение и объединение каналов
    15. Вычисление каналов
    16. Выделение
    17. Ограничительная рамка
12. Коррекции изображений
    1. Деформация перспективы
    2. Уменьшение размытия в результате движения камеры
    3. Примеры использования инструмента «Восстанавливающая кисть»
    4. Экспорт таблиц поиска цвета
    5. Корректировка резкости и размытия изображения
    6. Общие сведения о цветокоррекции
    7. Применение настройки «Яркость/Контрастность»
    8. Коррекция деталей в тенях и на светлых участках
    9. Корректировка «Уровни»
    10. Коррекция тона и насыщенности
    11. Коррекция сочности
    12. Настройка насыщенности цвета в областях изображения
    13. Быстрая коррекция тона
    14. Применение специальных цветовых эффектов к изображениям
    15. Улучшение изображения при помощи корректировки цветового баланса
    16. HDR-изображения
    17. Просмотр гистограмм и значений пикселей
    18. Подбор цветов на изображении
    19. Кадрирование и выпрямление фотографий
    20. Преобразование цветного изображения в черно-белое
    21. Корректирующие слои и слои-заливки
    22. Корректировка «Кривые»
    23. Режимы наложения
    24. Целевая подготовка изображений для печатной машины
    25. Коррекция цвета и тона с помощью пипеток «Уровни» и «Кривые»
    26. Коррекция экспозиции и тонирования HDR
    27. Фильтр
    28. Размытие
    29. Осветление или затемнение областей изображения
    30. Избирательная корректировка цвета
    31. Замена цветов объекта
13. Adobe Camera Raw
    1. Системные требования Camera Raw
    2. Новые возможности Camera Raw
    3. Введение в Camera Raw
    4. Создание панорам
    5. Поддерживаемые объективы
    6. Виньетирование, зернистость и удаление дымки в Camera Raw
    7. Комбинации клавиш по умолчанию
    8. Автоматическая коррекция перспективы в Camera Raw
    9. Обратимое редактирование в Camera Raw
    10. Инструмент «Радиальный фильтр» в Camera Raw
    11. Управление настройками Camera Raw
    12. Обработка, сохранение и открытие изображений в Camera Raw
    13. Совершенствование изображений с улучшенным инструментом «Удаление точек» в Camera Raw
    14. Поворот, обрезка и изменение изображений
    15. Корректировка цветопередачи в Camera Raw
    16. Краткий обзор функций | Adobe Camera Raw | Выпуски за 2018 г.
    17. Обзор новых возможностей
    18. Версии обработки в Camera Raw
    19. Внесение локальных корректировок в Camera Raw
14. Исправление и восстановление изображений
    1. Удаление объектов с фотографий с помощью функции «Заливка с учетом содержимого»
    2. Заплатка и перемещение с учетом содержимого
    3. Ретуширование и исправление фотографий
    4. Коррекция искажений изображения и шума
    5. Основные этапы устранения неполадок для решения большинства проблем
15. Преобразование изображений
    1. Трансформирование объектов
    2. Настройка кадрирования, поворотов и холста
    3. Кадрирование и выпрямление фотографий
    4. Создание и редактирование панорамных изображений
    5. Деформация изображений, фигур и контуров
    6. Перспектива
    7. Использование фильтра «Пластика»
    8. Масштаб с учетом содержимого
    9. Трансформирование изображений, фигур и контуров
    10. Деформация
    11. Трансформирование
    12. Панорама
16. Рисование и живопись
    1. Рисование симметричных орнаментов
    2. Варианты рисования прямоугольника и изменения обводки
    3. Сведения о рисовании
    4. Рисование и редактирование фигур
    5. Инструменты рисования красками
    6. Создание и изменение кистей
    7. Режимы наложения
    8. Добавление цвета в контуры
    9. Редактирование контуров
    10. Рисование с помощью микс-кисти
    11. Наборы настроек кистей
    12. Градиенты
    13. Градиентная интерполяция
    14. Заливка и обводка выделенных областей, слоев и контуров
    15. Рисование с помощью группы инструментов «Перо»
    16. Создание узоров
    17. Создание узора с помощью фильтра «Конструктор узоров»
    18. Управление контурами
    19. Управление библиотеками узоров и наборами настроек
    20. Рисование при помощи графического планшета
    21. Создание текстурированных кистей
    22. Добавление динамических элементов к кистям
    23. Градиент
    24. Рисование стилизованных обводок с помощью архивной художественной кисти
    25. Рисование с помощью узора
    26. Синхронизация наборов настроек на нескольких устройствах
17. Текст
    1. Добавление и редактирование текста
       
    2. Универсальный текстовый редактор
    3. Работа со шрифтами OpenType SVG
    4. Форматирование символов
    5. Форматирование абзацев
    6. Создание эффектов текста
    7. Редактирование текста
    8. Интерлиньяж и межбуквенные интервалы
    9. Шрифт для арабского языка и иврита
    10. Шрифты
    11. Поиск и устранение неполадок, связанных со шрифтами
    12. Азиатский текст
    13. Создание текста
    14. Ошибка Text Engine при использовании инструмента «Текст» в Photoshop | Windows 8
18. Видео и анимация
    1. Видеомонтаж в Photoshop
    2. Редактирование слоев видео и анимации
    3. Общие сведения о видео и анимации
    4. Предварительный просмотр видео и анимации
    5. Рисование кадров в видеослоях
    6. Импорт видеофайлов и последовательностей изображений
    7. Создание анимации кадров
    8. 3D-анимация Creative Cloud (предварительная версия)
    9. Создание анимаций по временной шкале
    10. Создание изображений для видео
19. Фильтры и эффекты
    1. Использование фильтра «Пластика»
    2. Использование эффектов группы «Галерея размытия»
    3. Основные сведения о фильтрах
    4. Справочник по эффектам фильтров
    5. Добавление эффектов освещения
    6. Использование фильтра «Адаптивный широкий угол»
    7. Фильтр «Масляная краска»
    8. Эффекты и стили слоев
    9. Применение определенных фильтров
    10. Растушевка областей изображения
20. Сохранение и экспорт
    1. Сохранение файлов в Photoshop
       
    2. Экспорт файлов в Photoshop
    3. Поддерживаемые форматы файлов
       
    4. Сохранение файлов в других графических форматах
    5. Перемещение проектов между Photoshop и Illustrator
    6. Сохранение и экспорт видео и анимации
    7. Сохранение файлов PDF
    8. Защита авторских прав Digimarc
21. Печать
    1. Печать 3D-объектов
    2. Печать через Photoshop
    3. Печать и управление цветом
    4. Контрольные листы и PDF-презентации
    5. Печать фотографий в новом макете раскладки изображений
    6. Печать плашечных цветов
    7. Дуплексы
    8. Печать изображений на печатной машине
    9. Улучшение цветной печати в Photoshop
    10. Устранение неполадок при печати | Photoshop
22. Автоматизация
    1. Создание операций
    2. Создание изображений, управляемых данными
    3. Сценарии
    4. Обработка пакета файлов
    5. Воспроизведение операций и управление ими
    6. Добавление условных операций
    7. Сведения об операциях и панели «Операции»
    8. Запись инструментов в операциях
    9. Добавление изменения цветового режима в операцию
    10. Набор средств разработки пользовательского интерфейса Photoshop для внешних модулей и сценариев
23. Управление цветом
    1. Основные сведения об управлении цветом
    2. Обеспечение точной цветопередачи
    3. Настройки цвета
    4. Работа с цветовыми профилями
    5. Управление цветом документов для просмотра в Интернете
    6. Управление цветом при печати документов
    7. Управление цветом импортированных изображений
    8. Выполнение цветопробы
24. Подлинность контента
    1. Подробнее об учетных данных для содержимого
    2. Идентичность и происхождение токенов NFT
    3. Подключение учетных записей для творческой атрибуции
25. 3D-объекты и технические изображения
    1. 3D в Photoshop | Распространенные вопросы об упраздненных 3D-функциях
    2. 3D-анимация Creative Cloud (предварительная версия)
    3. Печать 3D-объектов
    4. 3D-рисование
    5. Усовершенствование панели «3D» | Photoshop
    6. Основные понятия и инструменты для работы с 3D-графикой
    7. Рендеринг и сохранение 3D-объектов
    8. Создание 3D-объектов и анимаций
    9. Стеки изображений
    10. Процесс работы с 3D-графикой
    11. Измерения
    12. Файлы формата DICOM
    13. Photoshop и MATLAB
    14. Подсчет объектов на изображении
    15. Объединение и преобразование 3D-объектов
    16. Редактирование 3D-текстур
    17. Коррекция экспозиции и тонирования HDR
    18. Настройки панели «3D»

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

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

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

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

Рабочий контур — это временный контур, который появляется на панели «Контуры» и определяет границы фигуры.

Контуры можно использовать несколькими способами.

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

• Контур можно преобразовать в выделенную область. (См. раздел Преобразование контуров в границы выделенной области.)

• Контур можно залить или обвести произвольным цветом. (См. раздел Заливка контуров цветом.)

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

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

Слой-фигура

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

Контуры

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

Заливка пикселей

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

Параметры рисования

A. Слой-фигура B. Контуры C. Заливка пикселей 

Еще похожее

• Инструменты
• Использование панели параметров

Вход в учетную запись

Войти

Управление учетной записью

Как создавать изображения с нуля в Photoshop Elements 12

BY: Барбара Обермайер и Тед Падова и

Обновлены: 03-26-2016

Photoshop Elements 2020 Для Dummies

Excloge Book Buy на Amazon

9202. Вы можете начать с нуля, создав новый документ в Photoshop Elements. Новые пустые страницы можно использовать по-разному. Вы можете смешивать и объединять изображения в новом документе, создавать холст, на котором можно рисовать и раскрашивать, или использовать диалоговое окно «Создать», чтобы узнать размер, размеры и разрешение файла.

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

1. Откройте Elements и выберите режим редактирования.

   На экране приветствия нажмите кнопку «Фоторедактор».

2. Выберите File→New→Blank File в любой рабочей области или нажмите Ctrl+N (Cmd+N на Mac).

   Кроме того, вы можете щелкнуть раскрывающееся меню «Открыть» в редакторе фотографий и выбрать «Новый пустой файл».

   В любом случае откроется диалоговое окно New, как показано на рисунке.

3. Выберите атрибуты для нового файла.

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

   У вас есть несколько вариантов на выбор:

   • Имя : Введите имя для вашего файла.

   • Предустановка : Выберите один из нескольких размеров.

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

   • Размеры (Ширина/Высота) : Значения в текстовых полях Ширина и Высота являются независимыми; любое поле можно редактировать, не затрагивая другое. Рядом со значениями в текстовых полях «Ширина» и «Высота» вы найдете раскрывающиеся меню, предлагающие множество вариантов единиц измерения, таких как единицы измерения по умолчанию в пикселях, за которыми следуют дюймы, сантиметры (см), миллиметры (мм), точки, пики и столбцы.

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

   • Цветовой режим : Возможные варианты: Bitmap, Grayscale и RGB Color.

   • Фоновое содержимое : У вас есть три варианта: Белый, Цвет фона и Прозрачный. Выбор, который вы делаете, приводит к цвету пустого изображения. Если вы выберете «Цвет фона», к фону будет применен текущий цвет фона, назначенный на панели «Инструменты». Если вы выберете Прозрачный, изображение будет создано как слой, а имя слоя изменится на Слой 0.

   • Размер изображения : Это значение (отображается в правом нижнем углу диалогового окна) динамически изменяется при изменении значений ширины, высоты и разрешения. Значение «Размер изображения» указывает, сколько места требуется для сохранения несжатого файла.

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

Иногда может потребоваться скопировать выделенный фрагмент в буфер обмена и преобразовать информацию из буфера обмена в изображение. Убедитесь, что вы скопировали некоторые данные изображения в буфер обмена. В Elements выберите «Файл» → «Создать» → «Изображение из буфера обмена». Данные в буфере обмена появляются в новом окне документа.

Помимо создания новых пустых файлов, диалоговое окно «Создать» может быть полезным источником информации для всей вашей работы в Elements. Предположим, вы хотите узнать, сколько изображений вы можете скопировать на USB-накопитель с 256 МБ свободного места или какой размер файлов вашей цифровой камеры можно распечатать с разрешением 150 пикселей на дюйм.

Все, что вам нужно сделать, это нажать Ctrl+N (Cmd+N на Mac), чтобы открыть диалоговое окно «Создать», вставить значения и прочитать номер размера изображения или проверить размеры файла. Если ваши файлы будут преобразованы в оттенки серого, выберите «Оттенки серого» в раскрывающемся меню «Цветовой режим» и проверьте число «Размер изображения», чтобы увидеть, насколько уменьшился размер вашего файла.

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

Эту статью можно найти в категории:

• Photoshop ,

Создать фото в фото в фотошопе

Автор сценария Стив Паттерсон.

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

Вот исходное изображение, которое я буду использовать для этого урока:

Оригинальное фото.

И вот над чем мы будем работать на всех этапах:

Окончательный результат.

Этот урок из нашей серии фотоэффектов. Давайте начнем!

Шаг 1. Дублируйте фоновый слой

Когда моя исходная фотография открыта в Photoshop, я вижу в своей палитре слоев, что в настоящее время у меня есть только один слой, фоновый слой:

Палитра слоев Photoshop, показывающая фоновый слой, содержащий исходное изображение.

Первое, что мне нужно сделать, это продублировать фоновый слой , поэтому я воспользуюсь быстрым сочетанием клавиш Ctrl+J (Win) / Command+J (Mac). Теперь у меня есть копия фонового слоя, отображаемая в палитре слоев, которую Photoshop автоматически называет «Слой 1»:

.

Палитра «Слои», показывающая фоновый слой с его копией выше, названной «Слой 1»

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

.

Дважды щелкните имя «Слой 1» и измените имя слоя на «Меньшая версия».

Шаг 2. Создайте новый слой ниже слоя «Меньшая версия»

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

Вот изящный трюк, который я предпочитаю использовать вместо этого, и если вы не знаете о нем, то, как только вы его узнаете, вы будете часто его использовать. Вместо создания нового слоя над текущим выбранным слоем, вы можете указать Photoshop создать его ниже текущего выбранного слоя, удерживая нажатой клавишу Ctrl (Win) / Command (Mac), щелкнув значок New Layer в нижней части палитры слоев, как я сделаю здесь:

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

И теперь, благодаря этой маленькой хитрости, Photoshop создал для меня новый пустой слой прямо под слоем «Меньшая версия»:

Новый слой, снова названный «Слой 1», создан под слоем «Меньшая версия».

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

Дважды щелкните имя нового слоя и переименуйте его в «Обтравочную маску».

Шаг 3. Растяните форму меньшей фотографии с помощью инструмента «Прямоугольник»

Выбрав слой «Обтравочная маска» в палитре «Слои», выберите инструмент «Прямоугольник» либо из палитры инструментов Photoshop, либо нажав U на клавиатуре:

Выберите инструмент «Прямоугольник».

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

Нарисуйте приблизительную форму и расположение уменьшенной версии вокруг вашего объекта.

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

Слой «Обтравочная маска» стал слоем формы.

Шаг 4. Используйте векторную фигуру для создания обтравочной маски

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

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

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

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

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

Шаг 5. Добавьте белую обводку к векторной фигуре, чтобы создать границу меньшей фотографии

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

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

Откроется довольно массивное диалоговое окно Layer Style с параметрами Stroke в средней колонке:

Параметры «Обводка» в диалоговом окне «Стиль слоя».

Здесь мы хотим изменить три параметра, и я обвел их красным на скриншоте выше. Я установил для Stroke Size значение 12px , чтобы создать стандартную рамку вокруг моей маленькой фотографии. В зависимости от размера фотографии, с которой вы работаете, вы можете обнаружить, что другое значение работает лучше. Ниже этого убедитесь, что Позиция установлена ​​на Внутри . Это означает, что наша обводка появится внутри границ фигуры. По умолчанию для параметра «Положение» установлено значение «Снаружи», из-за чего углы обводки выглядят закругленными. Мы хотим, чтобы наши углы были красивыми и острыми, и «Inside» сделает это за нас. Наконец, по умолчанию Photoshop устанавливает красный цвет обводки, что абсолютно бессмысленно, и, очевидно, нам не нужна красная рамка вокруг нашего изображения, поэтому измените обводку Color на white 9.0004, щелкнув образец цвета и выбрав белый из палитры цветов Photoshop .

Вот как выглядит мое изображение с примененной белой обводкой 12 пикселей:

Уменьшенная фотография теперь видна с примененной белой обводкой 10 пикселей.

Пока не выходите из диалогового окна Layer Style. У нас есть еще один стиль слоя, который нужно применить.

Шаг 6. Применение тени

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

Нажмите непосредственно на слова «Тень» в верхней части списка стилей слоя слева.

Это изменяет параметры в среднем столбце диалогового окна «Стиль слоя» с параметров «Обводка» на параметры «Тень». Опустите Непрозрачность тени примерно до 50% , чтобы она не казалась такой темной, затем измените Угол тени на 130° . Наконец, установите Distance примерно на 10 пикселей , хотя вам может понадобиться увеличить это значение, если вы используете изображение большего размера, чем то, которое использую я:

Параметры «Тень» в диалоговом окне «Стиль слоя».

Вот мое изображение с белой обводкой и тенью:

Теперь к фотографии меньшего размера применена белая обводка и тень.

Шаг 7. Используйте «Свободное преобразование» для поворота и/или изменения размера фигуры по мере необходимости

Если вам нужно повернуть, изменить размер или изменить положение векторной фигуры в этот момент, убедитесь, что слой формы выбран в палитре слоев, затем используйте сочетание клавиш Ctrl+T (Win) / Command+T (Mac ), чтобы вызвать поле Photoshop Free Transform и обрабатывать меньшую фотографию.

Чтобы переместить фигуру, щелкните в любом месте поля «Свободное преобразование» и перетащите фигуру в новое место или используйте клавиши со стрелками на клавиатуре, чтобы подтолкнуть ее. Чтобы изменить размер фигуры, щелкните и перетащите любой из маркеров свободного преобразования. Чтобы просто увеличить или уменьшить фигуру, сохраняя при этом те же пропорции ширины и высоты, удерживайте нажатой клавишу Shift при перетаскивании любого из угловых маркеров. Удерживание Alt (Win) / Option (Mac) при перетаскивании приведет к изменению размера фигуры от центра, а не от стороны или угла, противоположного тому, куда вы перетаскиваете. Наконец, чтобы повернуть фигуру, щелкните и перетащите мышь в любое место за пределами поля «Свободное преобразование»:

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

Нажмите Введите (Win) / Верните (Mac), когда вы закончите, чтобы принять преобразование. Вращение фигуры добавляет немного больше волнения к изображению. Я также внес небольшие изменения в размер и положение моей фигуры. На этом наше маленькое обрезанное фото вокруг объекта готово! Далее мы закончим эффект, раскрасив и размыв исходное изображение на фоне.

Мы почти закончили. Вся работа по созданию иллюзии уменьшенной обрезанной фотографии внутри основного изображения завершена, и теперь осталось немного поработать над исходным изображением на заднем плане. Есть все виды вещей, которые вы могли бы сделать с ним. Технически вы можете оставить его в покое и быть довольным тем, что у вас есть на данный момент, но теперь, когда мы увеличили фокус на главном объекте, идея состоит в том, чтобы уменьшить фокус на остальной части изображения, которое находится на заднем плане. Вы можете обесцветить его и сделать черно-белым. Вы можете добавить простой фильтр Gaussian Blur, чтобы размыть фон. Вы можете использовать Уровни или Кривые, чтобы осветлить фон и придать ему «размытый» вид. Есть много вариантов, и вам, конечно же, не нужно делать то, что я собираюсь сделать здесь, то есть раскрашивать его и добавлять эффект радиального размытия, но если вы хотите, чтобы ваш фон выглядел так же, вот как вы это сделаете. сделай это.

Шаг 8. Используйте инструмент «Пипетка», чтобы взять образец цвета внутри меньшей области фотографии

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

.

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

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

Проба цвета со шлема.

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

.

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

Шаг 9. Раскрасьте фон с помощью корректирующего слоя оттенка/насыщенности

Щелкните фоновый слой в палитре слоев, чтобы выбрать его. Затем щелкните значок New Adjustment Layer в нижней части палитры и выберите Hue/Saturation из списка:

Щелкните значок «Новый корректирующий слой» в нижней части палитры «Слои» и выберите «Цветовой тон/Насыщенность».

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

Выберите параметр «Раскрасить» в диалоговом окне «Цветовой тон/Насыщенность».

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

.

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

Шаг 10. Дублируйте фоновый слой еще раз

Прежде чем мы начнем применять радиальное размытие, давайте продублируем фоновый слой еще раз, чтобы у нас был отдельный слой для применения фильтра, поскольку мы никогда не хотим касаться исходной информации о пикселях нашего изображения на фоновом слое. Выберите фоновый слой в палитре слоев, затем нажмите Ctrl+J (Win) / Command+J (Mac), чтобы продублировать его. Дважды щелкните имя нового слоя и переименуйте его в «Радиальное размытие:

».

Еще раз продублируйте фоновый слой и переименуйте его в «Радиальное размытие».

Шаг 11. Примените фильтр радиального размытия к новому слою

С новым слоем «Радиальное размытие», выбранным в палитре «Слои», перейдите к меню «Фильтр» в верхней части экрана, выберите «Размытие », а затем выберите «Радиальное размытие 9».0004, который вызывает диалоговое окно «Радиальное размытие». Сначала установите Blur Method на Zoom , затем установите Quality на Best . Опция Amount в верхней части определяет степень размытия, которую вы получите. Я собираюсь установить свой на 40 , но вы можете использовать другое значение. Параметр Blur Center в правом нижнем углу диалогового окна определяет, откуда на изображении будет происходить размытие. Попробуйте расположить центр размытия ближе к тому месту, где находится объект на фотографии, щелкнув примерное место в поле «Центр размытия». Это не самая точная вещь в мире, и вам понадобится пара попыток, прежде чем вы сделаете это правильно, поэтому не бойтесь отменить фильтр с помощью 9.0156 Ctrl+Z (Win) / Command+Z (Mac) и повторите попытку, если сначала не получилось:

Фильтр > Размытие > Радиальное размытие, чтобы открыть диалоговое окно Радиальное размытие. Измените параметры, обведенные красным.

Когда закончите, нажмите OK, чтобы выйти из диалогового окна и применить радиальное размытие к изображению:

Изображение с примененным фильтром «Радиальное размытие».

Шаг 12. Уменьшите непрозрачность слоя радиального размытия

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