Easy-to-follow video tutorials help you learn software, creative, and business skills.Become a member
I'm still working inside Desaturated shadows.psd, found inside the 12_for_Web folder. During the previous exercise I can just imagine a few of you might have been thinking, well, if you really want to protect your original file with all of its layers, and you don't want to goof it up, shouldn't you duplicate the image before you flatten it? You know what? That's an awesome idea. That's what we're going to do. So going over to the History icon and click on it, and then I want you to click on this first icon once again, Create new document from current state if you have your tips turned on.
Now that I have a duplicate image and my original image is protected, I can edit it to any degree I want to. I'll go ahead and hide my History panel. I'll go up to the layer menu and choose Flatten Image or press Ctrl+Shif+Alt+F, Command+Shift+Option+F on the Mac. Now we have a flat version of the file. I'll go to the Image menu and choose the Image Size command or press Ctrl+Alt+I, or Command+Option+I on the Mac. At this point, I want to go ahead and enter 1770. Notice the Height will automatically drop-down to 780, assuming of course, that Resample Image and Constrain Proportions are turned on.
What I prefer to do is to create my larger graphic first and then downsample it to achieve the smaller graphics. So in other words, I'm going to be downsampling incrementally. By the way, if you do the math here, you'll see that these dimensions are three times the dimensions of the very smallest graphic of the 590x260 graphic. So we're starting with the 4x file. We're going down to a 3x file and then we'll drop down to the 1x file. By downsampling incrementally, you can frequently achieve smoother results and retain more detail inside of your images.
Often times when you go from a very large file down to a very small file, you end up interpolating a lot of detail away. So you might want to give incremental downsampling a try. Now when I'm going down to this 3x graphic, I won't necessarily apply the sharper algorithm. I'll usually just leave it set to Bicubic (best for smooth gradient) because I've already done the sharpening work I need to in advance. We'll discuss that when we get to sharpening in a later chapter. So I'll go ahead and click OK in order to create the first version of the image, the larger image. I might zoom into, just so that we can see it in more detail.
Now having done that I'll bring up the History panel again, and click on the little Duplicate icon. Hide the History panel of course. Zoom in. The image has already flattened this time around, so I don't need to apply anymore flattening. Then I'll go up to the Image menu. I'll choose the Image Size command, Ctrl+Alt+I, Command+Option+I on the Mac. I'll change the Dimensions to 590. Drop down to the Interpolation. Change it to Bicubic Sharper. Then click okay in order to generate the smaller version of that image. That's how I created the two downsampled versions of the image, the larger one here and the very small main Web page graphic.
In the next exercise, we're going to take this image, the small one and we're going to add the text, the bar and the stroke.
Get unlimited access to all courses for just $25/month.Become a member
120 Video lessons · 58410 Viewers
119 Video lessons · 67638 Viewers
84 Video lessons · 16911 Viewers
125 Video lessons · 29811 Viewers
Access exercise files from a button right under the course name.
Search within course videos and transcripts, and jump right to the results.
Remove icons showing you already watched videos if you want to start over.
Make the video wide, narrow, full-screen, or pop the player out of the page into its own window.
Click on text in the transcript to jump to that spot in the video. As the video plays, the relevant spot in the transcript will be highlighted.