Animated GIFs

1) History of the GIF

2) Creating and animating your own GIF

1) History of the GIF

The GIF is a digital image form that has now been around for over thirty years! Check out the first three minutes of this video overview.

(Note that this video was created in 2012 and the medium has continued to evolve since then).

Further Reading: A detailed but concise history of the GIF:

https://www.wired.com/2017/05/gif-turns-30-ancient-format-changed-internet/

Fun fact: The website for the 2019 film Captain Marvel (which is set in 1995) was designed to purposely look like a website from the mid 90's...complete with a lot of animated GIFs. Check it out: https://www.marvel.com/captainmarvel/

2) Creating and animating your own GIF

What we will be creating is actually a form of stop-motion animation.

You will take a series of still images that, when saved as a GIF, will be shown as frames in a short, repeated animation.

Note that this is not a video-based GIF project. That's a huge and popular kind of GIF but is not within the scope of this lesson.

This is also not a cinegraph, which is a very cool merging of still photography with looped video.

(a very simple example. You can do better!)

VIDEO TUTORIAL: Creating an animated GIF using your own photos

Photoshop

Use if completing in class.

Photopea

Use if completing at home.

If using Photopea, see also this reference Animations tutorial page: https://www.photopea.com/learn/animations

PROJECT: ANIMATED GIF

You will create and hand in ~~TWO~~ ONE animated GIF, according to the specifications below. 2022 January: Just do ONE because we're short on time.

How long should each GIF be?

Recommended number of images (frames) is 5-12, although there is extra flexibility, depending on how fast you want the animation to run.
Also note that some animations look better when run forwards and then backwards (see the video tutorial examples, for instance), so you may need fewer frames overall if you choose to create your animation this way.

What kind of subjects work?

Prop/object movement, time-based change (e.g. orange peeling itself), people’s actions or movements (posed, not candid), expressions, comedic/funny/slapstick events, food having adventures, animals/pets, drawings coming to life, etc. Anything can be done badly but it takes forethought, skill, and practice to pull this off successfully.

Shooting tips:

Ideally your camera should be in the same spot for all frames. Photoshop can correct this automatically (to a point), and you can line up your images in Photopea as well (though it’s manual and more time-consuming), but a stationary camera will make this much easier (and better looking).
If shooting from home, turn on the Grid on your camera phone to help with consistency. Almost all phone cameras (even older ones) have that option somewhere in the camera settings. Take a look!
It’s not a big deal if you have a bit extra on the edges of your frame. You can always crop all the images at the same time if you need to. Better too much in the frame than not enough!
Plan out your animation beforehand! Don’t overshoot if the movement is simple, but also don’t plan movements that are so complicated that it takes 30 shots (and a 5-second GIF) to play out.
Since you've been asked for two of these, perhaps start with something simple for your first try and then get more ambitious the second time around.

TO HAND IN:

1) Double-check that your finished GIFs actually play properly on your computer.

2) Upload them directly to Classroom.

STUDENT EXAMPLES

Check out this fun gallery of student examples >>>HERE<<<. And another one >>>HERE.<<<

Page updated

Report abuse