Wednesday, September 30

2E :: KINETIC TYPE :: form making/testing

you should now have the following:
  • a final planning document (storyboard) for how you want your animation to flow. 
  • a general sense for how long the piece should be. 
  • a plan A and plan B for how to execute your kinetic type. 

today we will look at basics of imovie and aftereffects as production tools.

considerations for analog typography 
  • how will you generate your typography physically? what materials, spaces, objects?
  • how will you capture that in a movie? still camera? video camera? scanner? copier? other? 
  • how will it be lit? 
  • how will you move it around (camera move, object move, both move)?
  • what will you use to move things around? 
  • how can you control things so viewers focus on the typo-concept and not how you did it or what you used to do it?
  • what is the difference between real-world motion and computer motion? which is most appropriate for your words?

due next class
  • review “newton’s laws of motion” lecture over in the sidebar to the right. 
  • production work; preparing objects, models, words, and so on. making test movies. you have three more class sessions, then crit. 

in class friday
flash demo: import to library, motion and shape tweens, motion paths, masks, transparency

Friday, September 25

2D :: KINETIC TYPE :: storyboards

in class we will work in pairs to determine the strongest direction for each of your three actions. when making final decisions, keep in mind how everything goes together both formally and conceptually.

due next class
one 30-frame storyboard that covers your entire animation. using a timer while looking at your rough storyboard, determine how long you want your animation to be. you will start a timer and imagine the animation progressing. do this a few times, writing down the duration each time. you will be making a 30-frame storyboard, so divide your average time by 30. that will tell you the duration of each frame in your storyboard.
a 1-minute animation, divided by 30 frames = 2 seconds per frame.
a 10-second animation, divided by 30 frames = a frame every .33 seconds (or 3 frames per second).
a 15-second animation, divided by 30 frames = a frame every .5 seconds (or 2 frames per second).

mounting specs for storyboards are here.
import this pdf into an indesign file. position the margins correctly and crop out the titles and measurements. add in your own text. drop in scans on a layer underneath the template or carefully draw in images after printing out. this is an 11 x 17 print. do not mount but make sure it is of good quality.

have a solid plan for how to produce your kinetic type: materials, processes, etc. a “plan B” is always a smart idea, so have that also.

post to your blogs by next class session
- 3 pics of your rough storyboards from friday's class
- good image of your final storyboard

Thursday, September 24

new links to studios

i put these in the sidebar to the right, but wanted to highlight them here as new finds.

from josh eithun. thanks, josh.


we are royale

also, lecturing at KU on monday oct 26, 6pm:


Wednesday, September 23

2c :: KINETIC TYPE :: transitions

take a macro view of your mass of sketches and look for treatments of words that might be linked together nicely with your existing animation. this linking could be done conceptually, formally, or both. identify three actions that you can link, and begin working out transitions between word and image or word and word.

  • which actions are extending the meaning of the narrative rather than re-stating what is already told in the image sequence? 
  • what are the possible categories of juxtaposing of type and image over time? examples: simultaneous text/image, sequential text/image. are there others? 
  • what sequence of text and images might narrate a new story in an interesting way? 
  • how might the nature of the transition itself be meaningful? 

at some point during class, let’s regroup and take 15 minutes to share initial brainstorms about how our transitions are working.

at this point you should be refining your initial ideas both formally and conceptually. typeface choice/lettering style, quality of motion, composition, color, etc should be taking shape now. these ideas can be produced in flash, but i would recommend attempting to produce them in some analog fashion. be creative here -- that’s your job as a designer, to create amazing and original ideas. work within the 3:2 aspect ratio, or 720 px x 480 px (6” x 4” in print).

homework for next class 
read “moving type” pp 46-63, available as an e-reserve from the library.
- go to the kcai library website
- at the bottom of the page, click “retrieve by instructor name” under “course reserves”
- type in “galloway”
- select the narrative class
- type in your name and info. our course password is “narrative”.
- click on “view image of: moving type” it’s a pdf file.

produce three different ROUGH directions for how your text might combine with your current “image duration” animation. use whatever method is fastest for rendering your previous images -- drop existing scans into a storyboard template, trace them in pencil/pen, or whatever. then show how the type could behave in relation to the imagery.

post to your blogs by next class 
  • initial word lists and final decision of noun + three verbs 
  • 30 sketches for selected verbs, in three separate images -- one verb per image. piece together in photoshop if necessary

Friday, September 18

2B :: KINETIC TYPE :: brainstorming

once you have a single direction decided upon, work on expanding your motion ideas in both breadth and depth. try to come up with more ideas as well as roughly storyboarding those ideas out over five frames to show the idea’s progression. these can be digital or analog, but analog is probably less restrictive -- use your discretion and don’t restrict yourself by using only digital tools.

is this exposition, narration, or description (argument and drama are probably not appropriate here)? how does that shape typeface/lettering choice, color choice, motion quality, character, etc?

what is the duration of your action in the real world? how does that affect its representation in your work? will you remain consistent with actual elapsed time, or change for clarity or dramatic effect?

what is the quality of the motion you are depicting? how is that conveyed through the elements of design and not just the motion itself?

for next class
add five new ideas to each of your verb ideas, for a total of 30 sketches -- 10 sketches per verb. each sketch should consist of a five frame storyboard.

Wednesday, September 16

2A :: KINETIC TYPE :: action/object concepting

while the first project looked at image, duration, and editing to create a narrative, project two will focus on the text communication channel and the temporal elements of motion and transition. you will name objects from your activity and use that typographic name to communicate an action through motion over time on the screen. that typography in motion will be edited together with project one to develop a more complex narrative. 

project objectives
  • interpret principles of 2-d design within temporal media 
  • learn the basics of story boarding to convey movement, direction, the passage of time and mood 
  • explain how messages are constructed over time 
  • develop a range of form generation methods from analog to digital 
  • explain the differences and qualities of digital and analog motion 
  • apply the communicative potential of the various temporal elements (duration, motion, and transition) and communication channels (image, text, voice, music, sound effects) to classroom projects 
  • apply knowledge of proper planning and creative processes (ideation, story boarding, writing, file management, editing, and presenting) to classroom projects 

as the foundation of your typographic narrative, you will identify by name a couple of objects (nouns) that can engage in three actions (verbs) that are related to your activity in some way. 

examples for my activity “playing guitar” 
object (noun) = “strings”; actions (verbs) = “bend”, “vibrate” and “break” 
object = “guitar pick”; actions = “flex”, “slap” and “scrape” 

carefully consider the relationship of your nouns to your existing “motion capture” project. should the relationship be explicit or implicit? should your words seek to specify or expand meanings? 

color and typeface/lettering choice is open on this project. while choosing typefaces or lettering style, look closely at the form and detail of the letters and think about their formal relationship to your words before choosing. attempt to visualize a formal connection between the chosen type and the object words which function conceptually as a unit. read and think about what your three event/movement words mean. begin sketching ways to animate the letters of your object word to reflect the event/movement ideas. DO NOT consider how this might be done within the software. that is a dangerous limiter of creativity. 

  1. noun + 3 verbs 
  2. noun + 3 verbs 
  3. a range of appropriate typefaces or lettering styles for each noun 
  4. five thumbnails (min) for each verb, visualizing a frame or two of how the animation might develop; 30 sketches (min) total. sketches do not have to be done within frames of a storyboard, they should be much looser than storyboards and explore as many visual ideas as possible. 

during next class session, you will be choosing one of those object words to create your narrative, consisting of three actions.

Friday, September 11

1F :: MOTION CAPTURE :: presentation

two to three minutes will be given for presentation of your work. show your work to the group and tell us what you learned relative to the project objectives below. address the ones most relevant to your learning process. 

  • demonstrate a compelling and clear use of sequence in narration. 
  • explain how messages are constructed over time. 
  • demonstrate how point-of-view adds interest to a narrative.
  • learn the basics of story boarding to convey movement, direction, the passage of time and mood.
  • experiment with a variety of media to tell stories.
  • interpret principles of 2-d design within temporal media (balance, contrast, direction/motion, emphasis, rhythm, unity).
  • explain the affordances of screen-based linear narratives in relation to printed communications.
  • apply precise craft to the creation of story board panels and overall presentation.
  • engage in thoughtful and positive group and one-on-one critiques. 

four to five minutes will be given for class critique. each student has seven minutes total for presentation and feedback.

1E :: MOTION CAPTURE :: editing

now that you have been armed with some basic knowledge of how to approach editing, see what you can accomplish with both a combined book and movie. work out a range of ideas for combining both points-of-view. what types of edits can you manage? does it work to try and match your movie to your book, or vice versa? do they need to be the same, or should you take advantage of each medium and its affordances to do something different? select the best edit for each medium and prepare them for final presentation.

artifacts due
three books -- two original actions and one edited book combining the two p.o.v.s
two storyboards -- from your original 20 frame narratives
three quicktime movies -- two original p.o.v.s and one edited movie combining the two p.o.v.s. use the following naming convention:,,
if you share a last name with someone, use, etc.

