The Aesthetics of Real-Time Entertainment             5/4/98

Introduction

I would like to introduce you to an emerging medium, the Digital Comic, a unique form of real-time entertainment on the web. A combination of web page development, and the real-time 3D simulations of online virtual worlds, this new form of animation combines comic style layout and narration with the cinematic qualities of an online movie to produce an experience that goes far beyond the static reality of a the conventional web page. But also, as a mechanism for showcasing 3D virtual worlds, the interactive narrative provides an important context for interaction. This may perhaps address the problem of many online communities; devoid of context, interaction becomes meaningless.

In addressing virtual worlds in general, often there is an attempt to recreate real-world physics by following a very literal paradigm. While instructive, these mundane simulations show very little artistry. So keen on tackling the very difficult technical problems of collision detection, rendering, and z-buffering, aesthetic issues have often been relegated to a secondary position. However, as this industry matures, it is encompassing the interdisciplinary concerns of interface design, environmental and architectural design; plus cinematography, lighting, narrative, and character development, to name just a few. As a result of this growing aesthetic awareness, real-time entertainment is rapidly moving from an archaic to a classical stage of development, striking a synergistic balance between technical constraints and aesthetic possibilities. The rise of such technologies as VRML (Virtual Reality Modeling Language) has allowed content developers to create large interactive worlds on the Internet, whose file sizes are relatively small. Although they often exist as surreal simulations, lately a strong narrative component have given rise to "Webisodes" small episodic films on the Internet.

At first glance, the task of developing compelling content for the web seems daunting. Thus many developers succumb to the notion that limitations of bandwidth and CPU cycles will necessarily restrict their handiwork to crude facsimiles of their original majestic conceptions. But by invoking the aesthetic principles gleaned from a variety of other disciplines, one may find creative ways of evoking mood, ambiance or gesture without having to render it in full-blown literal detail. My goal is to showcase projects that transcend the medium of real-time 3D by adhering to aesthetic principals gleaned from traditional film and animation, taking into account plot, narration, and character development, discussing how these are supported by the aesthetic concerns of camera, lighting, and, if applicable, editing. Also important are user interface issues, i.e. how to incorporate the 3D animation browser within the 2D layout of the screen. And finally, I will address the issue of the computer medium itself, discussing technical issues where appropriate.

Crutch

The first prize for aesthetic innovation goes to Mark Meadows, Chief Creative Officer of Contruct, a development house in San Francisco that constantly tries to push the envelope of what is possible on the Internet: http://www.construct.com/. The project of theirs that I wish to discuss is called "Crutch," and as such serves as a metaphor for modern man’s dependency on technology: http://www.bore.com/crutch/.

Based on the Promethean legend, whereby mankind is forever altered, for good and for ill, by the introduction of fire, the modern day Crutch can barely stand on his own; his literal crutch then stands as a metaphor for technological innovation. This project began as a rather macabre short story about a man walking through the desert who keeps falling apart, so he fabricates new devices of holding himself together, until ultimately the splinters collapse under their own weight. I think this is meant to someone simulate our own relationship with technology, the complexity of our hardware and software environments, a seemingly jury-rigged collection of fixes, one big hack. At one point, the protagonist collapses onto the ground, strewn with translucent numerical values, which both adds texture while alluding to the theme of technology. By couching our own dilemma within a broader mythological context, the experience is all the more rich, satisfying our archetypal yearnings.

Thus, the crippling effects of technology cause us to question our own dependency. Mirroring the alienating world of our own modern times, Crutch’s apocalyptic realm is sparsely inhabited, a Wasteland that that he shares with the scavenging Buzerd and the apathetic Io. The degraded banding, an inherent issue of a limited palette, along with the decomposing type on the front page, effectively sets the mood for this overall theme of degeneration.

Camera, Lighting and Atmosphere

The limitations of the 3D browser are minimized by contextualizing a small 3D window within a layout of 2D still images. By situating the smaller window of animation within a layout of stills, the viewer infers detail in the 3D scene that is alluded to in the subtly enhanced 2D stills. By having the animation take up only one fourth of the screen, it runs much faster. Yet the user does not object to this small 3D window, because the surrounding panes are filled with related images that support the narrative. For example, in the opening scene, as Crutch hobbles along an empty plain, surrounding frames show a road lightly dappled in shadow, clouds in the distant sky providing and endless atmospheric perspective. Although texture mapping is not implemented in the 3D browser, this is not readily evident, as one tends to project onto the 3D viewer the detail that is only evident in the 2D stills. Similarly a cast shadow on the ground of the 2D stills gives weight to the character, even though cast shadows are not implemented in the 3D browser. But because of their proximity, the viewer automatically fills in the blanks.

Although the requirements of real-time 3D necessitate a more abstract environment, especially in the case where most of the attention is placed on the character, the sparse terrain is still rich, as lighting and camera movement creates a world of mood and suspension. A rich golden light imbues the scene with a nostalgic sense of expectation as the sun seems to have just set in the distant horizon. This subdued lighting that leaves the face of Crutch mostly in shadow provides a Noirish sense of angst and despair. The gradations of light and color that comprise the earth and sky are actually a very cheap but effective trick in VRML, giving a sense of endless space and implied detail. Note that as the cursor scrolls over images, often textual commentary appears, a feature which could be used to support the narrative. Thus, this interactive medium combines the narrative element of film with the compositional elements of the comic strip to create a very rich experience despite bandwidth limitations.

