photoshop: tips and tricks for working with images that are too small
DESCRIPTION
Whether you’re working on a blog post, newsletter, website design or flyer, finding the perfect photo for your project can be a challenge. What’s more challenging is finding the perfect photo only to have it be too small to use. Making the image larger won’t solve the issue. The photo will lose quality when it’s expanded. However, there are a couple creative tips and tricks we can use in to resize small images in Photoshop and make up the extra pixels. Read more at http://www.webascender.com/Blog/ID/515/Photoshop-Tips-and-tricks-for-working-with-images-that-are-too-smallTRANSCRIPT
Photoshop: Tips & tricks for
working with images that are too small
Corrine Soave, Web [email protected]
Whether you’re working on a blog post, newsletter, website design, or flyer, finding the perfect photo for your project can be a challenge. What’s more challenging is finding the perfect photo only to have it be too small to use.
Making the image larger won’t solve the issue. The photo will lose quality when it’s expanded. However, there are a couple creative tips and tricks we can use in Photoshop to make up the extra pixels.
Blur the Background
In this example I use a web design layout in Photoshop but the ideas can be applied to any kind of project. Many times when we’re working on a website design we’ll find images that would be perfect to use but the image is too small to fit in the designated space.
Let’s say I have a layout for a website that uses a full width image that’s 920 pixels by 345.
I’ve found the perfect image to use, but it doesn’t quite make the cut when it comes to size.
There’s enough height, but not nearly enough width. What I’ll do first is right click on my dog
photo layer and duplicate the layer.
Next, I’ll select the bottom layer (the original layer) and use the transform tool to increase the size. I’ll make it just large enough to cover the
needed space.
As you can see, increasing the image drastically reduced the quality. In this instance that’s ok because we’re going to make it blurry, anyway. With the layer
selected I want to go to “Filter > Blur > Gaussian Blur”
I’ll bump up the blur radius until I’m happy with how it looks.
Next, I’ll clean up around the top layer so it blends with the background. Then I’ll add an image mask to the layer and use the erase tool with a soft edge
just to get rid of the hard sides of the image.
Now that I’ve got the edges cleaned up, I’ll crop out the extra space so the image fits nicely in our
920x345 space. Above you see the final result.
Copy or Extend the Background
Another technique we can use to increase the size of our image is to duplicate the background. This works
well with the image we have since the grassy background will make it easy to hide any seams.
The first step will be to copy the layer and flip the layer horizontally using the transform tool.
Then I moved the image all the way over until it was edge to edge with the old image. Because we
flipped the image horizontally, the image is perfectly reflected and lines up with the original
image.
I can crop the image to be the size I need. However, I still have some of the reflected dog in the photo, and I want to clean up the seam of the
reflected line.
I’ll use the stamp tool to fix the seam and get rid of the extra dog. If you’ve never used the stamp tool, it takes some getting used to but it’s great for fixing images like this. Essentially what it does is duplicates a small section of the image and copies it onto another. I’ll go more into depth with the stamp tool on the next slide.
With the stamp tool selected, I’ll take a sample of grass near the seam by holding down alt and clicking. This is what we’ve “copied.” We can then hover over the seam we need to cover, click, and “paste” the copied section over the part we’re trying to cover. I’ll repeat this step a few more times until I get the seam cleaned up and the extra dog covered. In the end, we’re left with a seamless photo of a dog lying in the grass.
Adding a Gradient Overlay
Another way to make an image look bigger is to add a gradient overlay.
First, I’ll create a new layer the exact size the image needs to be, 920x345, and place it over the
original dog image.
Next, I’ll change the “Fill” of the layer to 0. Then I’ll double click my layer and add a Gradient Overlay. I’m going to
change the angle of the gradient so it goes left to right by changing the angle from 90 to 0.
I’m going to change the colors of the gradient to be a green similar to the color of the grass.
Next, I’ll change the opacity of the first slide color to 0.
I can use the sliders to adjust where my gradient starts and ends to cover the edge of the dog photo and create
a seamless blend.
Graphic Elements and Text
If all else fails, getting creative with graphic elements and text can help make up for the
lacking image size
In the example above I created a diamond pattern to imitate the grass with the Photoshop shape tool and placed the shapes over my dog image. Then I grouped the shapes and added an image mask to the group so I could use the erase tool to fade the pattern into the dog image. Once I had everything blending together I added my text and created a new box to outline the type.
Just because an image is too small in it's original state doesn't mean it's completely useless. With a little creativity and Photoshop knowledge, almost
any image can be implemented in a design.
Corrine Soave, Web [email protected]