• Organization: Amazon (2016)
• My role: Sr. UX designer (Flows, Wireframes, Mocks, Research, Assets); UX Manager - managed a UX designer to update the desktop version.
• Additional Credits: Manager: Scott Bishop. Product Manager: Ido Mittelman. TPM: Shahid Dhebar. Visual Designer: Steve Karlson.
• Website: http://www.amazon.com/giftcards

Problem

The Amazon eGift Card purchasing and redemption experience on mobile was outdated, with missing functionality compared with desktop. There was no way to choose from newer formats for the designs, such as animated or upload your own image. And, the process for adding new designs on mobile was laborious for staff. For redeemers, we were missing the ability to redeem a gift card in Your Account for many devices, and all were missing the Gift Card Transaction History.

Goal & Approach

Our goal for this project was to update the UI to a modern design in a framework that would accomodate all the features of desktop. I took the approach that it should be responsive for mobile and tablet, and eventually desktop, require very little text entry, be lightweight for the developers to code and update, and for the marketers to update regularly and monitor performance. We strove to utilize the mobile platform capabilities (access camera and contacts), and make it easy for the customer who just wants a quick gift card (little personalization) as well as the customer who wants to evaluate all of the options to narrow to the perfect fit for the occasion and recipient. (We were at the same time increasing and changing out our design selection for eGift Cards from 100 to 500+ over a few years.) This also required revisiting the entire search flow, as we initially had expanded search results to expose all of the design options, but then considered reducing the search results back to a minimal amount to make most of the decisions happen on the detail page/form.

Key Challenges

The core shopping design team was rolling out a new, more modern styleguide for the UI across Amazon, with new patterns being created weekly. This was challenging on the one hand, because the library didn't have the necessary UI elements I needed, but also exciting, because it was more in line with the clean look, feel, and animation that I wanted. I took the opportunity to contribute proposals to the new library during our project and reviewed them with the core design team. Another challenge was that our eGift Card shopping cart had to be a separate checkout pipeline from all other Amazon shopping items, since it was a digital item. I conducted three usability studies to help narrow to the best design options for mobile, tablet and desktop, and reviewed with design mentors from other departments for expert feedback.

Solution

First and foremost, I made the form completion easier by exposing the eGift card amount selectors rather than using a dropdown, defaulted it to $50 and defaulted the name of the signed in account name into the "From" field. I also kicked off a separate project with the Marketing and Product teams to evaluate the gift card art, and to create a new styleguide and guidelines for refreshing our offering.

Success measures

1. Ensure that conversions are at a rate similar to desktop, and that mobile traffic is comparable to all of Amazon.

Results

1. Timing: Phase 1 was completed ontime by holiday peak period, on the mobile browser and app, tablet app, iOS and Android. Tablet browser followed 2 months later, on plan.


2. Conversion: Considerable gains were made in mobile app, with an increase in sales of 15% on mobile browser within a month of launch, and solid improvement on tablet app and browser (exact numbers not captured).


3. Traffic: We saw an increase of 10-50% on mobile traffic, but found that some data collection had not been implementated (kicking off another project to fix).


4. Customer Contacts: No significant increase or decrease was seen after the launch.