Making animated GIFs and mantras

Make It Move Like Jagger

objectives• When you finish this activity, you will

be able to:– Create an animated GIF– Determine what your personal mantra is

(more on this later)– Use your Photoshop skills to communicate

your mantra to your classmates

What are they?• GIF stands for Graphics Interchange Format• You’ve seen them everywhere – webpages,

blogs, tweets, Facebook, Instagram, Tumblr, Vine, etc.

• GIFs can be funny, one-line responses for all kinds of web conversations - tweets and text windows are filled with GIFs, often accompanied by very little context.

1. Hit ESC on your keyboard to leave Slide Show mode2. Pick your favorite image below and right-click on it3. Click Save As Picture and save to your H drive under Photo

Journalism >Animated GIFs (this is a new folder that you need to create)

4. Open the image you saved from the new folder and create four different versions of this picture. Save each one separately as a JPG in the new folder and name them Arrow 1, Arrow 2, etc.

5. Change each one a bit and imagine them appearing in a moving sequence one at a time

How to do it

How to do it6. Go to File > New and create a composition that is 4 in tall

x 4 in wide7. Open each image you created individually and cut and

paste each one into your new composition - Photoshop will create a new layer for each picture

8. Arrange the images on the composition so that when they become animated, they will flow nicely

9. Save as a PSD file as [last name] GIF Test in the Photo Journalism >Animated GIFs folder you created earlier

10. Double click on the Background Layer in the Layers window to unlock it

11. Click Okay when prompted to change the background to Layer 0.

How to do it12.Go to Window>Timeline to turn on the animation window below13.Click the arrow to the right of the button in the middle of the

window that just popped up at the bottom14.It will bet set to Create Video Timeline – change it to Create

Frame Animation15.Now press the Create Frame Animation button you just selected16.Click the button at the right upper corner of the window you are

working in - select Make Frames From Layers

How to do it17.It should look like this:

18. If it doesn’t, you are in Timeline View and you need to go back to the previous slide(s) and follow the directions exactly

How to do it19.Adjust the timing on each frame to

your desired length by highlighting each frame and clicking on the dropdown menu

How to do it20.Select the number of times your

animation will loop by changing this setting:

Ready to preview?21.File>Save (to save your PSD file again)22.Go to File>Save for Web23.You can preview it within this menu by clicking

on the Play button

Do you love it?24.If you do, click Save on the same menu25.Be sure to save your original file as a PSD if you

need to make changes later26.If you don’t, hit Cancel and make your changes

now

What can do you do with your file?

• You can use it in PowerPoint files• You can use it on your website• You can use it in your email signature• You can use it as your Twitter avatar• You can use it on Tumblr or

Instagram

Assignment: my mantra• A mantra has many definitions, but a common

one is a series of words that speak to you, or words you live by

• Your mantra may be something your grandfather or an aunt used to say

• It may be something you always tell yourself when you’re getting psyched up.

• Whoever the source and whatever the use, your mantra is very personal to you

Assignment: my mantra• Requirements:

– 640 pixels by 480 pixels– Created in Photoshop– It must have a background that is not white– It must have at least five different layers– It must use an animated GIF you create– It must contain your own personal mantra (create text box in

Photoshop and start typing – do not cut and paste from Word)

Label the file [your last name] Mantra Animated GIF [class period] save to your H drive and submit to Mr. Nigrelli via Google Drive by the end of class on Friday, January 23rd