10 Contemporary Graphic Design
 

The Technology Aesthetic

 

Digital Idealism

Another strong trend in graphic design of the 1990s was the embrace of a hybrid style inspired by references to science fiction, video games, and technology. In stark contrast to the expressively distorted work of grunge designers, artists who pursue a technol­ogy-informed style tend to imagine a world where forms and surfaces are smooth and unbroken. While glimpses of a futuristic world first appeared in the work of Wolfgang Weingart and April Greiman in the 1980s, the focus on a "technology aesthetic"— akin to the machine aesthetic of earlier decades—greatly increased in the early 1990s. This new crop of designers have completely rejected the awkward "primitive" look that had appeared in the 1980s at Emigre in favor of a reductive, and notably textureless, aesthetic that is partly derived from the virtual worlds depicted in video games. For a time, this technological look proved to be absolutely intoxicating to graphic designers.

Conceptually, the acceptance of technologically influenced design was driven by what was thought to be the infinite potential of digital technology. Designers became caught up in a frenzy of speculation about the enormous social changes that were soon to be wrought in the digital age. In a parallel to the embrace of the machine that had characterized the 1920s in Europe and Russia, people believed that the digital age would utterly transform society for the better; overblown speculation as to the spread of peace and justice throughout a new world driven by digital information was rampant for several years. A 1993 statement by Mitchell Kapor (b. 1950), software designer and founder of Lotus Development Corporation, sums up people's faith in technologically spurred social change. "Life in cyberspace is more egalitarian than elitist, more decentralized than hierarchical ... we might think of life in cyberspace as shaping up exactly like Thomas Jefferson would have wanted it: founded on the primacy of individual liberty and a commitment to pluralism, diversity, and community." The reference to Jefferson encapsulates how deeply held was the belief that technology was leading to the founding of a better society. Artists and other thinkers expected to welcome this new age— which never quite arrived—with open arms, and many people were overjoyed at the prospect of a coming "technotopia."

Wired Magazine

One of the major publications that encapsulated the belief in a coming technological Utopia was Wired magazine, founded in 1993 in San Francisco, near the heart of America's "Silicon Valley." The editorial team at Wired, led by publisher Louis Rossetto (b. 1949) and art director John Plunkett (b. 1974), sought from the first to use a visual style that would signify the magnificence of the coming age of technological wonders, justice, and prosperity. Rossetto wrote in 1993 that he foresaw "social changes so profound their only parallel is probably the discovery of fire." Rossetto and Plunkett's most famous innovation at Wired was the "mind grenade," which consisted of one or more double-page spreads that took the place of the conventional "editor's note" in many magazines. Each "mind grenade" consisted of a quote from that month's issue, chosen by Rossetto, matched with lively graphics, overseen by Plunkett. The very first issue of Wired featured a mind grenade that combined a quote by Marshall McLuhan (1911-1980), the innovative theorist who had predicted, long before the digital age had begun, that evolving technology was going to have a tremendous impact on modern society. The text that accompanies McLuhan's words is designed not so much as an illustration of them as a visual accompaniment (fig. 10.19). Plunkett had an enviable budget in planning the images, as the magazine was printed using a six-color process that far surpassed even the most glossy commercial publications of the day. Using a synthesis of scanned photographs, Adobe Illustrator, and QuarkXpress, the dominant layout software of the decade, Erik Adigard of M.A.D. created a richly chaotic image that grabs the viewer with its fluorescent colors, a palette that would become the standard at Wired. A greenish solarized image of a father and son watching television anchors the spread. It has been layered with a collage of red and orange fragments of faces, computer and television equipment, and lettering. The kinetic visual punch of this image is stunning, while the frenzied blend of fragmented forms shows how the grunge and technological aesthetics over­lapped in their embrace of frenetic layered designs.

     Wired issue 3.02 (a numbering system that affected that used by software developers) featured a mind grenade that delved into computer viruses. The quote by Julian Dibbell, a well-known journalist, states that computer viruses are "a carrier for the purest and strongest signal a human being can send." Of course, the euphoria of the early 1990s allowed a statement like this to be made completely without irony. The design by Johan Vipper b. 1955), a Swedish expatriate based in New York, is a dense fluorescent web of abstract shapes hurtling horizontally across the spread (fig. 10.20). The cool palette of the image contrasts with the warmer colors and vertical emphasis of the letters, which seem to float on top of it. A strong red line, perhaps suggesting the path of a computer virus, shoots under the middle row of text, giving the page a clearly divided structure. Fractured bits of red type as well as graffiti-like scrawls become visible when the image is studied closely. This image is typical of technological utopianists beginning with the author William Gibson (b. 1948), many of whom focused on depictions of the "net" or the "matrix," the immaterial world of cyberspace.
 

10.19 John Plunkett, Wired, No. 1.01, 1993. Magazine collage. Courtesy Wired Magazine.

10.20 Johan Vipper, Wired, No. 3.02, 1995.

Techno Type

Dirk Uhlenbrock (b. 1964), a typographer and graphic designer based in Cologne, Germany, publishes his work through his firm Signalgrau Designbureau. Many of his fonts display the sleek, stylized shapes that would be at home in a video game spaceship. For example, Electrance, a sans serif with unstressed letters, features horizontally proportioned forms and smooth regular curves (fig. 10.21). Most notable is the way the "U" and the "V" are almost identical except for the addition of a squared corner on the latter. This sort of typography brings up a more general facet of technology-inspired graphic design; it imagines the world of science and technology as a stylish one, where information flows freely across impeccably designed interfaces. Electrance and other fonts like it are a far cry from the chaotic disorder shown in Wired; here there is nothing expressed that is outside of the control of the designer.

Carlos Segura (b. 1956), a Cuban-born designer now based in Chicago, has released a number of fascinating typefaces through his [T-26] Digital Type Foundry, which he founded in 1994. Tim Marcus's Taser face, released by T-26 in 1999, uses regular dots that appear futuristic, just as the name is borrowed from a high-technology weapon, the taser stun gun. Taser also invoked the recent past, in this case the bit-mapped fonts of Zuzana Licko from the mid-1980s (fig. 10.22). The tendency for styles to come and go and then be revived as historicist, or retro, only a few years later is an important development in recent design. Formerly, historicism implied the revival of something that was at the very least a few decades, if not a few centuries, old. In current culture this process has speeded up tremendously, so that a revival of the 1980s has already come and gone early in the twenty-first century.

Like the digital world itself, the technological aesthetic of the 1990s was quickly adopted by commercial forces that wanted to appear futuristic to consumers. In 1995, the Me Company, based in London, made a series of posters for Nike that demonstrated how effectively the technological style could be applied to sports advertising (fig. 10.23). Featuring a cryptic blue background that could easily be the inside of a space station or even the core of a computer, the foreground of the poster shows a cyborg soccer/football player, part man and part machine, shooting missile-like balls at the viewer. Cyborgs, a name given to techno­logically enhanced humans, had become a staple of video game culture by the mid-1990s, and this madly grinning creature would be familiar to a young audience. The smooth, textureless surfaces of the being, including its face, are also reminiscent of video games, in which varying surfaces—metal, flesh, earth—all have the same indistinguishable, flat, featureless quality. Many games are based on fantasies of space warfare, so the heavily armed cyborg in the poster would meet many Nike consumers' taste for virtual blood sport. The lettering near the bottom of the image is also designed to replicate the type of graphical menu that is com­mon in video games. Interestingly, the conventional "Nike" and the swoosh logo that appear next to this technologically styled text seem sorely out of place, its inexpressive sans serif and simple form starkly contrasting with the dense color and kinetic energy of the rest of the poster.
 

10.21 Dirk Uhlenbrock, Electrance Typeface, 2002. Courtesy D. Uhlenbrock.

10.22 Tim Marcus, Taser Typeface, 1999. Courtesy Carlos Segura.

10.23 Me Company, Advertisement for Nike, The Netherlands, 1995. Poster.

Web Design 1.0: Beginnings

While graphic designers throughout the 1990s made use of new digital tools and pursued a technologically informed aesthetic, around the middle of the decade a new field arose because of further innovations: web design. While the first web browsers were introduced as early as 1990, it was not until the middle of the decade that design started to become an integral part of the World Wide Web. A key question is as follows: Is web design simply another part of graphic design, or does it constitute a separate field altogether? While on the one hand, many websites look exactly like print media and would seem to require the same set of design skills, on the other hand the complex software programs in use today to make print media are totally different from the software used for web design. In addition, as web design technology constantly evolves and offers more opportunities for motion graphics, it would seem that the two disciplines may diverge more in the future. While some individual graphic designers—and most design firms—work in both print and web media, for the most part there is still some separation between the two design spheres. Perhaps a new generation of design software will integrate print and web design more seamlessly in the future.

For better or for worse, web design has come of age over the last decade, during an era when there is no overarching move­ment, such as the International Style, to guide its aesthetic development. Also, inexpensive software programs have allowed literally hundreds of millions of amateurish pages to clutter the web, creating a chaotic visual environment where one rarely knows what to expect. (It is as if in the late nineteenth century half the population had had the ability to print posters and the hoardings of European cities were filled with the result.) This has led to a situation where it is extremely hard to identify specific stylistic trends in web design. Additionally, as the internet has rapidly become the province of market forces, many websites have been designed with functionality in mind.

