The NikeSB app helps skateboarders learn tricks, take part in challenges, play games of S.K.A.T.E., and track their personal skating progress and history. One of the most interesting parts of this project was working with R/GA's brilliant data viz team to help Nike do something that had never been done before - create a virtual index cataloging the taxonomy of skate tricks. The app received two One Show Interactive Gold Pencils in the User Experience and Mobile Apps categories, among other awards.
I was the primary UX designer on this project, responsible for user flows, wireframes, functional specifications, and game design. I also collaborated with the data visualization team.
The app needed to catalog an ever-growing number of skate tricks for users to learn, track, and show-off. We worked closely with the data viz team and Nike clients to draw connections between thousands of tricks. Our conference room walls were covered in diagrams like below. My job was to figure out how users would navigate these massive trees on a tiny mobile device.
The app allowed users to connect with other skaters from around the globe to play a game of S.K.A.T.E. This is a sample of the annotated wireframes I created for setting up a trick during gameplay.
Each trick in the app included a video to help users master it. The first tricks would be performed by Nike's own pro skaters, and from there users could help grow the Trick Tree with their own footage.
Here are some iPhone snaps of our practice shoot at R/GA's digital studio. Luckily our art director was a great skater!
From onboarding, to gameplay, to tagging tricks… this app was full of interesting UI challenges! Here are more wireframe samples that I created for the app.
Here are some screens from the final designs. You can download the app for free in iTunes.
