Photoshop Tutorial 1.

For this method of gif making you will need:

  • VLC Media Player.
  • Photoshop
Not my chosen method as gifs can/tend to be choppy.
 

The first step is to open up the video you wish to make the gif from using VLC media player.  VLC media player is best used as it has a built in screenshot function which can be used by holding “Shift + S”. You’ll be able to see when you’ve taken a screenshot as a message will appear over the video, but don’t worry it doesn’t show up on the screen cap.

Once you have all of the screen caps that you want open up Photoshop. The first thing to do once on Photoshop is to open the animation window. 

To do this go to Window > Animation.

 

Once this window is open you can edit frames and their times sets to allow a nice flow.

To import all of your screen caps go to:

File > Scripts > Load Files into Stack.

Once the box appears click browse and navigate your way to My Pictures. This is where your screen caps will be by default thanks to VLC. 

Select all of the screen caps you created and click OK, then OK again to import them into Photoshop and then wait for them all to load.

Once all the frames are in and loaded go to the animation window and on the top right click the small arrow and click make frames from layers.


 

The next part is to select every frame in your animation window, do this by clicking the first frame then drag the slider do the end and shift click the last frame and this will select them all.

Go back to the small arrow on the top right of the animation window and click “Reverse frames” as when you import them they will always be backwards.

Now here comes the tricky part. You must now go through deleting frames which are not needed such as duplicates or frames with very minimal movement from the previous one. I can’t really give too much help here as its pretty much all down to what you want in your gif.

Once you have deleted the frames you no longer need, select each frame and set their time gap to around 0.09 - 0.12. You’ll also want to go to the bottom left of the animation window and you’ll see the word “Once” click that word and set it to forever and now you have an infinite looping gif. 

Next you’ll want to crop the image incase you have any black outlines from the screen caps do this by pressing “C” or just selecting the crop tool from the tool box and select the area needed then hit “Enter”. 

After that go to:

Image > Image size. Then set the width to be 500px as that’s the width Tumblr allows. Also make sure that the proportions are locked so that when width changes so does height accordingly.

Now that your gif is the right size, loops forever and should be about the right size of 10-25 frames its time to save. To do this go to:

File > Save for Web & Devices.

Once the box appears make sure that the format you are saving in is set to GIF. Now when saving you’ll always want to try and have 256 colours and have the file size below 1000kb or 1024kb. If however your gif isn’t there is a few ways to help.

Also there are two ways the gifs can be pieced together one way is through diffusion and another is through pattern. I tend to use diffusion more as it can be more user defined.

One way is to delete the first and last frame opening up some room. While another is the why which I do is the use of the “lossy” feature. This will put some restriction on the gif and lower the file size (Varies from gif to gif). Although never use a “lossy”higher than 20-25 as then the decrease is visual quality is clearly visible.

Once all that is done, click preview to check if your gifs works correctly/smoothly. If not go back and change a few time settings or remove some more unneeded frames and check again. If all looks good then save and you’re done. You should have a working gif.

 

  1. theperfectcell posted this