Create GIF File Using Phtoshop CS3

As webpages develop into more sophisticated works of art, it becomes necessary for designers to use different techniques to attract a viewer. One technique that is utilized is the animated .gif graphic. The animated .gif allows a designer to inject movement into webpage graphics to draw the attention of the viewer. There are many software programs available that allow the creation of these graphics. One such program is Adobe Photoshop Creative Suite 3 (CS3), which will be used for our tutorial. It is important to note that this tutorial requires basic knowledge of Photoshop CS3, along with experience using layers. For beginners, please refer to the Related wikiHows and Sources at the end before to become familiar with Photoshop CS3. The following tutorial, created by the Fighting Engineers, describes how to create an animated .gif graphic using Adobe Photoshop CS3.

1. 1
   Create a document with each frame of the animation on a different layer.
   
   

   
   
2. 2
   Select the layers to be used in the animation from the layers palette
   
   
   
   
   
   

    Select the layers to be used in the animation from the layers palette
   
   
   
   .
   • Note: To select a group of layers, select the layer at the top of the group. Then hold the shift key and click on the bottom layer and this will highlight every layer in # Open the animation palette by choosing window from the menu bar and selecting “Animation“.
     
     
     
     

      Note: To select a group of layers, select the layer at the top of the group.
3. 3
   When the animation palette opens, it should look like this. If it doesn’t that means it opened in the timeline view.
   
   
   
   

    When the animation palette opens, it should look like this.
4. 4
   Change to frame animation view by clicking on the flyout menu in the upper right hand corner of the animation palette and selecting “Convert to Frame Animation”.
   
   
   
   

    Change to frame animation view by clicking on the flyout menu in the upper right hand corner of the animation palette and selecting “Convert to Frame Animation”.
5. 5
   Change every layer showing on one frame to every layer showing on its own frame, by clicking the flyout menu on the animation palette and choosing “Make frames from layers”
   
   
   
   
   
   

    Change every layer showing on one frame to every layer showing on its own frame, by clicking the flyout menu on the animation palette and choosing “Make frames from layers”
   
   
   
   .
   • Note: All layer don’t have to be selected, to select a few layers use the copy layer button at the bottom right of the animation palette to add layers.
6. 6
   Modify each frame by selecting the frame on the animation window and changing it as desired in the main photoshop window.
   
   
   
   

    Modify each frame by selecting the frame on the animation window and changing it as desired in the main photoshop window.
   • Note: To add or remove a graphic from another layer to any frame r, select the frame and in the layers palette, click the “eye” to toggle on or off the visibility for that layer.
7. 7
   Under each frame is an arrow head pointing downward. Click on the arrow head to display timing menu and select the display time for each frame.
   
   
   
   

    Under each frame is an arrow head pointing downward.
8. 8
   From the file menu select export to export the document as a movie or under the save as option save the file as a gif. Be sure to select Save for Web and Devices (.gif under this option).
   • Note: If you want to loop your animation continuously you can select that option in window that pops up after you have chosen "Save For Web & Devices". Under the color table that shows up is "Looping options", just select "forever" and save it. You can also pick "others" and select the amount of times you want your animation to loop.