15
Jan
2007

Using Flash (and PDF) tastefully

The Flash runtime is great for certain uses. Rich content is one obvious area. Video, animations, etc., are great uses for Flash. Complicated application UIs are another. Once you get past a certain threshold, it isn’t practical to build an application UI in HTML. Virtual Ubiquity’s word processor comes to mind. It looks and feels like a desktop word processor, and it would just be insane to do this in HTML.

For sites that could be done effectively in either HTML or Flash/Flex, it can sometimes be hard to use Flash tastefully. I mean.. I’m a Flex guy, but there are times when I visit a Flash-based site and I wish it were done in HTML instead.

I don’t know if there are any hard and fast rules for when to use HTML and when to use Flash. Instead, I like to look at examples. Here are two examples of sites that have blended HTML and Flash together very effectively:

CNN

CNN is doing a special section on Dr. Martin Luther King’s papers. The navigation is done in Flash, and the physical documents are reproduced in PDF. A section at the bottom of the page provides extra links in HTML.

The Flash area makes this special section feel more like an interactive magazine than a set of HTML pages. The visual design is more magazine-like, and the animation between pages reinforces the chronological relationship between the sections. Sound recordings of famous speeches are embedded directly in the page. Video is also embedded in the page (although in this case, it kicks you out to a separate player.. I think this would have been nicer to do in place).

Etsy

The other example of a hybrid HTML/Flash site I like is Etsy, which is a site for people to sell hand-crafted items. In terms of site design, what sets this site apart from other e-Commerce sites is the creativeness of their visualizations.

Want to see the most recent items that people have posted to the site? Try the time machine. If that is too wacky for you, try time machine 2. You can also see items by color geography, etc.

Not all of these visualizations are 100% successful, and I am sure that not all of them are 100% original. For example, the first time I saw an interface that used physical cards that could be spun around and thrown was over three years ago at www.intentionallies.co.jp, designed by Yugo Nakamura.

What strikes about Etsy, though, is the balance they strike between HTML and Flash. Whereas Intentionallies comes across as an avant-garde interface built in Flash as a replacement for HTML, Etsy comes across as a comfortable blend of HTML and Flash. HTML is used where it makes sense, and Flash is used where it makes sense. It doesn’t seem forced. It seems natural.

Leave a Reply