Photoshop Tutorial: Animating

Now it has been a while since I last did a tutorial video for Photoshop, and today I come back with something a bit more useful when it comes to making an animated logo. In the video I demonstrate how to animate using a sprite sheet, but the concept is quite simple to understand altogether. All you have to do is animate frame-by-frame, or in this case layer by layer. There isn’t a whole lot I can really show you through this article that I did in the video. But I will try my best to recapture this moment for you in text form for those who don’t like watching an eight minute video. So without further distractions, let’s get started.

Animating in Photoshop isn’t a hard task. In fact all you need to do is create a new document, and once it is open go to window, and click the animating button. 

A panel should appear at the bottom of the application that shows in a timeline view, you want to get out of that by clicking the bottom right of that window, the icon you should click should look something like this:

Once you click that button, you should be put in this little window view that has a small square. That square is called a frame. Each frame you use is another illusion of movement. Now all we have to do is add some kind of object to animate. So in this case, I will use a circle. 

 
There we go. Okay, now the rest of this won’t be as hard as you may think. So let’s say I want to make this circle move to the right. All I have to do is click and make a new frame as show in the next image and then we will move the circle. Now all we have to do is click this icon: then this window should pop up. 

 

Okay! Now we are going to type in 10 to the “Frames to Add” and click okay. All of this will tween off of the previous frame. After doing that, then guess what? A bunch of frames like this should appear:  

What this does is give off the illusion of the circle moving from its position. There you have it. I would also like to mention that it would be a good idea to have objects on separate layers. This will make animating a whole lot easier for you in the long run.

Although this wasn’t a hard lesson I do have to mention the purple of the timeline view. All that is…. Is like a flash built in Photoshop. It allows you to animate sketched animations or even video editing in Photoshop. It’s a very unique and powerful tool, but still has its limitations. Now that you know how to animate in Photoshop, give it a try and see what you come up with. I had to learn this to make animated banners in my web design class. So maybe down the road you might have to use it with some project. I hope you found this useful in some way, and I would like to say thanks for reading/watching. Also, have a nice day.