(techno music)
- [Instructor] Hello and welcome to this video tutorial.
Gareth here from tastytuts.com.
In Photoshop, once a project is complete,
there are a wide range of formats
you can save your image out to.
It all comes down to what the image will be used for.
In this tutorial, I'm going to discuss
the process of saving.
I'll be talking about some of the things
we need to consider and then save out
a couple of common formats.
By the end of this tutorial,
you will have a good understanding
of how to save images in Photoshop.
So to follow along with this video,
you will need to open this document
I have prepared especially for this tutorial.
This document can be found
in the essential practice folder in the project folder.
Now you can download this project folder for free,
the download link is in the description.
So with the project folder open,
click ESSENTIAL PRACTICE, open the SAVING folder
and open SAVING.psd.
And then you should have something that looks like this.
So this is a document I have prepared earlier.
If we look in the layers panel,
we can see that this document consists
of a few layers with various effects applied.
We have a gradient later casting an overlay blending mode
onto the blue base layer.
We have the shadow layer with a multiplying blending mode.
We have the bird layer which is a raster layer
and this has a hue and saturation adjustment layer
on top with a mask applied.
So a few things going on here,
typical of an average Photoshop document.
So currently, this is a .psd document, a Photoshop document;
this being a document that has been created in Photoshop
with all the layer data and effects saved.
Now should we wish to save this as an image
we want to send to print, share on social media
or send to someone who does not have Photoshop to open,
we will need to save it into a format that is suitable.
So first, we are going to save this
into one of the common image file formats, a jpeg.
The jpeg is a file format that makes up
most of the images you see on the web
and are also used in desktop publishing programs
to create print layouts.
Once the image is complete in Photoshop
and you're ready to save,
you can come to File, scroll down and select Save As.
Upon click, we will see the Save As menu
where will need to choose a location
on the computer to save to.
So in this instance, I'm going to navigate
to the PROJECT folder, the ESSENTIAL PRACTICE folder,
SAVING, and I'm going to save it in here.
Now, what we need to pay attention to here
is the Format option.
This can be located down at the bottom of the menu.
Now by default, this will be set to Photoshop.
Now if we click on this tab,
we will see a wide range of file formats
for us to choose from.
So on this occasion, I'm going to choose JPEG.
Up in the Save As, I can change the name,
though I'll just leave it as the current name
and click Save.
Next, up will pop a JPEG Options menu.
This is where you can toggle compression of your image.
By toggling the quality,
you will be able to control the data size of your image.
Notice just under Preview
we can see an estimated file size.
As I toggle the quality down, this will change.
On this occasion, I will set the quality to eight
and click OK.
Upon save, we will simply come back into the document.
Now if we navigate to the project folder
we just saved the image to,
here we can see a new jpeg file inside.
Now this image is ready to be sent via email,
uploaded to social media or used on a website.
Simple.
So if I open this up with Photoshop,
this is now a single raster layer
and all the effects have been flattened.
Great.
Now it's important to keep in mind
the bigger the dimension, the larger in general
the image data file will be.
As a jpeg is essentially a raster image
made of pixels, the more pixels making up the image
with more unique shades of color,
the more data will be saved inside the file;
thus making it a larger data file.
So it's important to consider the dimensions
of an image as well.
For example, if I press and hold cmd + alt and press I,
we will now see the dimensions of the image.
Currently we can see that this image is 1757
by 1218 pixels at a resolution of 300 dpi.
Now this is rather large.
If you're using an image for print,
then it's best to keep the image as large as possible
to maintain quality.
But if you intend to share an image over social media,
you could think about making the dimensions smaller
to optimize the data file.
For example, I'll change the resolution here
from 300 to 72 and I'll change the width dimension
to 800 pixels.
I'll make sure my constrain aspect ratio link is applied,
and click OK.
So now my image is substantially smaller
but still big enough to see and appreciate the image.
Now if I would like to keep the image
at the new, smaller dimension,
I can simply press cmd + S, the shortcut for save.
By pressing cmd + S, this will save the document.
So now if I close the image,
the image data size will be smaller.
In theory this image now contains fewer pixels
and fewer unique shades of color,
thus making it a smaller data file.
This file will be easier to send over email
or share over social media.
So I'll close the document
and come back the Photoshop document.
Okay, so this time I'm going to try something different.
In the layers panel,
I'm going to toggle the visibility of the gradient layer,
the blue base layer and the background layer.
So now we have the bird character
on a transparent background,
and we know this because we can see
the gray and white grid texture in the background.
So now I'm going to save this image
that will maintain the transparency in the background.
So I'll come up to File, come down to Save As.
This time, I'm going to click on Format
and this time choose PNG from the option menu.
Now PNG enables us to save the transparency.
So with the format set to PNG,
I'll simple click Save.
On the pop-up PNG Options, I'll just click OK.
The file will be saved
and we are back to the Photoshop document.
So if we now come back to the project folder,
we can see that we have a new file with the .png extension.
So if I open this image in Photoshop,
we can see that it's now a single layer
and we have the transparency around it.
So this image will be good to use on the web
or in other programs like video software
as it will maintain the transparency around.
Now we could also consider resizing the image here too,
like we did previously with the jpeg.
If we intend on using this for web,
then we could consider making it smaller
to the correct dimensions and optimized for web.
If we intend on using this for video,
then we may wish to keep this large
to maintain maximum quality.
So on this occasion, I'll just keep it as it is
and close the tab.
So that's how you can save an image
from a complex Photoshop document
into a jpeg that can be shared on social media,
or saved to maintain transparency to be used for the web
or in video programs.
Now it's important to mention
that if we want to save images specifically for the web,
there is a feature available to us in Photoshop
to further refine and optimize our data files.
Later in the course, I will be discussing
the Save for Web feature and demonstrating exactly
how to use it.
So this brings us to the end
of the essential practice section of this course.
It is now time to take all the skills
and knowledge we have learnt in the previous videos
and apply them to a real project.
In the next video, we will be moving into
the create a project section of the course,
where we will be learning how to set up
a new document ready for our project.
See you in the next video.
(techno music)