Project Information

Role: UI/UX Designer

Created Year: 2016 (updated in 2018)

Used Software/Tools: Adobe Illustrator, Adobe XD, Google Hangout

Tags: User Interface, User Experience, Website, Ecommerce, Redesign

About NBA Store

The NBA Store is the official licensed retailer of National Basketball Association (NBA). Their online store, NBAStore.com, is the go-to place to buy all your favorite basketball team’s gear including their top most-searched products - jerseys, t-shirts, hats, footwear, accessories and collectables.

nbastore-home

*This is the latest NBAStore.com homepage.

Research

nbastore-consumer-pain-points

Usability Teardown

nbastore-usability-teardown
nbastore-usability-teardown
nbastore-usability-teardown

Usability Heuristics

nbastore-usability-heuristics

Problems

1. Not convenient find a product.

2. Header navigation with advertisement takes up too much space.

3. Too many unnecessary information.

Solutions

1. Provide a better visible search filtering options.

2. Reduce the size of header navigation.

3. Remove unnecessary information.

Target Audience

Age Range: 30s to 40s.

Education: Bachelor's degree and higher.

Income: Minimum of 100k per year or higher.

Who: NBA Store shopper and NBA fans.

Goal: To provide a better online shopping at NBA Store that aligns with their search requirements including team, gender and department and provide a better user experience when shopping online.

Key Persona

` nbastore-persona

Design Inspirations

nbastore-design-inspirations

Initial Sketches

nbastore-initial-sketch
nbastore-initial-sketch

Wireframes

nbastore-wireframe
nbastore-wireframe
nbastore-wireframe
nbastore-wireframe
nbastore-wireframe

User Flow

nbastore-userflow

User Testing

nbastore-usertesting
nbastore-usertesting
nbastore-usertesting

Design Iterations

nbastore-iteration
nbastore-iteration