My-Photoshop.com Free Photoshop Tutorials Free Photoshop Videos Free Photoshop Downloads Photoshop Store Contact Us

Glitter Text Effect

Final Glitter Text

On forums and different home page sites around the 'net, one of the most popular effects is glitter text - the sparkling, shimmering, shiney text that just stands out and grabs some attention. There are a couple of glitter text generators available online, but you will never be able to truly get what you want until you make it yourself. And who likes advertising someone else's site for free anyways?

So, here we go - quick and easy, glitter text that's designed in Photoshop and animated in ImageReady.

Glitter Text : The Photoshop Steps

1

Step One: New Canvas

open a new canvas (File, New or Ctrl+N). The one I'm working with is sized at 400 x 250 pixels, with a white background.

 
2

Step Two: Text

Create a new canvas and write your text on it. While you're following the tutorial, go for a thick, fat font because it will make it easier to see how the effect works. The glitter effect will work just as well on a thinner, stylish font - but it makes it harder to see how the end result happens. I'm using the free font "Should've Known".

Text
3

Step Three: Text Color

If you did like me and just typed your text out in any old color at all, change the text color now. I've chosen to use #09a7a7. This will affect the color of your glitter in the next step.

 
4

Step Four: Noise Filter

First, rasterize your type layer by right-clicking it in your Layers Palette and choose "Rasterize Type". Then, duplicate the layer three times.

Now, click on your first text layer and go to "Filters" in the toolbar. Choose "Noise" and click "Add Noise". Apply the settings below:

Illustration 04: Noise Filter
Noise Filter
5

Step Five: Repeat

Now that you know how to make the basic glitter, go on to your next 3 text layers and perform step 4 again.

Each time that you perform the noise filter, though, add 1 percent to the "Amount" of noise. So on the second text layer, you will add 26% and so on.

Repeat
6

Step Six: Outline Glitter

This step is optional, but it will make your finished text look much nicer.

Select your first text layer and apply the following settings in your Layer Styles (the little "f" icon at the bottom left of your Layers Palette).

Once you've applied the styles, right-click the layer that you just worked with and choose "Copy Layer Style". Then, go to each of your remaining text layers and right-click, choosing "Paste Layer Style". Easy-Peasy!

Illustration 06: Optional Outline
Optional Outline

Glitter Text : The Image Ready Steps

1

Step One: Save!

If you haven't saved your work yet, definitely do so now. It will save you a lot of frustration.

 
2

Step Two: Export to ImageReady

Click "File" and choose "Edit in ImageReady". Photoshop will open ImageReady for you, and begin moving the file over with all its layers and layer styles intact so that you can animate them.

 
3

Step Three: The Animation Window

The first thing you need to get acquainted with in ImageReady is the Animation Window.

Loop Settings: This setting lets you make the animation loop on and on without stopping, or to play the animation once and quit running.

Play Buttons: You can preview the animation using these buttons, just like a media player.

Tween: This is a more advanced button, which basically lets you make transitions from one image to the next smoothly.

Duplicate: An important button - you'll use this one often to make more "Frames". Each "frame" is a step in the animation.

Delete: When you make too many frames, you can select the frame you don't need and click the delete button to completely get rid of it.

Illustration 07: Animation Window
Animation Window
4

Step Four: Duplicate Frame

We have four layers of text that will "play" in our animation, so we need four frames to put those layers on. To get four frames, click the "Duplicate" button three times and your animation window should look like this:

Illustration 08: Duplicate Frame
Duplicate Frame
5

Step Five: Match Frame to Layer

The way that frames work is tied directly to layers. Whatever layer you have "visible" with the little eye icon is the layer that will show up on a frame.

So ... click on Frame 1 and make only Layer 1 Visible. Then, click on Frame 2 and make only Layer 2 visible. Move on like this, removing the background from every frame. Your final animation window should look like this:

Illustration 09: Match Frame to Layer
Match Frame to Layer
6

Step Six: Play & Save

You can hit the play button now, to see if you've matched up the layers to the frames. You should see an animation that looks like the one at the top of our tutorial.

If your glitter doesn't look right, go back through each frame and make sure that it is showing the right layer.

Once you have it set, click "File" and choose "Save Optimized As". You're done!

 

Partner Sites

Lolaness Design FairyThreads.com IMVU 3D Chat

 

Website Design and Contents are Copyright ©2007 to lolaness, All Rights Reserved | Privacy Policy | User Agreement

Photoshop® is copyright to Adobe. We are NOT affiliated with Adobe in any way.