Enter subhead content here
I'm going to go over making an animated icon for your catalog images using Photoshop CS2.
When Your project is completed and your previewer is open this is where we are going to begin.
step1. With your finish product completed and your previewer open were going to grab the corner of the 3d previewer by left
clicking the corner and dragging it out.
we want to show different angles of your product so be sure to rotate in the 3d previewer for the desired image you want for
your animated Icon.
take one snap shot by hitting the print scrn button and open your photoshop CS2 program.
click on file then click on new. as you see here my screen size is already set for the new project because i pressed the print
with our new project open we are now going to paste the image.
click on edit then paste.
As you can see our desktop image is now pasted in our new project. Next were going to crop the image.
select the rectangular marquee tool
And delete the background layer theres really no need for it at this time. select the layer by clicking on it and click the
trash can underneath.
With your marquee tool selected right click and drag the desired areas to be removed. Once selected just hit the backspace
key.When this is done the image is now ready for the animated gif. repeat the above instructions for the remaining two images.
As you can see we now have three images ready for our animated gif
Now were going to select file and new and set the new project size to 100px X 80px
Next click and drag all three images in the 100x80 box be sure you have your move tool selected.
After this is complete minimize the other three images leaving only the 100x80 box. Look to the bottom right corner to make
sure all three layers are there.
Next were going to resize the images to fit the box.
Make sure you have the Show transform tool selected which i circled in red above. Click the boxes indicated with the arrows
so your other layers don't confuse you while resizing the image. If there are some transparencies showing don't worry the
background layer will hide that for you.Once the image is resized click the move tool to confirm the size change.
Now you can resize this any way you want maby its just to show a certain feature of your product or the whole thing. Just
remember that what you see in this project window is what will show up in the icon.
Repeat these steps with the other two layers selecting the layer visibility boxes. You don't have to resize the background
With all of our images now resized in the box were going to select the edit in image ready button.
Now with image ready open were going to click window then animations.
Leaving your desired layer on deselect the other layers. Leave the background layer on also. Now you want to click the duplicate
layer 16 times. On the 16th frame deselect that layer and select the next image. click duplicate layer again another 16 times.
deselect that layer and select the final image. Duplicate that layer 15 times. Now you have 15 copys of each image in the
Now you want to select the button to the right on the animation window and select optimize animation.
You will see a window appear. Check both boxes and click OK
Next you want to click file and Save optimized as. Name your file and there you have it. An animated gif for your products
which helps to better view your items and increase sales.
I hope everyone found this tutorial useful.