NIU School of Art ARTD102 - Digital Workshop
Guest Instructor: Bart Woodstrup
Title: Project 3 - Type, Time and Motion (Click HERE to see the tutorial)

Problem: Using a word randomly assigned to you in class, consider ways to express the meaning of the word through transforming and animating its shape over time.

Objectives:

1. Use typography to expressively communicate an idea.

2. Manipulate vector shapes in order for the object to appear in motion.

3. Understand the differences in raster versus vector graphics imaging.

4. Use animation techniques to create a design that transforms over time.

5. Understand scale constraints when designing for the computer screen.

Strategy:

1. Working in Illustrator, use the Type tool to enter and choose a font for your word.

2. When you have finished editing your text, you will need to convert it to “Outlines” in order to manipulate its vectors. Select Type > Create Outlines. You will then need to “Ungroup” the Outlines. Go to Object > Ungroup.

3. Save your work. Illustrator files typically save with a .ai extension.

4. Open Photoshop and make a new file that is 600 pixels height and 600 pixels width.

5. Copy/Paste your word letter by letter into Photoshop. This will put each letter on its own layer, making it easier to animate.

6. In Photoshop, open the “Animation” window. Animating in Photoshop will be reviewed in class.

7. Create a 7 frame (minimum) animation.

8. Save your work as a Photoshop (.psd) file.

9. When you have finished your animation, we will convert it into an animated .gif file. The best way to do this is to save it using the “Save for Web & Devices” feature.

10. Make sure you choose .gif as the type of file you want to save to, then preview your animation using the play controls in the bottom-right of the screen.

11. Save your file and open it in a web browser (Firefox, Explorer, Chrome).