Animate your images to attract attention and fight the static boredom. This section contains tutorials to help you master the animation process.  Home Photoshop ImageReady Animation Animated Banner for Purse Store

Animated Banner for Purse Store


Start by creating a new file of banner size. Fill the background with blue color.

image 1

Create a rectangular selection using rectangular marquee tool.

image 2

Press Q to enable quick mask. From filter menu select distort>>glass. Apply settings as shown.

image 3

Press Q to disable quick mask. Create a new layer and fill the selection with white color.

image 4

Create a rectangle using rectangular shape tool.

image 5

Double click the layer to open layer style window. Apply layer style with the settings shown.

image 6

image 7

Insert a product image and place over this rectangle.

image 8

Similarly create more rectangle and place images over them.

image 9

Insert company logo and place on the left.

image 10

Create a rectangle using rectangular shape tool. Press Ctrl+T and rotate it.

image 11

Double click the layer to open layer style window. Apply layer style with the settings shown.

image 12

image 13

Type details on the rectangle. Use different layers for different lines of text.

image 14

image 15

image 16

Open animation window. For the first frame hide all rectangles and images.

image 17

Duplicate frame. Unhide first rectangle.

image 18

Duplicate frame. Unhide first product image.

image 19

Similarly create duplicate frames and keep unhiding rectangles and images.

image 20

image 21

image 22

image 23

For 8th frame keep the rotated rectangle layer and the respective text layer partially visible from the right edge of the banner.

image 24

Duplicate frame. Move these layers inwards.

image 25

image 26

Duplicate frame. Hide the first detail layer and unhide the second one.

image 27

Press Ctrl+Alt+Shift+S to save an optimized animated GIF.

Animated Banner for Purse Store Tutorial: Final Result



Author's URL: Mr. Smarty
Thank you for voting.
Rate this Materials:
Bad 
1 2 3 4 5 Excellent
print this page subscribe to newsletter subscribe to rss

Advance your current skills or acquire new skills in Photoshop by creating projects using our step-by-step tutorials. More Tutorials: Most Popular Materials | Fresh Materials | TutorialKit New Photoshop Tutorials

Add comments to "Animated Banner for Purse Store"

Only registered users can write comment

No comments yet...