Gene Lu's Portfolio

Kobe VII System

Late last year, Nike released the latest Kobe shoe, the Kobe VII System and needed a product detail page to showcase all of the new features that the system (Nike prefers “system” than “shoe”)  had to offer.

If you are unfamiliar with the system, it is composed of two different sleeves that go into the shoe. Each sleeve is built for a certain type of gameplay. You can also further customize the sleeves themselves by mixing and matching the components of each sleeve via Nike ID. The following sketches show some of my thinking before diving into wireframes.

Kobe VII System Sketch V1

Kobe VII System Sketch V1

Kobe VII System Sketch V2

Kobe VII System Sketch V2

Since this was a very shallow ID project, I went with static wireframes [PDF]. The rest of the content that was placed below the top portion of the site were content modules previously developed for other shoes, which I also worked on, e.g. Lebron 9, KD IV, etc.

Kobe VII Wireframes

Kobe VII Wireframes - PDF

To better demonstrate what happens when a user clicks on either “Attack Strong” or “Attack Fast”, I created a short video demoing the interaction using Keynote.

Kobe VII Demo

Kobe VII Demo (.mov)

Final Design

Kobe VII System

Kobe VII System Final Design

Art Director: Chris Jovanov
Copywriter: Brad Soulas
Interaction Designer: Gene Lu
Producer: John Mullin

Comments are closed.


  • 12 Mar 2012

Filed Under

Recent Articles

Lead UX Designer on Nike+ Running at R/GA.