Nike Gear Up

Nike Gear Up is an e-commerce solution that recommends a set of products to consumers based on their answers to a series of questions.

In Summer 2012, Nike briefed us on improving the existing Gear Up experience along with a future vision deck outlining possible features down the road. This project was a major milestone for me at R/GA because we were working with a new client on Nike’s side and it was my first major (!) project at R/GA.

Ecosystem Diagram
In order to help our team and client better understand where our opportunities were within the Gear Up experience, I broke the system down based on the following groups, e.g. retail, 3rd party, social, inspiration, mobile, and apps. Our goal was to evolve Gear Up users from being unaware (browsing the site) to being proactive (creating their own collections) using the Gear Up platform.

Gear Up Ecosystem Diagram

Interactive Wireframes
Since we were working with a new Nike client and being fresh out of grad school, I saw this as an opportunity to improve on R/GA’s traditional process of showing static wireframes via PDF decks. Instead of cranking out wireframes in InDesign, I stuck with Adobe Fireworks, which was specifically made for web prototyping.

After presenting the first set of clickable wireframes to our new client, they were on board with our new process. Over the next couple of months, we went through multiple iterations of clickable wireframes. Because of this change in process, our clients had a better understanding of what was being presented, which made the conversations between us and the client a lot more efficient. On the internal side, the prototypes helped to manage expectations between creatives and developers. What would have been a yearlong project turned into a project that launched several months after the initial brief.

The following set of wireframes was the last set presented to the client before moving into visual design.

Gear Up Interactive Wireframes

Gear Up Interactive Wireframes

More Prototypes
After we moved into visuals, I helped the creatives better convey their visual story by creating small, simple prototypes using javascript and HTML. Again, these prototypes helped to build up the relationship between us and our client.

The following prototype briefly demonstrates a simple interaction between the item tray to the right and the content in the middle.

Gear Up Mini-Prototype

Gear Up Mini-Prototype

Wrapping It Up

Nike Gear Up Running

Nike Gear Up Running

Gear Up went live October 21, 2011 across Nike’s multiple channels. Sites that are currently active are as follows:

Team
Copywriter: Devin Heatley
Visual Designers: Rasmus Wangelin, Mariola Bruszewska
Interaction Designers: Ryan Scott Tandy, Gene Lu
Producers: Charles Lano, Jessica Cheung