Great Design: Nikelab.com

It’s a shoe. You lace it up and go for a run.

That is, unless you go to R/GA’s Nikelab.com Web site, where that shoe might be a racecar, or a series of elegantly interwoven black-and-white lines cascading into a mesh universe vortex. Or dancing geometrical shapes set into motion by the rhythms of your breathing, or a loose-limbed marionette triggered by your keystrokes or a race across a virtual world in a futuristic track spike. Building a wholly original Web site for a client known for constantly pushing the boundaries of creativity is hard enough. Imagine the pressure when that client is Nike—and you’re asked to go from concept to execution in slightly more than four months.

"We know that there are consumers out there using [the Web] looking for the latest and greatest products that bring something new to the table in terms of design," says Bryan Finke, Nike’s director of digital brand marketing, about the task assigned to New York City-based design firm R/GA in summer 2002. "We wanted to deliver an experience that was unique and engaging, inspiring and entertaining."

With innovation as its key creative focus, R/GA, the interactive agency of record for Nike U.S., started by looking at the company’s most performance-driven, innovative products from the inside out. The design team didn’t initially fret about targeted age groups, demographics or sales initiatives; instead, they worried about how to capture the hearts and eyes of early adopters.

They wondered: "What if you could (virtually) hold a shoe, spin it around on your screen and peel it apart layer-by-layer?" "What if you could build a custom shoe from the sole up, choosing the color and style of everything from the shoelaces to the stitching on the side?" "What does comfort look like? What does it feel like?" More important, they wondered, "How do we represent it on a computer screen?"

Bringing Innovation to Life
With art director Rei Inamoto heading up the creative team, R/GA began the task of figuring out how to make a Web home for a line of technically advanced products that don’t fit into specific categories. "The one common thread uniting these products—shoes, watches, an MP3 player—was that they were the most performance-based, innovative products Nike has produced," says Inamoto, who led the team of 15 designers, interaction designers, producers, writers and programmers. "Our basic premise was to create a digital presence for the cycle of innovation and inspiration that Nike creates over and over with their products. But they didn’t just say, ‘We want a Web site.’"

Using their typical brainstorming approach, Inamoto’s team of art directors, designers, programmers and copywriters began the process of "interaction design," in which staffers from different disciplines within R/GA gather around a table and ask, "How can we talk about these products in a way that hasn’t been done before and that has an emotional impact on the consumer?"

"We wanted to tell this as a story, but not a linear one," Inamoto says, stressing that Nike and R/GA both sought something more than an e-commerce site with a few flashy bells and whistles. The goal of finding a coherent conceptual framework to house these unrelated products was more challenging because Inamoto wanted to avoid scanning other sites for inspiration. Instead, the R/GA team looked to seemingly unrelated disciplines such as exhibition and space design and, most important, film for their creative spark.

In trying to pinpoint how Nike has communicated its stories of innovation during the past 20 years, the discussion led to mediums for storytelling and then to the idea of turning the site into a constantly evolving, multilayered film. That, in turn, led to a tagline: "An interactive cinematic experience of Nike innovation and inspiration."

"When the Web started as a commercial vehicle in the early ’90s, we were still using the metaphor of pages with blocks of text," Inamoto says. "That metaphor is based on an old medium: books. But as we move forward, that metaphor is no longer relevant, and something closer to a sequence of frames makes more sense. So, we wanted to let users control their own experiences and navigate through time on their own.

"We wanted an interactive story that takes place on the Web, so each product is juxtaposed with an aspect of its performance and a more entertaining component," Inamoto continues. The entertainment aspect is intentionally less literal in terms of explaining product benefits, but is crafted to let the consumer experience that benefit in a way that’s possible only on the Web.

The framework of the site—which looks and sounds like those ominous, feature film-like promos for the THX sound process screened before movies—uses 10 rolling filmstrips as visual devices for users to navigate through the stories. Like a rudimentary flipbook, once activated by the cursor, the frames scroll up or down, sending a small image of the product into slow motion. Each product has an associated keyword: the Nike Airmax Plus V shoe, for example, ties to the word "cushioning."

Click your cursor over the rolling Airmax Plus filmstrip—with its numbered frames for added authenticity—and you’re transported to a sub-page that looks like a film negative with several interactive features. A menu allows you to zoom in, rotate the shoe, click on different areas to learn about benefits and peel away layers to reveal inner workings. And the filmstrip navigation features a downloadable TV commercial, a Buy button and wallpaper for your desktop.

Partnering with Independent Artists
The second button on each page is the "experience" function, which, for the Airmax Plus, was created by New York City visual artist Manny Tan. These experiences, which vary wildly from product to product throughout the site, are the result of an unusual outward-looking creative direction. Including independent artists in the site’s design was integral to R/GA’s plan from its inception, not because the firm felt it needed outside ideas, but because it reflected Nike’s core directive.

"Nike felt that to successfully talk about the collaboration that goes into the brand’s innovation, there needed to be some collaboration on the site," Inamoto says. "So it was natural for us to work with other artists who aren’t necessarily commercial designers, but who create art for its own sake. The key was not to make it like a gallery show and randomly select artists to be showcased based only on their work, but to align the artists with the products based on their past work."

Among the nearly 100 artists initially considered for the project was Tan, whose Uncontrol.com site has a wealth of mesmerizing digital designs that capture the emotion and feel R/GA sought. The firm taps these creatives on an ongoing basis as new products and related experience features rotate onto the site. Although it’s challenging to work on tight deadlines with artists from around the globe, Inamoto says the results are worth any headaches induced by working long-distance.

Tan’s contribution (see "Cushioned by Air" in the Archive section of Nikelab.com) taps into the essence of cushioning with a piece that allows the user to float an abstract image of a shoe across the screen by breathing into the microphone attached to his computer. It was exactly the kind of inventive thought Inamoto was looking for.

"They just showed me the sneaker and said, Go crazy,’" Tan says. "One of the ideas they wanted to get across was the notion of air and how the shoe used air to do its thing. I wanted to take the idea of air and play with it. Air is something you can’t see, hear or touch, unless it’s in reaction to something else. So, I thought one way of using air was to use the microphone to create it."

Using a Macromedia Flash MX plug-in, Tan created a module that allows the user to manipulate sound to regulate interactions on the screen, as well as to use the mouse and keyboard when a microphone isn’t available. While R/GA and Nike were thrilled with Tan’s contribution, the artist, who has both a programming and design background, was ecstatic over the artistic freedom. "This is one of the few times as an artist that you’re sponsored by a big corporation and you get to do anything you want!"

In addition to the in-house creations from R/GA’s team—which include a Formula One-inspired racing game and a mini-site that allows you to customize shoes—several other artists created digital works. Like Tan, the French art Collective Le Ciel Est Bleu perfectly captured the products’ innovation in an engaging piece built with the group’s Puppet Tool software. The feature focused not on Nike’s PSA[128max MP3 player itself, but on its effect on the user. The raggedy puppet flips, dances, struts and gallops across the screen via the user’s keystrokes. 

Hooking the Customer
The virtual puppet show is a prime example of why the partnership between R/GA and these outside artists works. By focusing on unique, engaging experiences, Nikelab.com avoids the hard sell while offering works of digital art that amuse and amaze, even as they create subtle, lasting product impressions.

Nike’s Finke declines to discuss the budget for the site, launched November 14, 2002, or its sales impact. "It’s a brand thing," he says. "I think a good testament to that is that, not only do you see some of our top-level innovation on the site, but it also features products that the more traditional marketing machine will get behind. It won’t move the bottom-line figure for the company, but these are great examples of passion and obsession for the consumer who appreciates design."

As the site adds new experiences and products, Finke says visitors can expect to keep being surprised and challenged. "We didn’t do this just to do something different," he says. "We did it so that every time you come back you have an innovative experience."

COMMENT