What's new
By:
Photoshop Gurus Forum

Welcome to Photoshop Gurus forum. Register a free account today to become a member! It's completely free. Once signed in, you'll enjoy an ad-free experience and be able to participate on this site by adding your own topics and posts, as well as connect with other members through your own private inbox!

Jerky, handmade animations...


A

Avatar-of-Eccentricity

Member
Messages
17
Likes
0
I made a rotating logo animation for a site, buts it's really jerky. This is probably because I made it using the distort tool frame-by-frame...

Is there any easy way I can smooth it out a bit, without having to do something 20 times?

Also, is there an easier way to make a similar animation than the way I did?

\:]

Thanks
 
I'm not a pro, but I would say -- instead of using the distort option, try using the scale option! This might bring it all together smoother for you. If not, sorry!

As far as doing it 20 times, sometimes you have to make a lot of frames to get it to look smooth. I created an avatar a while back that took 36 separate layers to look nice.

Here is the avatar

TribalEye.gif
 
That's a very cool design A 'o E. Let me say I thought you did really well. The biggest visual irregularity came in the central long segment. I thought I'd give a try at smoothing it out by opening up your original, taking the frame with the front view and trying to recreate your rotation by using mathematical precision.

I opened your GIF and took the frame which had the front view of the rotating portion made a new PSD of that layer. I used the magic wand tool to select and cut that red widget to a new layer. I used a selection and radial gradient to repair the background layer.

For simplicity sake I decided to use 10 frames to get the first 90? of turn. So I first duplicated the 'widget' layer 10 times and worked my way up the ladder of layers, so to speak. On the layer immediately above the widget layer layer I recreated the distort you used by using Command (Control) + T two separate times. First I transformed the widget by entering 3? in the 'set vertical skew' of the Transform tool bar. After that I transformed that same layer again by reducing the horizontal size by 10% (entering (90% in the Set Horizontal Scale box). As I worked my way up the copies it went v 6? followed by W 80%, v 9? followed by W 70% etc. The final wasn't at O% but actually at 2 so there was a thin line of red. Then I copied the layers in reverse order and Transform > Flip Horizontal on each. Whew! Sometimes you just have to do things by hand!

Anyway, here's the result. It is slightly better than your original because there is no apparent irregularity of the width of the central piece of the widget. I could have used more frames and had the gif a little smoother.
 
for gifs can you make one by just using photoshop 7?
 
Sure can, deadfishy00. What I usually do is make all my frames as separate layers in Photoshop and then launch ImageReady by using the "Send to ImageReady" icon at the bottom of the Tools palette. Once there I create the animation with each layer one frame, set the delay, and Save Optimized... Give it a try and if you get stuck try the ImageReady help first and then give us a holler if that doesn't answer your questions. ;)
 
Way to go, deadfishy00! Is that your first animation? I've got a couple of suggestions. When you open the layered Photoshop file in ImageReady and have all the frames loaded in the Animation palette, look below each of the frames. You will see "0 sec." Click on that and you can change the amount of time each frame is displayed. It's called delay. While the normal options go down to .1 sec, there is a custom option where you can enter smaller intervals. I opened your GIF in ImageReady and changed the delay to .15 and saved it once again. I also thought about having the last frame longer but didn't bother. To change all the frames at once click on the first and Shift click on the last and all will be highlighted. Change the delay on one and all will change.

Then I looked at the Optimize palette and dropped the number of colors from 256 to 32 and selected No Dither. There's an additional change I made to the animation which is to change the Disposal to Automatic. Next to the seconds below each frame is an obscure little dotted icon. Alt (Option) click on that and you can change the disposal. Generally Automatic is the best setting. The changes I made were to slow down each frame and reduce the file size. Your original was 100K, my modifications (primarily reducing the color palette to 32 colors) reduced it to 44K. Here's the result.
 
thanks and yes it is my first animation i've made just learend it 2 days ago

and another qusetion, is there a way to layer layers ? ive tried to do it by doing the normal layering method but it didnt work
 
nm figured my problem out, thanks a bunch, i got another question though lol

the person who originally posted this made a sig that made their picture swivle in circles. does that mean he drew it alot ? or is there a way to rotate pictures ?
 
Sorry, deadfishy00. I've been a bit tied up with having to replace the fan in my power supply which required stripping the entire computer. All's well but my time for the forums has been a bit short the last couple of days since the fan started going.

So... How did A'oE make the original one? He used the distort tool frame by frame. There is no automated wonder button. I give a description of how I did a remake using simple mathematically equal angle changes to recreate the distort in exact increments rather than doing it by eye. You know you can always drag a copy of a GIF to your desktop from your browser and open it in ImageReady to see how many frames it took and how big the changes were between each one.
 
hm figured it out but got one problem...

its not spinning completely....

and it has the back ground spinnign with it too
 
Back
Top