Site Search:

Build a Doll

First, you'll need to build a doll. I can't tell you how to do this, because the process varies at every doll-maker site you go to.

I really recommend TheDollPalace because they give you a lot of options for saving the final image you make, including fully transparent .png's (so you don't have to take a screenshot and then remove a lot of background crap). There's hundreds of sites out there though - just run a Google search (you can do that right from this site) for "Doll-Maker" and you'll have more results than you know what to do with.

When you've built and saved your doll, open it in Photoshop. If it has a background, you'll need to remove the background. I'm using this fairy doll that I built at TheDollPalace.

Set-Up & Zoom

The first thing we're going to do is make it look like our doll is blinking. This is super-easy, and will look cool once we're done.

First, create a new layer (Layer, New, Layer). If you go to create a new layer and can't, don't panic. You need to make sure your image is in RGB mode. Click "Image", choose "Mode" and click "RGB".

Then, set your foreground color to the same color as your doll's skin by using the color dropper tool. Zoom in on your image so that you can clearly see the pixels.

Make Half-Closed Eyes

Now, this step is easy - but slow, depending on what kind of hair is in the way. You need to grab your brush tool and set it to a basic round brush at 1 to 3 pixels in size. Then, on your new layer, paint over the eyes so that they look half-way closed.

Duplicate & Paint

Duplicate the layer you just painted (Right-click and choose "Duplicate Layer". Now, paint over the rest of the eye on this duplicated layer.

When you're finished with this step, you should have 3 layers: The base (background) layer, eyelids 1/2 closed, and eyelids fully closed.

Zoom Out

Go ahead and zoom back out to normal size (100%).

Paint Stars

For this step, you'll need a set of star brushes. Photoshop has a default set of Assorted Brushes that you can use, or you can download the set I'm using here.

Make a new layer (Layer, New, Layer). Using a smaller star brush and white as your foreground color, place several stars on your canvas. I've added a background - temporarily - to show the stars.

Smaller Stars

One more new layer (Layer, New, Layer). What we want now are stars in the same position as our originals, but smaller.

To do this, just click your brush in the same position as one of your stars. Then, click "Edit", choose "Transform" and click "Free Transform". Hold the shift key down on your keyboard and pull the star in, making it smaller.

Then, duplicate the smaller star and move the duplicated layer into place over your remaining stars. Merge the smaller star layers on to one layer (right-click and choose "Merge Down").

You should now have 5 layers: The base (background) layer, eyes half closed, eyes fully closed, stars large, and stars small.

Duplicate & Rotate

This is our last step before animating. As it is, this will look cool - but there won't be any variety to the sparkling stars. We're going to fix that.

First, duplicate your large stars layer. Then, click "Edit", "Transform", and choose "Rotate 90 CCW". This will place your large stars in a new formation. You might need to move them a little bit.

Do the same thing with your small stars and match them up with the large stars.

When all your stars are made, merge them so that your first large stars are on the same layer as your second SMALL stars. Then your second large stars go with your first SMALL stars.

Save!

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

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.

The Animation Window

The first thing you need to get acquainted with in ImageReady is the Animation Window. If you don't see the animation window, click "Window" and choose "Animation".

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.

Duplicate Frame

We have basically two layers that will "play" in our animation - eyes half-closed with one set of stars, and eyes fully-closed with the second set of stars, so we need two more frames to put those layers on.

To get the frames, click the "Duplicate" button two times and your animation window should look like this:

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 and 4 visible. Move on like this, removing the background from every frame.

Play, Time, and Save

You can hit the play button now, to see if you've matched up the layers to the frames.

Once you've got the layers animating in the right order, you can change how long each one "shows". I have set the first and 3rd layers to 1 second.

You should see an animation that looks like this one - note that my sparkles barely show up, because I have used a white background. You might want to adjust that.: