Kapi'olani Community College, Univ. of Hawai'i

art 257
motion graphic design

course description + syllabus

art 257 introduces projects that incorporate typography, shape and image within time-based presentations. students will creatively employ motion, typographic effects, layering and transition to focus on interactive and sequential organization of information through time in the execution of interface design projects and web site design.

syllabus:

art 257 - syllabus - 90 K [.doc]

schedule + digital assets

week 1:

in-class presentation :: week1a - 76 K [.ppt]
in-class example :: mtv spot #1 - [url]
in-class example :: mtv spot #2 - [url]
in-class example :: mtv spot #3 - [url]
in-class example :: mtv spot #4 - [url]
in-class example :: mtv spot #5 - [url]
in-class example :: mtv spot #6 - [url]
in-class example :: mtv spot #7 - [url]
in-class example :: mtv spot #8 - [url]
homework assignment :: 10 second black square animation - 33 K [.doc]
in-class presentation :: week1b - 157 K [.ppt]
in-class example :: kleeman and mike - [url]

week 2:

in-class presentation :: week2a - 89 K [.ppt]
in-class example :: 6 ft. under titles - [url]
homework assignment :: storyboard + animatic - 36 K [.doc]
homework assignment :: script - 33 K [.doc]
in-class presentation :: week2b - 219 K [.ppt]
in-class example :: SPIC - Storyboard of My Life - [url]

week 3:

in-class presentation :: week3a - 126 K [.ppt]
in-class example :: boids of a feather animatic - [url]
in-class example :: fishboy animatic - [url]
in-class presentation :: week3b - 574 K [.ppt]
in-class example :: kinetic typography - [url]
homework assignment :: 10 second black square animation - 34 K [.doc]

week 4:

in-class presentation :: week4a - 126 K [.ppt]
in-class example :: similar project at CMU - [url]
in-class example :: CMU sung-joong kang animation - [url]
in-class example :: CMU jim kenney animation - [url]
in-class example :: CMU emil zola animation + demos - [url]
in-class example :: flash text animation techniques - 43 K [.fla]
in-class example :: flash text animation techniques - 7 K [.swf]
in-class presentation :: week4b - 30 K [.ppt]
reading :: john lasseter's 1987 SIGGRAPH paper - 1.2 MB [.pdf]
reading :: john lasseter's 1987 SIGGRAPH paper - [url]

week 5:

in-class presentation :: week5a - 58 K [.ppt]
in-class example :: latin alive web site - [url]
in-class example :: latin alive short film - 10 MB [.mov]
midterm assignment :: time-based media project - 39 K [.doc]
in-class presentation :: week5b - 98 K [.ppt]
in-class example :: japanese tradition (sushi) - 54 MB [.avi]

week 6:

in-class presentation :: week6a - 220 K [.ppt]
in-class example :: catch me if you can film titles - [url]
in-class example :: mad about you tv titles - [url]
in-class example :: ea sports tv spot - [url]
in-class example :: totoya tv spot #1 - [url]
in-class example :: totoya tv spot #2 - [url]
in-class example :: homechoice tv spot - [url]
in-class example :: primer film trailer - [url]
in-class presentation :: week6b - 72 K [.ppt]
in-class example :: imaginary forces - [url]
in-class example :: flash logo/intro examples - [url]
in-class example :: flash intro examples - [url]
in-class example :: bbc title sequence examples - [url]

week 7:

in-class presentation :: week7a - 47 K [.ppt]
in-class example :: ocean's 11 trailer + tv spots - [url]
in-class presentation :: week7b - 160 K [.ppt]
in-class example :: bill plympton shorts - [url]

week 8:

in-class presentation :: week8a - 205 K [.ppt]
in-class example :: Do You Like Waffles? by Nathan Mazur - 249 K [.swf]
in-class example :: War by Manuel Fallmann - 511 K [.swf]
in-class presentation :: week8b - 1 MB [.ppt]
in-class example :: Kangaroo Alliance site - [url]
in-class example :: Kangaroo Alliance animation #1 - 16 MB [.mov]
in-class example :: Kangaroo Alliance animation #2 - 1.6 MB [.mov]
in-class example :: Kangaroo Alliance animation #3 - 2.1 MB [.mov]
in-class example :: at a glance music video - 26 MB [.mov]
mid-term assignment :: mid-term grading sheet - 43 K [.doc]

week 9: MID-TERM CRITIQUE - MID-TERM PROJECTS ARE DUE!

in-class presentation :: week9a - 205 K [.ppt]
in-class presentation :: week9b - 22 K [.ppt]

