How to make a gif with a transparent background!!
ok i’m assuming you know how to make gifs i will not be explaining that
anyway i’m bad at explaining stuff and there’s probably an easier way to do this but ye ah:
1. Make your gif, add the psd, etc, etc.
2. Now, a regular gif should be either 500px, 245px, or 160px wide to go on tumblr. The point of this is to make a gif that is smaller than those dimensions, obviously. Here, I’m gonna start with a 245px gif and make it smaller (i chose 235 x 235 pixels) Crop your gif and resize it to whatever dimensions you’re starting with.
3. Now, you need to change the canvas size to make the background transparent. Go to image > canvas size and set that to 245x245 pixels.
The result of cropping it should look something like this:
As you can see, the gif has the checkerboard pattern around it which means the background is transparent.
4. You’d think this would be the end of the tutorial, but obviously if you can see from that screenshot, any .psd you have put over the first gif will show over the top of the transparent background. This is a problem. (unless you want that, in which case you’re done. leave)
The answer to this is Layer Masks!! yaaay.I love layer masks. If you’ve never used them they’re pretty confusing at first (google it to understand them better) but I will try to explain how to use them to get rid of the background.
To make this way easier, put all your adjustment layers into one folder by clicking that little folder icon thingy at the bottom of the layers window.
Drag all your adjustment layers into this folder. Ta-daa! (I had already done this)
5. Highlight your folder with your adjustment layers and go to Layer > Layer Mask > Reveal All. A weird white box should appear next to the layers folder. Make sure it has the little lines around it, because that means it’s highlighted.
6. For this next part, you might need to zoom in a whole lot on your gif. Basically, you just need to find the edge of the gif and use the Rectangular Marquee Tool to draw around it.
Do not be afraid to zoom in! YOu need to find the exact pixels where the gif ends so you can be precise!!!!
Ex: this is the same gif zoomed to 1200% to get the border correct.
7. (ALMOST DONE)
Should look like this.
Go to Select > Inverse. Should look like this now.
8. Ok now take your paint bucket tool. Make sure you’re once again clicked on the weird little white window (aka the Layer Mask) and Paint the selected area black.
Should look like this!!
That’s it!! omg we’re done!!
9. save your gif, etc etc
here’s my finished product. drag it to make sure it’s transparent. i could’ve fucked up, you never know.