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.
How to do it
1.
2.
3.
4.
5.
Hit ESC on your keyboard to leave Slide Show mode
Pick your favorite image below and right-click on it
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)
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.
Change each one a bit and imagine them appearing in a moving
sequence one at a time
6.
7.
8.
9.
10.
11.
How to do it
Go to File > New and create a composition that is 4 in
tall x 4 in wide
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
Arrange the images on the composition so that when
they become animated, they will flow nicely
Save as a PSD file as [last name] GIF Test in the Photo
Journalism >Animated GIFs folder you created earlier
Double click on the Background Layer in the Layers
window to unlock it
Click Okay when prompted to change the background
to Layer 0.
How to do it
12. Go to Window>Timeline to turn on the animation window
below
13. Click the arrow to the right of the button in the middle of
the window that just popped up at the bottom
14. It will bet set to Create Video Timeline – change it to
Create Frame Animation
15. Now press the Create Frame Animation button you just
selected
16. Click the button at the right upper corner of the window
you are working in - select Make Frames From Layers
How to do it
17.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 it
19.Adjust the timing on each frame to
your desired length by highlighting
each frame and clicking on the
dropdown menu
How to do it
20.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 Web
23. 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 menu
25. Be sure to save your original file as a PSD if you need
to make changes later
26. 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