how to create an animated .gif loading image in photoshop | 2my4edge

28 May 2013

how to create an animated .gif loading image in photoshop

hellow friends, here i'm going to show that, how to create an animated .gif image using photoshop. let see how we are going to do that in adobe photoshop, here i'm using CS5.

animatedgif image


the above image is the sample image.. here we are going to seee about that image only.. that is image is created in using adobe photoshop. let's see the step by step process. how to do that.

new image
First open a new work space.

open image

And go to select tool, make a small rectangle shape image in in a place, and right click and choose color and fill with some color.

fill stroke
Do like the image image shows. fill with color and Deselect the selected layer. and make make duplicate layer of the rectangle shape image layer, just make 4 or 5 layers.

click layer
create duplicate layers.
dublicate layers
 4 layers i created.
make all layers

go to the top bar,, seee here ESSENTIALS  DESIGN PAINTING ETC, like that, click on that and choose MOTION in that. as by the below image shown. 
choose motion
change animation frame into and timeline mode. click as shown in the below image.
change to timeline
and click create new layers how much layer we want. refer below image.
layer for layers
do as like the below images shown.. make the assign layers for the animation. shown two images for sample do that for all images..
layer for layer

layer for layer
similarly do that for all images..

click on the identified place to image animate
and geneate 5 layers for each one layer. that give some effect to the image 
5 effects
then that generate more layers in the animation frame. then click play, and the animation frames will move..
layers in motion
then go to menu bar, and choose file, then SAVE THE WEB & DEVICES 
save as web devices
 then save the image as in the format of .GIF
save as web devices

that's it the animated image is ready now. now open it with any of the browser. 
open it in browser
the animate .GIF image is ready..
ready image
that is it.



  1. wonderful blog.This blog is very informative.thanks for this blog.

  2. Awesome article with great idea! Thank you for such a profitable article. I truly acknowledge for this extraordinary data.
    Animated Logo

  3. Respecting the time and exertion you put into your site and point by point data you offer!..
    Custom Animated Logo

  4. It's simply a question of being imaginative. On the off chance that you are a Photographer like me, it is fundamental to utilize Photoshop.create a vector in photoshop for printing