Non-Linear Multiple Perspective

Because of the hyper-linked nature of the medium, the narration is necessarily non-linear, allowing one to jump from various points of view in a random fashion. There are three characters, Crutch, Buzerd, and Io. The nature of the medium, in this case VRML, allows one to predefine several cameras, allowing the viewer to adopt a variety of perspectives. This technique of pre-defining the camera has the advantage of allowing the developer to have complete cinematic control over the environment; and differs from other VR worlds, in which the user freely navigates through the world, a camera mounted onto one’s virtual "third eye". Debates abound over which technique is inherently more immersive. One could argue that by controlling the movement of the camera, the developer can create an experience that is all the more immersive by maintaining a classical narrative structure. By allowing first person user navigation, the user has more freedom, but is also burdened by the task of navigating through a foreign virtual world. By completely controlling the camera, "Crutch" operates more as a traditional film, but unlike a movie the user has a choice of multiple perspectives, allowing one to interweave the viewpoints of the various characters.

3D Character Modeling

Similarly, by modeling the characters "roughly" the artists at Construct have also transcended one of the seeming limits of 3D computer animation, which is, that it is much easier to create objects that are glossy and new versus rough and dirty, true to life. Typically we rely on skilled texture map artists to create works that are rough and gritty, but here that quality is actually achieved through the modeling alone; textures are not implemented. In the case of Buzerd, this is achieved by exploding the model into individual facets, giving the bird a feathered look. This technique also exploits the problem of clipping planes endemic to real-time animation. When two planes are too close together, the rendering engine has a difficult time calculating which plane to draw. When this happens, shearing occurs, as planes come in and out of view. This quality of tearing, anathema to a slick 3D game, actually endows Buzerd with a ruffled texture, and complements the character of Crutch, whose splintered and shattered state exemplifies extreme angst. Characters are also "roughed up" by intentionally varying the amount of surface smoothing. Note that on Crutch’s body, smooth areas are juxtaposed with rougher areas, where the facets that comprise his body are intentionally discernible. Similarly, in some areas, surface normals are reversed, leaving holes in the character’s body. By abandoning the slickness that is inherent in 3D modeling, the plight of these characters seems much more real.

A Partial Walk Through - from Buzerd’s Perspective
(Thanks to Mark Meadows, Cheif Creative Officer at Construct for providing these samples).

If you do not have a 3D browser, you may enjoy a 2D walkthrough: http://www.construct.net/projects/walkthru/.

http://www.boar.com/crutch/structure.cgi
Illustrating the tri-part structure, a three ring VRML file on the right, and a 3 part image on the left link you to various parts of the story, laid out in a 2D comic book style. By clicking on the various 3D rings in the VRML file, the user is taken through the story from the point of view of Crutch, Buzerd, or Io. Each HTML page provides a different scene.

http://www.boar.com/crutch/buzerd/02.html
In this scene, Buzerd espies a motorcyclist. Once again, the actual motorcyclist is not moving. The bike’s movement is simulated by the twin motions of the circling camera and the oscillating yellow lines on the pavement that zip past the cyclist, creating a compelling illusion of fast motion.

http://www.boar.com/crutch/buzerd/03.html
This page shows a very expressive use of page layout and composition. The top, bottom and right part of the page is filled with static 2D images, but the left quadrant shows an animated version of Buzerd flying in VRML. Although VRML files typically allow the user to control the camera movements via first person navigation, in this instance VRML is used more cinematically, the motion of the camera pre-defined for us so that we see the desolate wasteland through the eyes of the flying Buzerd. In this scene, Buzerd is actually flying in place; the camera is circling around him to simulate motion. First the camera is under the bird, looking up at his belly, deep in shadow. Then the camera quickly pans up and away from the bird, simulating a sense of flight. Although this is a looping animation, it does not seem to be at all repetitive, because the flap-flap-glide motion of the wings is off sync with the camera motion, which circles the bird much as he circles in search of carrion below. The narrative is advanced by clicking on one of the panels, which takes us to the next scene, another hybrid of 2D imagery and 3D animation. By placing our cursor over the various images, supporting text appears. Thus, by combining the structure of an online comic book with that of a 3D movie, the limitations of bandwidth are transcended by contextualizing the fairly small window of animation within a larger narrative context.

http://www.boar.com/crutch/buzerd/04.html
In this scene, point of view is manipulated so that Buzerd's perspective is emphasized, the frame punctuated by his flapping wings with the disassembled Crutch below.

http://www.boar.com/crutch/buzerd/14.html
Here an untraditional layout frames the image of the feeding Buzerd. Note how the grittiness of the background image complements the cleaner visuals of the VRML animation. The camera circles around Buzerd, much as he circles around his prey.

(end for now; please explore these pages on your own)

This page last updated on May 4th, 1998.
Copyright © 1998 Stasia McGehee.