turn in all three books and storyboards; before crit, place digital files in my CAS dropbox: faculty > tgalloway

Wednesday, September 9

1D :: MOTION CAPTURE :: putting movies on vimeo

  1. go to
  2. click "sign up for vimeo" on the right side of the screen.
  3. go for the free "basic" account.
  4. you will receive a confirmation email, to which you have to respond.
  5. once you're in, click "upload a video".
  6. read over the compression guidelines info to make sure your video is as high quality as possible. most of these issues are covered in my demo steps.
  7. hit the "upload a video" button and browse to your file on your computer.
  8. add in a title and relevant info and hit "save".
  9. you will have to wait in line for your video to be processed, so be patient.
  10. all done!

1D :: MOTION CAPTURE :: making movies

today we're going to create a basic stop-motion animation using flash.

once your 20 storyboard frames are digitized, create a layered psd file of them.
- final animation and photoshop files = 720 x 480 pixels, 72 dpi, RGB color mode

scan your frames above our target size and resolution at, for example, 105% or 144 dpi. scanning them at a higher resolution and slightly larger format will allow you to make any necessary quality and cropping adjustments in photoshop.

stack your frames sequentially in a multi-layered photoshop document a bit larger than your scanned images to allow for your adjustments. you can now easily fine-tune frame by frame alignments by turning layer visibility on or off and moving the frames as necessary. wait until all image adjustments and alignments are made before cropping and resizing to the final format. be sure to keep the larger version saved with a different name in case you need to readjust anything.

in flash, start a new document that is 720 x 480 px, 30 frames-per-second. these settings can be found in window > properties.
select file > import > import to stage. select your desired psd file.
- select the layers you want to import, say "convert to keyframes" and "place layers at original position"
- this will auto-magically give you a sweet stop-frame animation.
- to adjust speed, grab keyframes and drag them back and forth on the timeline.
- to export as a quicktime movie, select file > export > export movie.
- select quicktime format and hit "save".
- in "export movie", select "quicktime settings" and select "video settings"
- under "compression type", select H.264. under "frame rate", select "automatic", and under "compressor quality" select "best" and hit the "best quality" radio button.
- hit export.
- done!

next class
have one quicktime movie of each action ready to show the group.

final books
remember that 10-frame book we talked about at the very beginning of the project? make two final copies of each book -- four total. use good quality paper and add front and back covers. the front should state 1) the event/experience, 2) point of view, and 3) your name in simple typesetting, in black and white. here are the exact specs:

- 7” wide by 4” high, trimmed and french folded (fold on the outside edge, not at the spine). 14” x 4” unfolded.
- image area is 6” x 4” with a 1” margin for binding with two bulldog clips. take off the silver thingies.

your blogs
post pics of each spread from your two books. you will have 10 pics total. label your post “NA”.
post your two quicktime movies to a vimeo account and embed to your blogs. let me know if you can’t figure that out and i’ll provide instructions.

understanding comics pp 74-93, available on library reserve.

Thursday, September 3

1C :: MOTION CAPTURE :: revised friday deliverables

friday's class (sept 4) will be primarily a work day, with a break for the "narrative vs story, part II" lecture. all that is due is progress toward the deliverables from last class. everything that was due for friday will be due next class session, so you have this extra day to do your work.

there is a ton of stuff due, so make very good use of your time between now and friday, as well as good use of your time in class friday.

a quick re-cap of deliverables for next wed, sept 9:
  • read "understanding comics" pp 60-73
  • two finalized 20-frame narratives, each mounted on board
  • digital files of each storyboard image.
  • blog documentation of each storyboard

see the previous post (below) for details.

Wednesday, September 2

1C :: MOTION CAPTURE :: storyboards

in class:
- desk/small group crits to determine final two narrative approaches.
- find+share
- narrative lecture part II.

select a final rendering style for each p.o.v.; two total. your two final narratives will be developed into two 20-frame, fully rendered storyboards.

what needs to be done to double the amount of information in your narrative? is it simple enough to add frames in between each moment in the action you’ve captured in images? are there other ways to approach this?

each storyboard frame will be output at half size -- 3” x 2”. final display specs are here. make sure you have digital files for each frame that are fairly high res -- about 1000 pixels wide, minimum, would be ideal.

snap a photo of each storyboard and post it to your blog. label it “NA” of course.

understanding comics pp 60-73, available on library reserve.