Home Animation Ant moving around
Ant moving around
Skill level:
Time Required: hrs mins MAKE AN ANT RUN AROUND 1. Creat new document in Photoshop, size 200 x 150 px, transpament background
2. in first layer, use brush tool to creat a random closed path
3. Draw an ant ( i think it :P )
4. Hit Ctrl + T and transform the ant small and lie down the path ( you should fill light color for this path )
5. Creat new layer, Hit Ctrl + T again, and transform....
Filled the path, note : in one step, u must creat new layer 6. And now, hidden all layer by clicking on Hide icon close layer. Change all layer to ImageReady
7. on Animation pallet, use New frame icon to creat 45 frame like this
8. Important in frame 1, you unhide layer 1 ( have an ant ) in frame 2, layer 1 will hide again, you unhide layer 2 in frame 3, you unhide layer 3... do the same step with 42 next frame Animation Shot
When done, click on Play icon to preview or Save as *.gif type Our result !!!
Animating in PhotoShop CS3
Thursday, August 14 2008
PhotoShop used to ship with a helper application known as ImageReady, which was used for such things as animation. PhotoShop now has ImageReady features built-in, so we can animate our PhotoShop documents without exporting to an external application. In this tutorial, you will learn how we can add motion to our graphics and export as an animated GIF. Animation was added to PhotoShop in version CS3, so this tutorial is aimed at Adobe PhotoShop CS3. ImageReady uses a similar process for animation. If you're ever in the market for some great Windows web hosting, try Server Intellect. We have been very pleased with their services and most importantly, technical support. The first thing we need to do is to create a new document. We will add some text to the canvas, and this is what we will animate:
Now, we will goto Window > Animation. You should see a window like the following:
Click to enlarge This window will be used for creating keyframes of our animation. At the moment, we have just one keyframe - the current state of our canvas. We will now add a new keyframe. Click on the Duplicate Frame button at the bottom of the Animation Window ( ) and we should have something like this:
We now have two keyframes, but they're both exactly the same (because we duplicated). This is Ok because we want the keyframes to start off the same, and then we can make our changes. We will want the second keyframe to be at the end point, or next point of our animation - we will not have to recreate every step ourselves. Go ahead and make sure the second keyframe is selected, then drag the Text Layer over to the right-hand side of the canvas, like so:
We are using Server Intellect and have found that by far, they are the most friendly, responsive, and knowledgeable support team we've ever dealt with! Notice that keyframe 1 has stayed the same as the original, but in keyframe 2 the text is now over to the right. If we click between the two keyframes, we can see the differences on the canvas. Next, we can let PhotoShop do the animation of the in-between frames. This is called Tweening. Make sure the second keyframe is selected, and click on the Tweening button ( Duplicate button. ) next to the
We will then be asked which frame we want to tween with, and how many frames we want to add. We will leave the default, 5 frames. Click Ok.
We now have 7 frames, each slightly different, which provide the illusion of movement. We can click the Play button at the bottom of the Animation Window to preview the animation.
Click to enlarge If the animation is too fast, you can change the speed by clicking the small black arrow at the bottom-right of each frame, next to 0 sec. This will change the duration that the frame will show for. We can repeat the process of animation to animate the text further, not only using motion, but Warping the text also:
To save as an animated GIF, we goto File > Save For Web & Devices, and make sure GIF is selected from the presets menu. Yes, it is possible to find a good web host. Sometimes it takes a while. After trying several, we went with Server Intellect and have been very happy. They are the most professional, customer service friendly and technically knowledgeable host we've found so far.
