This is a tutorial for an assignment I created here. The idea is to use sticky notes to construct an animation! Let’s get started!

First you need a writing utensil and sticky notes:

Next, it’s time to start drawing! I recommend writing the frame number on the note somewhere, so they can’t get out of order later on.

Nice you have your first frame! Now to do the next frame, place a blank sticky note over the frame you just created:

Wow, look you can see the outline, that means you can trace things that stay the same, and make minor adjustments to things that are moving..! Continue in this fashion until you have completed your animation! Now its time to take photos of each frame! I did this by constructing a makeshift camera stand on which I placed my phone. I did this so the camera would always be in the same location:

Now you can place each frame under the camera in the same location, and take a picture. Now upload all of those photos to your computer, and put them in a folder (the remainder of this tutorial will be dealing with making gifs using Photoshop).

Next lets fire up Photoshop! Now we need to import all of these images, but we want them imported into the same document as different layers, so we use the script called “Load Files into Stack”:

Now all of the images will be loaded into Photoshops as layers. Now we need to go to the timeline editor, if you don’t have that open, go to Window (at the top), and click timeline. Next we convert the layers into frames. Now select “Frames from Layers” in the timeline toolbar. You will now see something like this:

Next you can go ahead and click save for web. Sometimes the images might be too big though, and it won’t work, so then go to the Image menu and select “Image Size”, and then make the image size much smaller, I set mine to 200px wide!

After that you are all done! Wasn’t that fun?!? Good Luck!