{HOW TO} Make Parts of an Image Transparent

koalakinzforever · 08-31-2009, 05:03 PM

Have you ever wondered how to make parts of an image transparent?

Do you want to learn to make pictures that look like this?

Well, with this guide that is complete with pictures, I can teach you how!

Now, there is more than one way to do this, so there will be more than one guide.

Different Ways To Use Transparency

Use transparency on Adobe Photoshop (Scroll Down)
Use transparency on Photobucket or Tinypic (Post #5)
Use transparency on Microsoft Paint (Post #20)

Okay, now on with the guides!

How To Use Transparency On Adobe Photoshop

You may or may not have this program installed on your computer. Some computers come with it, but otherwise, you have to buy it. However, I think you can download a free 30 day trial online somewhere.

I use Adobe Photoshop CS2, but all of the versions are very similar, so no matter what version you may have, it will work the same as it does in this guide.

Step 1:
Choose a picture that you want to edit, and open it up in Photoshop. I chose a picture of my lil' golden retriever, Guy-Renaud.

Step 2:
Go over to your toolbar on the side. See that little eraser? Click and hold down on it until some other tools pop up. Select the "Magic Eraser" tool.

Step 3:
You might want to zoom in on the image, so you can do that with the magnifying glass tool. Then, go back to the magic eraser. Start clicking on parts of the picture that you want to erase. Careful that you don't erase any of the part that you want to keep. If you do, you can click Edit - Undo magic eraser tool up at the top of the screen. If you can no longer click on parts of the image without erasing the part you want to keep, move on to the next step.

Step 4:
You can skip steps four, five, and six if everything that you want to erase has already been erased. If there is still some stuff left, then you need to follow this step. Go over to your toolbar again. Do you see that little lasso? Click and hold down on it until you see some other tools pop up. The easiest way to do this is to use the polygonal lasso tool, but if you want to face the difficult regular lasso, then go ahead.

Step 5:
Use the polygonal lasso (or lasso) to select the general area that you want to erase. Make sure that you don't get any of the parts that you want to keep inside the selected area.

Step 6:
After you have selected the general area that you want to erase, select the eraser tool. Erase everything that is inside the lasso. Don't worry if your eraser goes outside of the selected area, because when an area is lassoed, you can't erase anything outside of it.

Step 7:
You should end up with something like this:

See all that extra space around Guy-Renaud? Well, there is no need for all that space, so go over to the toolbar and select the crop tool.

Step 8:
Use the crop tool to select the area you want to keep, and then press the enter key on your keyboard.

Step 9:
You should end up with something like this:

If you are satisfied with it, save it as a PNG!! If you save it as anything else, it will not be transparent. If you are not yet satisfied with the result you may have to go back and repeat some steps before you save it.

Step 10:
You should end up with something that looks like this:

Viola! You did it!

If you have any questions, feel free to ask.

~*KKF*~

P.S. - More transparency guides coming soon...

dotdotduck · 08-31-2009, 05:06 PM

Great guide, thanks!

I didn't know that you could do it on TinyPic or Photobucket...

There's also a very easy way to do it in Paint Shop Pro, it's very similar to Photoshop, and you can also use the "Trasparent" tab under "Edit" at lunapic.com.

koalakinzforever · 08-31-2009, 05:09 PM

Originally Posted by dotdotduck

Great guide, thanks!

I didn't know that you could do it on TinyPic or Photobucket...

There's also a very easy way to do it in Paint Shop Pro, it's very similar to Photoshop, and you can also use the "Trasparent" tab under "Edit" at lunapic.com.

Yes, it is possible to do that on photobucket or tinypic.
And I have seen images on Paint Shop Pro, and it IS very similar.
Also, I have seen the transparent tab on lunapic, so I may use that in a guide in the future. =]

Perrypinkster · 08-31-2009, 05:12 PM

Great Guide! I subscribed to this thread!

koalakinzforever · 08-31-2009, 05:38 PM

How To Use Transparency on Photobucket or Tinypic

This guide shows the picture being edited on Photobucket, but the editor on Tinypic is exactly the same - I checked.

Before you start, make sure that the image you are about to edit is saved as a PNG.

Step 1:
Go to either photobucket.com or tinypic.com and upload a picture that you want to have transparent parts. Then click on "EDIT" above the picture on photobucket, or click "EDIT" beside/below the picture on tinypic, and you should end up on a screen that looks like this:

Step 2:
I realize that there are a whole bunch of fun tabs that you are probably just dying to click, but you only need to click on the one that says "Geek."

Step 3:
You should see a whole bunch of fun buttons that would be even more fun to click on, but you only need to click on the one that says "Smart Cutout."

Step 4:
See these two buttons? Start out by clicking on the one that says "Keep." But don't worry, you will get to press the delete button shortly!

Step 5:
After selecting the keep button, colour over the parts of the image that you want to keep. As you can see, I ended up with a snot green tiger. After you have coloured everything you want to keep, press the delete button and colour over everything you wish to get rid of.

Step 6:
Click the big shiny button that says "Predict Unknown Areas."

If you aren't satisfied for whatever reason, you can repeat steps 4-6.

Step 7:
Once you are satisfied, click "OK" at the bottom of that screen that you just edited the picture on, and then you will be taken back to the main editing screen, and you should have a picture that looks like this:

Click "Save a Copy" at the bottom of the editing screen if you are happy with how the picture turned out.

Step 8:
You should end up with something that looks like this:

The background should be transparent if the image was originally saved as a PNG...this one wasn't, so it turned out white.

OR

There is another way...

Make sure that your image is saved as a PNG, click on the "Decorate" tab, click on the "eraser" button, erase all that you wish to be transparent, click "save a copy" and you should end up with this: