Amazon Campus: In-store Pickup

Storyboard, screen flow, wireframes, prototype, usability testing, visual design

My Role: UX & Visual Design

Amazon customers can choose to pick up items at a nearby Amazon store instead of having them delivered. Once they enter the store, they use their phone to get a pickup code that they scan at a locker, where their package is waiting for them.

I updated the existing mobile experience, and designed a new feature where customers can add additional items to their pickup order.

pickup-thumbnail.jpg

Storyboard

Screen flow

If customers order something from Amazon and choose the pickup option, they receive an email telling them to head to the store when their stuff is ready. The email has a button that takes them to the mobile pickup experience, below. They can choose to wait two minutes for their pickup code to load, or they can add additional items to their order while they're waiting.

Wireframes

Basic pickup experience: I simplified the layout and wording of the existing pickup screens. I also designed it such that a widget can easily be added to the bottom of the screen--a widget where customers can choose to add additional items to their pickup order. Not all locations will have this feature, so it was important to separate the widget from the basic pickup flow.

Add items to your pickup: At select locations, customers will be able to add additional items to their pickup while they're waiting in the store. The screens below (click to enlarge) show how this feature would work.

Usability Testing & Prototyping

I had a lot of open questions about the usability of this new "Add items to your pickup" feature, so I quickly put together a mobile Flinto prototype and tested it out with real customers at our closest store location.

On the left is a video of the updated prototype, having incorporated feedback gathered from usability testing.

Learnings from usability testing:

  • Participants prefer to browse items by categories, using carousels, instead of the infinity tile layout in the wireframes.
  • Having the barcode appear in the sticky header made participants think they had to stop shopping and use it right away. Instead, the sticky header now just shows text, and they need to tap on it in order to view the barcode.
  • The original wording was too vague and made people assume the items were available for two-day pickup. I changed the wording to indicate these items can be picked up instantly, not two days from now.

Final design

Below is the design we launched with (click to enlarge). Since launch, I've gathered even more learnings that are informing the design enhancements I'm currently working on. Stay tuned!