Need a loading icon? go Ajax style, its cool
you will need Photoshop and Image ready installed to complete this tutorial.
Here’s how we do it.
MAKING THE SHAPES >>
Open Photoshop and start with a blank canvas about 100 x 100, once you have learnt how to do it you can change the size to suit your need.
Make some rules on the canvas at 50px on Y and 50px on X (so we know the exact centre of the image).
now, with your canvas set up, lets start drawing.
Note: the middle shape will be removed, its just for a measurement.
Alright! now you can get rid of centre ones.
Ok so grab the 2 horizontal shapes and rotate them again at 45 degrees, then grab the new shapes and duplicate them and rotate 90 degrees.
after you have done that you should have this.
ADDING THE GRADIENTS >>
So now we have got our shapes we need to add a gradient over the image to create the fading effect as it turns around.
Hit D to set your colours to black and white and swap your foreground to the white.
Make your gradient from the centre of the canvas to the outer edge.
Rotate the gradient layer (edit > Transform > rotate). Move the gradient just around enough so the line is in between 2 shapes.
on the new layer, rotate it again to sit in between the next shape.
continue these steps until you have come all the way around to the start.
LIGHTS, CAMERA, ANIMATION!!! >>
Ok so now we are ready to hit up Image ready and start animating it.
Shift + Ctrl + M will take your image straight to image ready, if its not already set up, you will need you layer palette and your animation palette. These can be found in the Window menu at the top.
turn off all your gradients besides the first one, and to animate the picture all you need to do is hit the duplicate current slide button on your animation box, turn off the current gradient and select the next one in line. Do that until you have one slide for each gradient made. and hit play on the animation box and watch her go!.
Save optimised as and that’s all there is to it!
Pretty easy huh!
Hint for next time >
once you have all your shapes in place, flatten them into one layer and select them all by Ctrl + left click on the layer thumbnail and then add a radial gradient to it from the centre.