Thursday, November 5, 2015

Glitter Text



This tutorial will show you how to make animated glitter text with a transparent background.

You will need an animated glitter file to work with for this. You can make your own, if you like, or you can download one from the net. I'm using this one for the tutorial:


If you want to use the one above, save the glitter file to your computer then open it in Image Ready to separate the layers.

Transfer the layers to Photoshop. Once in Photoshop, click EDIT > DEFINE PATTERN. That will set the visible layer as a pattern for your BUCKET tool. Select each layer of the glitter file and set it as a PATTERN by repeating the DEFINE PATTERN process. Once you have all three layers of the glitter set as patterns you are ready to begin. Basically any glitter file will work though some glitter files have a lot more animation frames than the three this one has.
You can now close the glitter file animation as you no longer need it.

In Photoshop, open up a new transparent file. In this example, I started with a 500x200 image. That just gives you extra space to decide what size text you want to add.

Add text and make sure that Anti Alias is set to none .






Best to choose a font that has some thickness to it. You can see the animation in it better than a thin font.

Now DUPLICATE your text layer.


RIGHT CLICK on your first text layer and select RASTERIZE.

Hold CTRL (Control key) and left click on the now rasterized text layer. This selects the text in that layer.

Go to SELECT > MODIFY > EXPAND and select 2. (Two is the number I chose to be the stroke around the text.)


Your image should then look something like this:


Take the paint brush and go over the selection with whatever color you want to be your stroke color. For this example, I used black.

Hold CTRL (Control key) and left click on the duplicated text layer. Create new layer.

At this point you want to select the color that you want your text to be. For me, I chose a gradient. If you just want to choose a solid color then take the bucket tool and fill it with the color of your choice. Or use the gradient tool and fill the selection with a gradient.


Now HIDE the layer you just added color to.

With the selection still active, go back to your DUPLICATED TEXT later and create a new layer above it.

Select the BUCKET tool and switch to PATTERN FILL. From the pattern window select the first of the three glitter frames. Fill the select with glitter.
Create new layer, change to the second glitter frame in the Pattern Fill window and fill the selection. Repeat once more for the third glitter frame, being sure to select the third glitter frame in the Pattern Fill window.


Now, click on the color layer that you hid earlier and change the blend mode to what you like best. For this I changed it to COLOR.


You can now do one of two things. You can use the selection tool and crop out your text to remove excess space OR you can CTRL + click on your first layer (the layer which you expanded the text) and then click IMAGE > CROP.


Now, before we send what you have to Image Ready, go back to your layers and HIDE the second and third glitter layer. Leave only glitter layer 1 visible.


Jump to ImageReady


 Duplicate the animation frame two times, so that you have a total of three frames of animation.


Click on the SECOND frame of animation then go over the layer palette and make glitter layer #2 visible. Then click on the THIRD animation frame and then make glitter layer #3 visible.


 You can play the animation to see if it looks good to you. If it's too fast, you can change the speed. From my experience though, the speed of the animation when tested in ImageReady isn't always the speed it appears once saved. So you may have to save it, test it outside of ImageReady and then make changes if necessary.


 Then go to FILE > SAVE OPTIMIZED AS. It should want to save the file as a GIF. If not, then you need to check that the OPTIMIZE window has GIF selected as the output type.


That's it!




No comments:

Post a Comment