Skip to content

Motion Graphics

Motion Graphics

The State of the Internet (in 5 minutes)

March 24, 2010, 10:47 AM

JESS3 created this video for an AIGA Baltimore lecture. I found the content very fascinating. Two nits in an otherwise excellent piece: 1) the pacing could be better with more interesting transitions between the different subject matter, 2) use correct apostrophes!

» 1 comment


Motion Graphics, Typography

Re-Typesetting the Star Wars Crawl

December 10, 2009, 03:15 PM

Recently Guillermo Esteves did a fantastic experiment with HTML5 and CSS3 by recreating the opening crawl to Star Wars. Although it only currently works in Safari 4, it’s a good preview of how to create something dynamic using web standards and web fonts once the other browsers come along.

But Guillermo’s experiment also reminded me of how awful the typography was of those opening crawls. The original Star Wars opening crawl uses two different typefaces (three if you count “A long time ago…”), is justified without hyphenation, and thus creates obvious rivers and awkward tracking.

Opening crawl from A New Hope as grabbed from the DVD.

As the subsequent movies came out, the typography was all over the place. The Empire Strikes Back dispenses with letter-spacing altogether. Return of the Jedi overcompensates for the failure of the previous two crawls by using too much letter-spacing.

Opening crawl from The Empire Strikes Back. What happened here? I can drive many trucks through those spaces.

Opening crawl from Return of the Jedi. Standbackafewfeetandtrytoreadthatlastparagraph.

The absolute worst though was when ILM matched the style for the Star Wars prequels. At least there was more tracking in the original 1977 version. The 1999 version of the crawl that appeared in The Phantom Menace lacked any letter spacing whatsoever and created huge holes between the words that made the crawl barely readable. (No offense to special effects god and Photoshop co-creator John Knoll. He’s great with FX but he’s not necessarily a designer nor typographer.)

Opening crawl from The Phantom Menace. Shit in = shit out. It’s a tragedy that they used Empire as the model.

I set out to do a quick experiment—to see if I could redo the crawl any better. The first thing I did was to standardize on one typeface. The “A long time ago…,” title and body copy are all Franklin Gothic. Then I tried a version where I kept the justified alignment but decreased the type size. The copy becomes much more readable, but feels too small and loses that epic quality George Lucas was probably after.

Then I simply tried centering it and I think it works. I am able to keep the type size large without creating large gaps between words or letters. Although the very straight sides are lost, I think the intended dramatic effect is still there.

And of course I had to whip it up in After Effects to really test the design.

Yeah, file this under geekery.

» 8 comments


Good Design, Inspiration, Motion Graphics

True Genius

August 19, 2009, 09:52 AM

True Genius

I recently got on the True Blood bandwagon. The first thing I noticed of course was the stunning main title sequence designed by Digital Kitchen. If you haven’t seen it, watch it below (or in HD) and then see how DK made it. I will sit through the main titles every time. It’s beautiful, haunting and mesmerizing.

Thumbnail image of main titles from Art of the Title Sequence

» 5 comments


Page 1 of 1

About

Although he has been designing since the seventh grade, Roger Wong officially began his design career in 1995. He is currently a creative director at PJA Advertising + Marketing in San Francisco.

This site is an outlet for his musings on design, advertising and culture.