Practical Applications of 3D in Flash

The early days of Swift 3D sort of remind me of the early days of Flash. People were so excited to finally have a great new tool to create cutting edge Web content, but were often struggling to find the best uses for that content.

When Swift 3D arrived in the spring of 2000, it quickly satisfied the need for designers wanting to create 3D animation for their Flash projects, but this new found ease of creation didn’t speak to the larger question of Why?’ Using 3D just for the sake of having 3D on your site was the same mentality that led Flash to cycle through its “Skip Intro” phase where usability was sacrificed for whiz-bang eye candy. Swift 3D’s equivalent would be the “Spinning 3D Text” phase that has thankfully fallen by the wayside. (My apologies to those of you who still have your company’s name rotating around like a 1950’s road sign.)

Fortunately, evolution in today’s world of technology doesn’t take long. Within the last three years we’ve seen great strides being made in taking these powerful technologies of rich media Web design and 3D animation to the next level the level of practicality. By focusing in on how we use our technology rather than the technology itself we can now point to myriad of situations where the use of 3D in Flash design can be a huge benefit.

I have the feeling that there are lots of people out there who see the world of 3D as something that pertains only to film and TV producers and not the average Flash designer. When you bring up that pesky Z axis concept, many will slip into the “not relevant to me” 1,000-mile stare. This article will hopefully dispel this myth of irrelevance by focusing on a handful of real life situations where the purposeful use of 3D can bring substantial benefits to any Flash developer, even if their eyes are starting to look a little glassy right about now.

Educational Projects There’s no refuting the fact that we are visual beings, and by our very biological nature tend to learn things most efficiently through our eyes. As the Web begins to converge with both TV and the big screen we are now growing to expect more engaging experiences when it comes to education online. Let’s face it, if you turned on the Discovery Channel and they showed you page after page of text, you’d be searching for some Seinfeld re-runs pretty quickly. As the level of rich media educational materials on the Web increases, so does the demand for supporting 3D animations. Our eyes like pictures, but they are capable of gleaning much more information from the more realistic world of 3D.

I’d like to point you to a phenomenal educational project produced by Second Story. It’s called Yin Yu Tang: A Chinese Home (www.pem.org/yinyutang/) and is a perfect example of how 3D can ratchet up the learning factor. As you tour a reconstruction of a traditional Chinese home you can literally see inside the structure and better get a feel for what it was like to live there more than two centuries ago.

Concept Visualization and Diagramming 3D can be a very effective tool when it comes to explaining complex concepts in a diagrammatic way. Sure, you can explain how your company’s or client’s products, technologies or services work with a paragraph of text, but often times you can get the point across faster and more accurately with a simple 3D animation. Long, textual explanations often illicit the glassy-eyed head nod’ from a site visitor, whereas a clear animated diagram with some 3D elements will likely receive the coveted, “Ahhhh, now I understand how that works” reaction. The nice thing about creating conceptual diagrams is that you don’t have to produce detailed models to get your point across. In fact, simple objects are often better since it’s the animation that really tells the important story.

A perfect example of this concept can be found on the Slide-Lok Cabinet Web site (www.slide-lok.com/assembly/S4834.shtm) where they utilized Swift 3D and Flash to show the assembly process for one of their cabinet systems. It’ s pretty darn simple, but I would have killed for something similar as I attempted to turn 846 pieces of wood, metal and plastic into something my daughter could swing on last summer.

Virtual Tours For the ultimate armchair experience there’s no comparison to the power of 3D walkthroughs, unless of course you want to stream some serious video. And even then, there are plenty of situations where you might be creating a tour of something that either doesn’t yet exist (think architecture), will never exist (think fantasy game) or used to exist a long time ago (see below).

As an example of this last case, Second Story (they’re pretty high on my usability list these days) was tasked with the challenge of re-creating an archeological site in Egypt for the online audience. In their Theban Mapping Project (www.thebanmappingproject.com/) they created a 3D Tomb tour that allows you to walk through several of the tombs located within the Valley of the Kings. By integrating static imagery and 3D renderings they have opened up a section of history for anyone to experience in a very realistic (and educational) manner.

Marketing Communications and Product Demonstrations Just a quick glimpse at TV these days will verify the fact that 3D has everything to do with polished marketing materials. And if you want to take it to the most extreme level just watch Monday Night Football and you’ll be exposed to a steady stream of sexy 3D graphics and animations. The fact is that nicely done 3D creates an engaging sense of professionalism on any sized screen. 3D can also be utilized to display realistic renderings of products that allow viewers a more tangible method of evaluating a company’s offerings.

If you’re looking for some evidence to support these claims, head to the Smirnoff Ice site (www.smirnoffice.com/) and you’ll see a nice blending of 2D and 3D animations designed to convey a specific marketing message to their twenty-something audience.

Games and Entertainment It’s fairly easy to look to the gaming world for case studies on how 3D can create a highly engaging and interactive experience. Now that online games are becoming more popular we’re seeing some very nice 3D work being integrated into Flash-based games.

There’s no better example than G-Max Skateboarding (www.gmaxskateboarding.com/game.asp), which won the People’s Choice Award at Flash Film Festival 2002 San Francisco. The game developers utilized Swift 3D to create many aspects of the game’s interface, as well as the skaters themselves, and then pulled it all together using Flash. Be careful if you visit, the game can be pretty addicting.

Get Yourself Illuminated

I often find it tough to explain the real benefits of 3D without some visuals on hand to drive my point home, thus the extensive use of example links in this article. For this very reason, Electric Rain has committed some serious resources over the past three years to demonstrate these benefits through our own online projects. DevLab (http://devlab.swift3d.com/), our first experimental site and winner of Macromedia Site of the Day, was a huge success because for the first time people could see a series of diverse uses of 3D. Next was our FlashintheCan award winner, Swift 3D Extreme (www.swift3d.com/extreme), which has gathered more than 3,000 comments over the last year of its existence and again provided Flash designers with inspirational ideas to bring to their own projects. And now we have launched our Flash Illuminations project (www.swift3d.com/illuminations)which sets a new standard in how well Swift 3D compliments Flash MX.

Of course, we also realize that finding inspiration is relatively easy compared to the designing, modeling, rendering, integrating and coding necessary to actually pull a big time project like Flash Illuminations together. So we’ve gone the extra mile and not only have we posted the source files for people to dissect, but we’ve also included multimedia tutorials for each section of Flash Illuminations, offering the blow-by-blow details of what it takes to build cutting edge 3D Flash projects with today’ s design tools.

The lead designer for Flash Illuminations, Jim Foley, is a good friend and coworker of mine so I may be slightly biased, but I dare say that this project exemplifies all that is good in the world of 3D and Flash. As applications like Flash MX and Swift 3D continue to evolve into powerful multimedia development tools we can proudly look back on the history of Flash and know that our work is now with great purpose. As Macromedia has so succinctly put it, Experience Matters, and after a visit to Flash Illuminations or any of these aforementioned example sites I think you’ll agree that evolution is a great thing. Personally speaking, I think the Web is looking pretty sharp without that tail.

Nicholas Petterssen is a Product Designer and Documentation Writer at
Electric Rain, Inc. (www.erain.com). Electric Rains Swift 3D product line
allows designers of all skill levels to create 3D animations for use in
Flash-enabled Web sites. Nicholas telecommutes to Boulder, Colorado from a
small farm in the hills of Vermont and never forgets to slop the hogs before
work.