ooglewindowblinds.com

Easy and Free adobe CS photoshop tutorials and lessons online

Website graphics search icon animation

April 14th, 2008 · No Comments

Here we will tell you how to make a Website graphics search icon animation in photoshop.

[1] Opening any image of your choice

Website-graphics-search-icon-animation1

[2] Take the Elliptical Marquee Tool create a shape.

Website-graphics-search-icon-animation2

[3] Take the Gradient Tool use these settings.

Website-graphics-search-icon-animation3

Website-graphics-search-icon-animation4

[4] Make the new layer fill the selection with the help of Gradient Tool.

Website-graphics-search-icon-animation5

[5] Go to Blending Option use the following settings.

Website-graphics-search-icon-animation6

Website-graphics-search-icon-animation7

Website-graphics-search-icon-animation8

Website-graphics-search-icon-animation9

Website-graphics-search-icon-animation10

[6] Take The Shape Tool select this one.

Website-graphics-search-icon-animation11

[7] Make the new layer create shape over the previous shape and fill with Black color.

Website-graphics-search-icon-animation12

[8] Go to Blending Option select the Styles click on Chrome see in the next image.

Website-graphics-search-icon-animation13

[9] Your image will be as shown below.

Website-graphics-search-icon-animation14

[10] Now make the copy of the both layers.

Website-graphics-search-icon-animation15

[11] Move the Both copy layers with the help of Move Tool.

Website-graphics-search-icon-animation16

[12] Make the more copies of the both shape layer and move the shape like this.

Website-graphics-search-icon-animation17

[13] Go to Window>Animation.

Website-graphics-search-icon-animation18

[13] Now hide the all layer do not hide these layer see in the next image.

Website-graphics-search-icon-animation19

[14] Duplicates Selected Frames click on this icon.

Website-graphics-search-icon-animation20

[15] Hide the previous ones and unhide the next ones see in image.

Website-graphics-search-icon-animation21

[16] Duplicates Selected Frames again.

Website-graphics-search-icon-animation22

[17] Hide the previous ones and unhide the next ones see in image.

Website-graphics-search-icon-animation23

[18] Use the same think to each layers your animation frame look like this.

Website-graphics-search-icon-animation24

[19] Now click on this icon indication by a hand sing to Play Animation.

Website-graphics-search-icon-animation25

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

Website-graphics-search-icon-animation26

[21] This photoshop tutorial is complete now, your final image will look like this.

Website-graphics-search-icon-animation27

animations on photoshop

animations with photoshop

create animation in photoshop

Tags: Photoshop Tutorials

0 responses so far ↓

  • There are no comments yet...Kick things off by filling out the form below.

You must log in to post a comment.