Как сохранить картинки из PSD макета

Всем привет! Сегодня мы научим вас сохранять изображения из PSD макета. Любой веб-дизайнер или верстальщик обязан уметь делать это быстро и без каких-либо затруднений. Рассмотрим способ экспортирования всех необходимых картинок из PSD макета, а также способ сохранения отдельных изображений с помощью кадрирования. Начнем!

Быстрый экспорт всех нужных изображений из PSD макета

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

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

2. Наша задача сохранить картинку фона, имеющую формат .jpg. Необходимо к названию фона добавить название формата фото, просто переименовав слой. Например, хххх.jpg как показано на скрине:

3. После, нам нужно зайти во вкладку «Набор изображений». Она находится Файл → Генерировать → Набор изображений. На скрине показано наглядно:

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

5. После мы просто нажимаем сочетание клавиш Ctrl + S (быстрое сохранение) и в папке, где сохранен наш макет, вы увидите папку с картинками, которые будут откадрированы, и готовы к верстке:

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

Сохранение отдельного изображения из PSD макета

Данный способ позволит вытащить из PSD отдельную картинку. Для примера мы возьмем макет из первого способа.

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

2. Теперь нам необходимо просто кликнуть по нужному слою, и он будет выбран в панели слоев:

3. После нам нужно отключить все слои, кроме слоя с нужной картинкой. Чтобы не отключать каждый слой отдельно, нужно зажать клавишу Alt и кликнуть по «Глазу» слоя который необходимо оставить видимым. Таким образом будут отключены все слои, кроме того, который мы сохраняем:

4. После зажимаем клавишу Ctrl и кликаем по миниатюре слоя:

5. Дальше нам остается кадрировать картинку с помощью функции, которая находится по пути Изображение → Кадрировать:

6. Теперь наше изображение кадрировано, и его можно сохранять.

Вот мы с вами и освоили быстрые и удобные методы сохранения всех изображений в PSD макете и индивидуально каждое изображение отдельно.