week 10:

in-class presentation :: week10a - 30 K [.ppt]
in-class presentation :: week10b - 1.2 MB [.ppt]
in-class example :: quiksilver site - [url]
in-class demo :: graphics vs. movie clips flash file - 43 K [.fla]
in-class demo :: graphics vs. movie clips - 7 K [.swf]
in-class tutorial :: flash site in a day flash file - 43 K [.fla]
in-class tutorial :: flash site in a day flash site - 7 K [.swf]
homework assignment :: flash site part 1 - 39 K [.doc]
homework assignment :: flash site part 1 - 1.2 MB [.pdf]
in-class tutorial :: flash site part 1 flash file - 43 K [.fla]
in-class tutorial :: flash site part 1 flash site - 7 K [.swf]
in-class tutorial :: flash site mechanicals - 7 K [.ai]

week 11:

in-class presentation :: week11a - 106 K [.ppt]
in-class example :: yugop site - [url]
homework assignment :: flash site part 2 - 199 K [.doc]
homework assignment :: flash site part 2 - 135 K [.pdf]
in-class tutorial :: flash site part 2 flash file - 71 K [.fla]
in-class tutorial :: flash site part 2 flash site - 7 K [.swf]
in-class presentation :: week11b - 1.5 MB [.ppt]
in-class example :: bmw flash site - [url]
in-class example :: volvo v50 flash site - [url]
homework assignment :: flash site part 3 - 82 K [.doc]
homework assignment :: flash site part 3 - 35 K [.pdf]
in-class tutorial :: flash site part 3 flash file - 70 K [.fla]
in-class tutorial :: flash site part 3 flash site - 7 K [.swf]

week 12:

in-class presentation :: week12a - 26 K [.ppt]
in-class example :: gotoandlearn flash tutorials - [url]
homework assignment :: flash site part 4 - 73 K [.doc]
homework assignment :: flash site part 4 - 28 K [.pdf]
in-class tutorial :: flash site part 4 flash file - 70 K [.fla]
in-class tutorial :: flash site part 4 flash site - 8 K [.swf]
in-class presentation :: week12b - 23 K [.ppt]
homework assignment :: flash site part 5 - 76 K [.doc]
homework assignment :: flash site part 5 - 30 K [.pdf]
in-class tutorial :: flash site part 5 flash file - 73 K [.fla]
in-class tutorial :: flash site part 5 flash site - 8 K [.swf]

week 13:

in-class presentation :: week13a - 26 K [.ppt]
in-class example :: preloader tutorial - MX - [url]
in-class example :: preloader tutorial - MX 2004 - [url]
homework assignment :: flash site part 6 - 93 K [.doc]
homework assignment :: flash site part 6 - 36 K [.pdf]
in-class tutorial :: flash site part 6 flash file - 77 K [.fla]
in-class tutorial :: flash site part 6 flash site - 89 K [.swf]
in-class presentation :: week13b - 21 K [.ppt]
homework assignment :: flash site part 7 - 205 K [.doc]
homework assignment :: flash site part 7 - 137 K [.pdf]
in-class tutorial :: flash site part 7 flash file - 249 K [.fla]
in-class tutorial :: flash site part 7 flash site - 17 K [.swf]

week 14:

in-class presentation :: week14a - 30 K [.ppt]
homework assignment :: flash site part 8 - 94 K [.doc]
homework assignment :: flash site part 8 - 36 K [.pdf]
in-class tutorial :: flash site part 8 flash file - 2 K [.html]
in-class tutorial :: flash site part 8 flash file - 1.4 MB [.fla]
in-class tutorial :: flash site part 8 flash site - 968 K [.swf]
in-class tutorial :: preloader w/ loop exit - 1.4 MB [.fla]
in-class tutorial :: preloader w/ loop exit - 965 K [.swf]
final assignment :: final grading sheet - 42 K [.doc]
in-class presentation :: week14b - 29 K [.ppt]
in-class example :: flashkit barney slider - [url]

week 15: FINAL CRITIQUE - FINAL PROJECTS ARE DUE!

in-class presentation :: week15a - 21 K [.ppt]
in-class presentation :: week15b - 36 K [.ppt]

week 16: LAST WEEK OF CLASS

in-class presentation :: week16a - 30 K [.ppt]
in-class presentation :: week16b - 17 K [.ppt]

course info

art 257 - motion graphic design
kcc new media arts
fall 2005
kopiko 202
t,th :: 1:45 PM - 4:15 PM
instructor: chris gargiulo
office: koa 109
email: gargiulo@hawaii.edu