“Hey Everyone!”


It’s Spidey! My best friend, Eleanor, is turning 17 soon so we celebrated last night. Of course, I had to make her a card. She loves Marvel and the last movie we had gone to was Captain America: Civil War so I thought I could make something related to that. I originally wanted to make something cute depicting the scene where Spiderman steals Cap’s shield, and this was the inspiration I found on dribbble.com:

Screen Shot 2016-06-15 at 3.53.50 PM copy

I didn’t end up making the shield behind Spiderman, but I made something fairly similar to this on construction paper. It took a lot of time and glue xD I used a pink felt tip marker to add the lines on his suit and the rope is made out of ribbon that I twisted really tightly. I was pretty proud of my hours of work so naturally I wanted to show it off on my blog 😀 Just posting the picture would be kinda boring so I thought, hey why not try to make a GIF? As my friend Orion said, in this GIF Spidey looks like he’s just slowly trying to escape because he did something wrong. I wonder what he did. . . o.O

Making the GIF was actually the most painful experience I’ve ever had. Luckily, I had a decent Spotify playlist to help me fight through the pain.

Here’s the process I went through to make this piece:

I first took a picture of the paper Spidey and cut it out on Photoshop. Then I used an InDesign document to create all the frames that would be used in Photoshop. Here’s what it looked like in InDesign:


I then exported the document as a jpeg and opened it on Photoshop. I cropped each frame (50 of them -.-) and saved those individually. After that, the GIF had to be created from all the frames I saved. To do this, you have to go to to File/ Scripts/ Load Files into Stack. . .

Screen Shot 2016-06-15 at 2.47.17 PM

You will then get an option to upload all the upload all the frames. Do that. Then, go to Window/ Animation (This is for Photoshop CS5.1)

Screen Shot 2016-06-15 at 2.51.56 PM

After clicking “Animation,” this window should open up:Screen Shot 2016-06-15 at 2.56.58 PM

To add frames, click on the tab in the upper right corner and click “New Frame.”

Screen Shot 2016-06-15 at 2.57.08 PM

You can change how long each frame is by clicking on the little down arrow on each frame:

Screen Shot 2016-06-15 at 2.57.19 PM

Before you create a new frame, be sure you go to layers and change the visibility options of your various layers. Otherwise all the frames will show the exact same thing.

Screen Shot 2016-06-15 at 2.57.55 PM

Screen Shot 2016-06-15 at 2.58.00 PM <- Click on this creepy eye to turn off the visibility of a layer.

Once you’re done adding all your layers, go to File/ Save for Web & DevicesScreen Shot 2016-06-15 at 3.12.21 PM

Then just click save and you’ve made yourself a GIF! Piece of cake 🙂


Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s