Generally, the success of a website is determined outside the design community and the most important criterion is its ability to generate sales. For this reason, web design has developed an arcane subspecialty that is devoted to maximizing sales, and large retail clients such as Amazon are intent more on grabbing and holding customers and leading them by the hand through the checkout process than they are on aesthetics. In contrast, arts institutions, which have provided a forum for so much in the way of adventurous design over the last century, also commissioned some of the first daring websites. Another issue that substantially impacts the design of websites versus print media is the way in which the sites often evolve over time according to the exigencies of the marketplace.

    Many corporate websites feature designs that are derived from previously existing print media. For example, the site main­tained by the Fcdex Corporation is simple and unassuming, its most dominant feature being a logo that had been designed in 1994 by Lindon Leader of Landor Associates (see fig. 8.41). Because of the Fedex designers' desire to maintain a strong corporate identity, the website is simply an extension of its other graphic output: the envelopes, trucks, and retail stores, which already had a clean, functional look (fig. 10.24). The use of Times New Roman is equally understated, as that type was not created to call attention to itself in any way. It is likely that this typeface was also selected because of its universal availability, so that com­puters around the world could correctly display the website without the aid of embedded font technology. The modest design of the site belies its incredible technological complexity, as it allows consumers in over one hundred countries to access and manage their Fedex accounts. The multitude of international sites connected to the main page uses the same basic graphics as the American one, with the substitution of text in the appropriate language and photos that show employees of a different ethnicity.

While web design overall lacks a definitive set of styles, that is not to say that a number of sites in recent years have not been exceedingly stylish. For example, the site created by Perimetre-Flux for the San Francisco Museum of Modern Art's 010101 exhibition stands out because of its exquisite design (fig. 10.25). Particularly noticeable is the way in which the text is integrated into the graphic elements, and startling devices, such as the way in which the justified text is pinched by a vertical gray column underlying it, pull the viewer in. The most compelling element in the site is the vertical strip of abstract lines that flow through the page when the cursor crosses them, allowing the name of each of the exhibition's seven themes to alternately appear and disappear.

The viewer who tries to peruse the website of an arts institution such as the San Francisco Museum of Modern Art as opposed to a retail site will immediately notice the tremendous difference in terms of both aesthetics and ease of navigation. While the Fedex site is far from enchanting in a visual sense, its tabs and links clearly indicate to the user how to proceed with their business. In contrast, the floating, scrolling text fields of the 010101 site are difficult to manage, and there is actually a user's guide on the site to help the uninitiated make sense of it. Of course, from an aesthetic standpoint, the colors and patterns flow across the screen with an ethereal beauty that is wholly lacking on most commercial sites and a far cry from the bold, boisterous purple and orange of the Fedex pages.

   In more recent years, a new appreciation of minimalist graphics has pushed aside the baroque complexity characteristic of sites such as 010101 in favor of simple elegance. While the omnipresent search engine Google helped to pioneer this trend, there have been a number of attempts to balance visual impact with clarity. London's Fuel design group (see fig. 10.8) maintains a self-promotional website that eschews motion graphics and the like for its initial pages in favor of a straightforward list of avail­able information on their work, with headings such as "books," "magazines," and "Film & TV" (fig. 10.26). However, in order to keep the page interesting as well as to remind the viewer that this is a design firm after all, the subsequent links on the page lead to a variety of pop-up windows that are organized visually in a num­ber of ways—some are clear, some are obscure in intent.
 

10.24 FedEx Website, 2002

10.25 Perimetre-Flux, 010101 2001. Museum of Modern Art,
San Francisco, CA.

10.26 Fuel, Website, 2004.

Web 2.0: Interactivity

The buzzword "Web 2.0"—a term that imitates the numbers used to describe new releases of software—refers to the central role that interactivity plays in the latest incarnation of the inter­net. Over the last few years, a tremendous wave of change has permeated the world of web design, as corporate clients who had until recently refrained from creating so-called "rich media" web­sites now clamor for them. The companies' initial reluctance had resulted from a fear of losing customers who lacked high-speed internet access and so would be loath to wait as complicated graphics and interactive elements slowly loaded. However, the continuing surge in broadband access combined with the wide availability of Adobe Flash as an interactive web platform has revolutionized the field. Flash is a webauthoring tool that has the advantage of storing graphics not as pixels, a technique that consumes memory while putting limits on the kind of screen that can view the result, but through the vector process. The latter technology works by creating a mathematical description of an image—rather than the image itself—that can adapt itself to the specifications of just about any individual desktop computer. Flash works with many applications, and is the technology behind everything from showing video on websites like Youtube.com to the animated banner advertisements and interactive games that dominate today's internet. The Flash player was originally released in 1996, and it is estimated that today it has been installed on over ninety percent of computers world­wide, some 600 million.
In a 2006 article titled "Web Design 2.0" published on AIGA's Design Forum website, graphic designer Craig Elimeliah wrote "So now we seem to be embarking on a new kind of web, one that demands more interaction, more design, better video, clearer audio... the web demands that the story come alive, that it move and morph and twist and turn and open up video win­dows and audio players left and right. The public is now getting used to an interactive experience that has never before existed." ElimeHah neatly summarizes the situation that confronts any designer who works in web-based media; many viewers today expect to have a rich, highly interactive and, most importantly, entertaining experience if they are going to commit time to a given website. There is a balancing act at work here for the advertiser. Viewers will resist a site that appears too commercial or seems manipulative; yet, it is of course senseless to create an expensive interactive experience that does not at least increase brand recognition.

A good example of the recent push toward amusing, interac­tive websites that limit the degree of direct commercial appeal can be found in the website created by The Barbarian Group (TBG) for the Comcast Corporation, a purveyor of cable television and broadband internet service (fig. 10.27a,b). This Flash-based site, Comcastic.com, uses extended animation sequences to create a number of interactive elements, including a series of games of skill in which visitors must manipulate the computer mouse, take part in a trivia contest, and, for the less competitive, more whimsical visitors, create their own digital puppets. In the latter experience, the viewer selects one of the five available puppets that appear floating in an indefinite space, after which the puppet appears alone and accompanied by music that matches its charac­ter; for example the "science fiction" puppet is paired with a softly haunting melody. In fact, each of the puppets has a distinct visual appeal designed to correlate with different kinds of television entertainment such as westerns, science fiction, or sports. After selecting a puppet, users can add their voices to it via computer or telephone as well as choreograph its movement. Finally, an ele­ment of viral marketing is introduced, as the recorded  puppet performance can be sent as a link via email to a friend. According to one of the producers, Amanda Kelso, there is also a conceptual link between the user's ability to manipulate a puppet and the cable company's "on demand" television offerings, which are intended to offer a greater degree of interactivity and control. The most observable commercial message of the site, however, is Comcast's new brand identity, which is anchored by colorful graphics.

   The Flash-based website Free-soil.org/fruit provides a different example to the commercial-driven agenda of sites like Comcastic.com. At Fruit, interactivity acts as a compelling element in its own right while simultaneously educating and, the creators hope, even enlisting the viewer in a social cause. A protest designed as an outgrowth of the Free Soil artist-activist group, the overall goal of the Fruit project is to "elevat[e] the ecological knowledge of consumers and encourage [e] a way of life that is friendly to the environment." Using many strategies, including exhibitions, websites, and a variety of art and design projects, Free Soil hopes to engage people in finding ways to participate in reforming society in a positive way. This activist intention aligns it with the "citizen designer" movement, which is discussed in more detail later in the chapter.

The online part of the Fruit project uses interactive elements not to sell viewers something or to create general brand awareness but rather to inveigle them into joining forces with the site's creators. Visitors to Fruit can read the contributions of other visitors that appear as the speech bubbles of little people who are planted in pots (fig. 10.28a,b). This fanciful visual device, which was designed by Free Soil founder Amy Franceschini, also illustrates the group's purpose, which is to plant the seeds of ecological activism. The artwork for the site was originally created in Adobe Illustrator and then animated in Flash. Visitors can interact with the site by joining the digital protest and adding their own thoughts; they can even identify their specific interests such as urban gardening. The compiled information is tied to a database through the open source scripting language PHP, which allows users to sort the database by different categories, for example, urban, rural, or suburban. The creators of Fruit hope to raise awareness of what is going on in a given city's activist community while encouraging the creation of additional networks devoted to social change. There is also a viral component to the Fruit project, as visitors can print out and distribute Fruit "wrappers," which could in theory be attached to fruit at the local grocery, spreading the message in a more personal, non-digital manner.

In some ways, the use of interactive web design is reminiscent of the late nineteenth century, when the field of graphic design was experiencing its first flowering, and segments of the enter­tainment industry—especially the cafes, nightclubs, and theaters of Paris—were most willing to experiment with innovative, provocative styles and content. Not surprisingly, the entertain­ment industry today has again proved to be willing aggressively to try new, experimental marketing strategies. The unusual, internet-based marketing campaign for the comedy-horror movie Snakes on a Plane combined traditional print and television advertisements with a variety of internet-based interactive elements, including a feature whereby users could arrange for the voice of the movie's star, Samuel L. Jackson, to call a friend and encourage that person to see the film. Snakes on a Plane developed an enormous internet presence, as the filmmakers actively solicited advice from bloggers and other fans while finishing the movie's production.

A key part of the film's internet promotion was its official website, designed by the Heavenspot studio. Sharing the same postmodern, kitsch sensibility of the film itself, the website fea­tures cartoonish graphics as well as many interactive features. Much of the website was devoted to different types of "customizer" elements, allowing fans to "design it yourself (DIY; this contemporary phenomenon is discussed at length below) and develop their own graphics, Myspace pages, and audio tracks. It was hoped that the enormous buzz created by the film's web pres­ence would lead to greater success at the box office. Perhaps the most innovative part of the internet campaign was the banner generator that Heavenspot designed as part of the DIY package. With this feature, viewers could create their own banner adver­tisement for the movie, cither using the official graphics or uploading their own original ones, while also choosing a tagline for the banner. Viewers could even add their own face to the ban­ner, coalescing individual identity with that of the product (fig. 10.29a,b). They could then cut and paste the resulting html into their own website, creating a custom advertisement for themselves and their social circle. Users could also add a "ticket widget" that would direct people who inputed their "zip code" (area code) to a local theater where the film was playing.

When the movie Snakes on a Plane was released to theaters in August 2006, its success was closely tracked in the industry because few films had ever generated such an enormous pre­release web presence. For better or for worse, the internet buzz failed to translate into ticket sales, as the film proved to be only modestly attended. This situation points to one of the major questions regarding interactive websites. Will the entertainment elements on the internet become simply an end in themselves rather than fulfilling their creator's purpose? It would seem that consumers, at least in this case, were willing to immerse themselves in a marketing campaign without actually ever buying the product.
 

10.27 a,b Comcastic.com. The Barbarian Group. 2006

10.28a,b Amy Franceschini, F.R.U.I.T website, 2005.

10.29a,b Heavenspot, web-based banner ad generator for Snakes on a Plane, 2005.

Viral Advertising

The banner generator for Snakes on a Plane and the Comcastic puppet show both represent examples of the prevalence in digital culture of so-called "viral advertising." This term refers to advertising campaigns that are designed to take advantage of pre-existing communities, relying on consumers themselves to spread the commercial message. Some viral campaigns work with­out the active participation of the consumer. Probably the original example of this type of viral marketing arose in the late 1990s: the free email system Hotmail, which spread its name throughout the digital universe by appending its name to the bottom of each email message sent by its users. In this manner, knowledge of the service spread like a virus, jumping from person to person even though individual users had no interest in furthering Hotmail's corporate fortunes. This sort of self-replicating system is now widely in place as otherwise free services generate new business and increased brand recognition in an organic fashion.

The Comcastic and Snakes on a Plane campaigns are examples of the more sophisticated second wave of viral advertising, whereby consumers actively promote a commercial message because they find the content to be funny or otherwise noteworthy. Also, because many consumers invest some portion of their personal identity in the movies, television shows, music, and internet sites that they consume, they may want to create a personal link to a given media product and spread it to their friends. Viral campaigns often make use of UIY elements to drive consumer interest. Regardless of one's stance on the commercialization of contemporary culture, it is hard to deny that it is fun to send someone a Comcastic puppet message or to show-off the DIY banner that was made to publicize a new movie. Graphic designers working on this type of campaign find themselves in an interesting position; they are creating compelling websites that are intended to seduce consumers into creating a DIY product. Also, because professional designers usually create the templates used for banner generators, the resulting DIY works are to some extent already professionally designed.

Advertising Transformed

The sheer complexity as well as the interactive and viral elements of the campaign for Snakes on a Plane is indicative of the dramatic changes that are at present transforming the advertising industry and, by extension, the field of graphic design. A range of recent articles in trade magazines and websites popular with advertising and design professionals have attempted to make sense of the new situation, a difficult task considering that one of the funda­mental facts of the contemporary advertising business is that it is in a perennial state of flux. One thing that is clear is that there has been a broad fracturing of the standard television-based advertising campaign into multiple digital elements; there is often a tendency to throw a bunch of different elements at the digital wall and see what sticks. Along these lines, the release of a new car model will involve traditional television and print advertisements; professionally-made "spoofs" of said advertise­ments posted anonymously on Youtube; behind-the-scenes agency photographs released on the photo-sharing site Flickr; a layered, interactive website featuring elaborate motion graphics, the opportunity to create collaged, or "mashed-up" content, as well as a car customizer and ordering system; even logos that can be downloaded and spread virally by cell phone or email. The chief creative director of the J. Walter Thompson advertising agency was quoted in the design magazine Creative Review as saying that all this content needs above all to engage the consumer: "The challenge for us is to stop interrupting what people are interested in and be what people are interested in." In past decades a modernist designer like Paul Rand could create an entire range of corporate identity products simply by transferring a single, static print design from package to letter­head to product. All of these media were easily interchangeable. Today, designers need to work in a much more complex environ­ment where they must seamlessly transfer text and graphics across diverse platforms, often altering the aesthetic of the piece along the way to meet consumers' expectations. For example, viewers of television graphics expect a high degree of polish, but content uploaded to Youtube with the same high production values would stand out in a negative way, blaring "commercial and artificial." In the Youtube context the designer has to work to create content that appears authentically raw, even amateurish, in order to fit into the stream of non-commercial work. Ideally, these different manifestations of the same campaign will still share an aesthetic despite their divergent platforms.

Motion Graphics

Probably the most striking transformation in the graphic design profession over the last few years has been the increased importance placed on mastering the technology behind motion graphics. Motion graphics is a broad term used to describe any context in which text or image appears to move, but more often refers to digital work that involves dramatic changes in form, color, and composition. While there are still many opportunities for the designer who specializes in static print media or web design, it would seem that knowledge of motion graphics will gradually become even more central to the profession. This situa­tion is evident from any perusal of contemporary graphic design magazines such as Print, Communication Arts, or Creative Review, as these publications feature minimal content that is devoted to static media and conventional typography. Rather, they demon­strate the expanded field of graphic design as it grapples with the internet, animation, film, viral advertising, and the like. The motion graphics area is complicated because it is a hybrid field that combines skills common to the graphic designer with those of the animator, and its practitioners have entered the field through both avenues. Graphic designers' knowledge of typogra­phy and general compositional rules are essential to making motion graphics visually effective. However, the skills of the tradi­tional animator play perhaps a more significant role in motion graphics because they include the ability to conceptualize how a sequence of transformations will appear over time, how to effectively pace the motion, and how to relate the graphics to sound—as music is playing an increasingly vital role in this field. Animators also benefit from their familiarity with working on a project made up of a sequence of static frames.

A graphic designer needs to devote considerable effort to acquire the extra skills needed for motion graphics, yet there is lit­tle doubt that the enhanced value of these skills in today's rapidly changing business world makes the additional training worth­while. Fortunately, it is becoming more and more common for design schools to offer instruction in the complex software that lies behind digital motion. In fact, another reason for the rapid expansion of this field in recent years is due to the availability of a number of inexpensive desktop software programs, making the need to own and maintain exorbitantly expensive custom work­stations obsolete. Although a number of programs serve this market, including Apple Motion and Autodesk Combustion, one program, Adobe's After Effects, has come to dominate the field. After Effects and its competitors are powerful programs that pro­vide the highest possible production values and are suitable for a range of applications, from editing a commercial film to creating simple animated sequences for a web page. While After Effects can usefully make original digital animations, it is in the role of "compositor" that this type of program truly shines. A compositor allows the designer to layer together a variety of raw source materials—photos, videos, hand-drawn elements, and music clips—into a unified whole while editing it in a time-based format.

     Although the term "motion graphics" first appeared in the context of graphic design during the 1990s, graphic designers had been creating animated graphics for several decades using the techniques of traditional animation. The best example of an earlier graphic designer working in this field is Saul Bass, who made a number of compelling sets of animated film titles in the 1950s. Perhaps Bass's finest foray into animated graphics was his design for Otto Preminger's 1954 movie The Man with the Golden Arm (see fig. 8.21), in which abstract geomet­ric shapes come together to form a man's arm, symbolizing the heroin addiction that is the focus of the film. However, it was unusual at this time for graphic designers to involve themselves in animation, and it was essentially fortuitous that Bass—who lived in the heart of the American film industry in Los Angeles— struck out in this direction. Even though Bass's work had an enormous impact on the field and he is viewed reverently as the originator of sophisticated film titles, motion graphics never became an acknowledged part of graphic design but remained the province of conventional animators who were associated with the film industry. In the United States geography also played a role, as the graphic design community was principally located in New York City, while animated graphics were mainly created in and around Hollywood.

     Robert Brownjohn (1925-1970) was another prominent graphic designer who dabbled in animated graphics long before the digital revolution. An American who attended the "Chicago Bauhaus" where he was taught by Laszlo Moholy-Nagy, Brownjohn later moved to New York where he collaborated with Ivan Chermayeff and Tom Geismar in founding the legendary graphic design firm of Brownjohn, Chermayeff, & Geismar . In 1960, Brownjohn left the firm and emigrated to England where he soon established himself as London's hottest new design talent, a precursor of the celebrity designers familiar from recent years. In 1963, Brownjohn used his fame to launch into the production of animated film titles (fig. 10.30), about which he had little experience. According to a now legendary anecdote, Brownjohn sold his concept to the producers of From Russia with Love, the newest James Bond film, by dancing shirtless in front of a slide projector while explaining that the actual title sequence would be better because it would feature attractive women. The resulting work stands even today as one of the most memorable examples of motion graphics, as the text of the titles seems to flow on and around the dancers' writhing bodies. This kinetic element is further enhanced by the palette, as a judicious use of paired complementary colors (red and green as well as orange and blue) causes the viewer's eye to bounce from one line of text to another. While the vibrant polychromatic nature of the work is suggestive of the "psychedelic sixties," in many other ways this set of titles strongly suggests roots in the International Style; Moholy-Nagy had experimented with projected light at the Bauhaus in the 1920s, while the cropped, close-up photography resonates with his experiments in that medium both in Germany and later in Chicago. Brownjohn, who often worked impulsively, eschewing a great deal of preplanning and structure, also fortu­itously hit upon the importance of music in motion graphics, which provides a visceral complement that amplifies the power of the visual elements.

     Kyle Cooper (b. 1963) is perhaps the most influential graphic designer working today in the field of motion graphics, having created over 150 film title sequences over the last decade (fig. 10.31). After receiving his Master of Fine Arts in graphic design from Yale University, Cooper worked for several years at the New York-based design firm R/GA, before joining a few colleagues to form first a new branch of R/GA and then their own firm, Imaginary Forces, in Los Angeles in 1996. As had been Saul Bass's case decades earlier, proximity to Hollywood provided a significant impetus that drove Cooper into the film title business. In 2002, soon before he left Imaginary Forces to form a solo practice called Prologue Films, Cooper completed the title sequence for Spider-Man, that summer's blockbuster entertain­ment. The opening credits feature two distinct sequences. First, a dizzyingly fast, almost strobe light-like set of comics flash by the viewer's eyes in a matter of seconds. The sequence has a flip-book effect that nimbly connects the frame-by-frame narration typical of the comics medium that is the original format of Spider Man with the frame-by-frame animation of the film medium; in other words, the titles suggest that the film is essentially an animated comic flip book. This type of simultaneously visual and concep­tual conceit lies at the heart of Cooper's success. The second, longer sequence of titles appears as if animated in the style of a cartoon with large flat areas of color, introducing yet another comic/film hybrid; in this series of images the letters that fashion the credits form and reform, seeming to leap from web to web like the protagonist of the film. These powerfully kinetic forms were created using a variety of software, including After Effects and Maxon's Cinema 4D, a program that facilitates three-dimen­sional digital modeling and animation. In addition, rousing symphonic music has been smoothly integrated with the motion of the credits, so that the music swells as the letters catch hold of a web, and then flows forward again as the letters tumble and spin in space.

     The technological aesthetic that has been so prevalent in recent years first emerged in video game graphics, which have had an enormous impact on the field of graphic design by popularizing a smooth, exuberantly colorful, and futuristic textureless style. Cooper himself has also expanded his practice to include the design of titles for video games. For example, his titles for the 2004 video game Metal Gear Solid 3 Snake Eater (MGS3) demonstrate how well his style transfers across these different platforms.

