UNDER ARMOUR BUY ONLINE PICKUP IN STORE

Retailers like Amazon give customers what they want, when they want, and how they want. In 2018, Buy Online Pickup in Store (a.k.a. BOPIS), emerged as a feature that retail stores were scrambling to offer. To stay competitive in the marketplace, UA needed its own BOPIS strategy and execution.

My Role

As the dedicated UX designer on the project, I conducted initial competitive research, recruited and interviewed customers, met with stakeholders and cross-functional teams, designed the user experience, and ran the design through rigorous user testing.

THE PROBLEM

Crafting the experience without interrupting the "buy flow".

Any minor tweak to the purchase flow on ua.com could cause a drop in sales. My challenge was to make as few changes to the current "buy flow" as possible while still making the new feature discoverable and usable.

THE SOLUTION

Buy Online Pickup in Store (aka BOPIS): A simple UX reflects hidden complexity.

The straightforward user experience reflects months of ironing out complex interaction design challenges, aligning teams, and building a new backend infrastructure. 

UX Updates:

  • Pickup module on the Product Detail Page
  • Option to pick up in the Cart
  • A new Store Lookup page with local store info
  • Pickup details added to Checkout
  • Email (and eventually SMS text) order status updates
New-images.001
New-images.002
New-images.003
New-images.004
Test-image-2.001-1

approach

Understanding business needs, customer expectations, and development limitations.

My process began with the analysis of existing BOPIS experiences to understand the touchpoints involved in a typical experience. I met with business, development, and logistics teams to understand the business goals and implementation challenges. Once I gathered these considerations, our team designed the digital experience on ua.com and collaborated with store operations teams on the in-store UX. 

COMPETITIVE/ comparative analysis

Examining the pros and cons of different online and in-store experiences.

I looked at a wide range of retailers, from big box stores to smaller direct-to-consumer brands. I sought to understand if any common UX patterns exist for current BOPIS experiences, what web pages are involved, and what the typical step-by-step process is.

Companies

  • Adidas
  • Amazon
  • Apple
  • Banana Republic
  • Bed, Beth, and Beyond
  • Best Buy
  • Brooks
  • Crate & Barrel
  • Dick's Sporting Goods
  • Free People
  • Guitar Center
  • Home Depot
  • IKEA
  • Instacart
  • and many more...
New-images.006
BOPIS-competitive-analysis-takeaways.001

USER INTERVIEWS

Understanding customer needs, expectations, and pain points.

After conducting a thorough competitive analysis, I needed to broaden my perspective beyond my own experience. I talked to customers who had purchased items for pickup to gather more intimate details about their purchase needs, behaviors, and pain points.

New-images.008

"It's easier for my wife to just buy it rather than texting me a picture of it and then having to go search for it [in the store] myself."

MALE, 45

new-design-considerations.001-1

SERVICE BLUEPRINT

Aligning cross-functional teams on a single cohesive experience.

I mapped out the end-to-end experience using a service blueprint. I used the service blueprint illustrate what needs to happen on the backend with each customer interaction and how many different systems were involved. We met with stakeholders across a wide variety of teams (some had never worked together before) and walked them through the blueprint, making edits along the way. In the end, the service blueprint was integral in helping each team understand their place along the customer journey.

BOPIS-portfolio-images.001-5
BOPIS_Service-Blueprint-4-3

WIREFRAMES & USER TESTING

Rapidly testing prototypes with users to gather feedback and make improvements quickly.

I conducted remote unmoderated user testing on each round of the design using usertesting.com. Even though users could successfully complete the tasks during each round of testing, their confidence in the process, and in Under Armour, was low. Because of poor BOPIS experiences at other stores, people assumed Under Armour would not be any different. I focused on increasing customer confidence in the process with each iteration of the design.

We focused on solving:

  • Hope is high, but expectations are low due to bad BOPIS experiences at other stores. Customers are not confident their item will be there when they go to pick it up.
  • Customers want to know the pickup process before checking out
    • How long do they have to pick up the item (2 hours? 2 days?)
    • When will it be available for pickup?
    • What steps are involved in pick up?
    • Wanted this information before they checked out
new-wireframes.001

UX FLOWS

Communicating complexity to product and development teams.

Because the end-to-end experience involved many teams, it was important to be detailed with the design handoff. I walked teams through UX flows and interactive prototypes to make sure we were all on the same page.

BOPIS_UX-flow

Challenges

From interaction design to aligning teams, creating a cohesive end-to-end experience takes a village.

  • Uniting teams across the business that do not traditionally work together (e.g. eCommerce & store operations)
  • Making as few changes to the current site as possible
  • Complex interaction design challenges such as the "split cart scenario" (This is when the customer purchases items for both shipping and pickup.)
  • Aligning over a dozen teams on a single end-to-end customer experience

IMPACT

Bridging the gap between eCommerce and the retail store experience.

BOPIS was never intended to be a money-maker. A major sticking point in this project was that very few customers would benefit from BOPIS due to Under Armour’s small store footprint and limited online inventory. However, this project did more for the future of potential services than for short term rewards. By connecting the online and store inventory backend systems in one sweeping project, we laid the infrastructure to do a myriad of services we couldn't do before ("ship to store", store event RSVP, store lookup, etc.). We also brought the online customer into the store and the store customer online.

Credits

Creative Director

Marcus Piña

Senior Design Manager

Eric Boam

UI/ Visual Design

Lindsey Steffek

Contact

Email — hello@katiesawaya.com