Television networks are one of the most important sources of commissions for designers of motion graphics. Founded in 2001, the Troika Design group based in Hollywood is responsible for one of the most familiar set of television motion graphics of the twenty-first century. Displaying a technological aesthetic that is clearly informed by video game imagery, Troika's graphics pack­age for the ESPN network's signature sports information show, SportsCenter, combines powerful kineticism with sleek, texture-less surfaces (fig. 10.32). Likewise, the lettering in the credits is decisively geometric in structure, with the flattened curves and orthogonal forms typical of the genre. One of the first graphics packages designed for high-definition television, the graphics have an almost vertiginous effect on the viewer as text and image spin while simultaneously plunging into deep space. The central image of the piece—which may or may not be recognized as such by the viewer because of the abstract nature of the work—is a huge turbine, a power generator that resonates with the symbolism of the man-machine hybrid often seen in technology-inspired graphics. The original graphics package has since been expanded to encompass a variety of implementations across the network.

     Some credit for the success of this graphics package must go to the composer of the theme music, a frenetic, triumphalist piece that is beloved by sports aficionados across the globe. The music was composed by Annie Roboff, a country music writer who originally composed it for a news channel, after which it was sold to ESPN. Of course, the key to the graphics is the way in which Troika designed them to complement the therne music seam­lessly. As is often the case, the Sportscenter graphics were produced using a mixture of software programs, including After Effects, the 3D modeling program Autodesk Maya, and Apple's video editing software Final Cut Pro. The complexity of these different programs is one factor that has led to a great degree of collaboration in motion graphics, as it requires a team of designers, each of whom has their own software specialty, to complete such a work.

In a music video more than in any other type of motion graphics, the audio track takes precedence and the graphic ele­ments play something of a supportive role. Additionally, because many music videos are intended to introduce the musicians to their audience, perhaps for the first time, it is common to see live action video and digital animation blended together. This was the case with the video that the design studio Mathematics, based in Sydney, Australia, produced in 2005 for the rock band Betchadupa (fig. 10.33). The first step in the creative process was to listen to the song "My Army of Birds and Gulls," after which the designers at Mathematics formulated their aesthetic approach and devised a needed list of live action footage. Betchadupa next played the song as well as some reaction shots on digital video, after which the video and original animation were merged using the compositing software After Effects.

     The Betchadupa video shows the band amidst an eerie, wintry landscape populated by birds. This digital landscape nicely complements the haunting quality of the song itself, which portrays birds as a symbol of escape through a natural, nomadic existence. Perhaps the strongest shot shows an animated feather that floats softly into the filmed hand of Liam Finn, the lead singer of Betchadupa, while an animated hummingbird hovers in the near background. The scene then dissolves through an increasing close-up of the singer's arm as it fills with black.

The design of music videos such as this one and film titles has resulted in a blurring between the graphic design and film­making fields. The software programs used by motion graphics professionals are the same ones used in movie post-production. Also, the use of a "storyboarding" process to plot the animated sequences is a strategy borrowed from filmmakers. Unsurprisingly, a number of graphic designers who specialize in motion graphics, such as Kyle Cooper, have sought out opportunities in the design and direction of motion pictures. In fact, Cooper's current studio has a name befitting a movie production company, Prologue Films.

    Another hybrid format common in today's design world are complex, Flash-based websites with motion graphics sequences. Technically speaking, it is possible to include animated graphics either as separate elements that can be displayed on a media player such as Quicktime or as video segments that can be format­ted for the Flash player, for example, in the case of the popular Youtube.com website. A fine example of the former strategy can be found in Foreign Office's 2004 website for the fashionable clothing company Blue Guru. Foreign Office, based in London, was originally founded in 1999 by three young designers, Sonia Ortiz Alcon, Matteo Manzini, and Fredrik Nordbeck. The Flash-based site provides all of the usual information that a visiting consumer would want to know about the company in a readable format punctuated by funky, ornamental graphic elements; this straightforward approach is neatly integrated with a whimsical three-minute animated short that opens on the Quicktime player. This piece, titled "The Story of Blue Guru," purports to tell the story of the Indian origins of blue denim. It is a fascinating and sometimes confoundingly surreal pastiche—at one point poodles run across the screen—of hand-drawn graphics, archival photos, and film clips that have been composited together with After Effects (fig. 10.34). Foreign Office clearly adheres to a conceptual approach to design, as odd juxtapositions and poetic associations dominate the short. The animation is visually tied to the broader website by the occasional appearance of the abstract graphics that adorn the latter's pages. However, the graphics in the animation move with greater freedom, approaching the hallucinatory effect of psychedelic graphic design.

Foreign Office's own website offers a view into the sophisti­cated software skills that must now complement traditional visual and conceptual abilities in order to thrive in today's interactive and motion graphics-dominated design culture: "[W]e have extensive capabilities in the following computer programs: Adobe After Effects 5.5, Apple Final Cut Pro 3, Macromedia Flash 5.0, Adobe Photoshop 6, Adobe Illustrator 10, Quark Xpress 5.0, Strata Studio Pro, Adobe Premiere 5.1, Macromedia Sound Edit 2, Steinberg Cubase VST 4.0. In addition, our close collaborator Mikhail Goldgaber provides expertise in Dynamic HTML, JavaScript 1.2, Cascading Style Sheets/CSS) and HTML 4.0." Such a daunting list needs constant updating, as each year soft­ware companies release new, more powerful programs that enhance designers' aesthetic flexibility while simultaneously demanding continuing education; this is worlds' away from the pre-digital era, when designers could master a lifetime of technical skills at the outset of their career.
 

10.30 Robert Brownjohn (director) & Trevol Bond (animator),
Film title sequence for From Russia with Love, 1963.

10.31 Kyle Cooper (titles) & Brian De Palma (director), Film tile sequence for Spider-Man, 2002.

10.32 Mark Bohman & Troika Design Group, ESPN—SportsCenter, 2004. Courtesy ESPN Network.

10.33 Mathematics, "My Army of Birds and Gulls," Betchadupa, 2005. Video. Courtesy Liberation Music.

10.34 Foreign Office, "The Story of Blue Guru," Blue Guru. 2004.
Website animation. Courtesy Levi-Strauss.