PROJECT OVERVIEW
Customers need more opportunities to save money with Fresh groceries. But vendor managers need a better tool to create and maintain discount products at scale. The engineering team needed my help to design a customer-facing digital mailer and to improve the way vendor managers update and maintain product discounts.
CHALLENGES
Vendor managers currently use an excel template to input all discount data for Fresh circulars. It is time consuming, leaves room for human error, and is not scalable.
MY ROLE & PARTNERS
As the only UX designer, I made the project plan and schedule that the engineering team agreed on. I organized our progress updates to make sure we stayed on track. I worked with vendor managers to learn about their problems and what they want in the new tool. The next few weeks were divided into three phases: discover, define, and design. My activities were:
Research & synthesis
UX design & UI design
New tool interface exploration
PHASE 1 | DISCOVER
The first step I like to take with any project is to understand the full ecosystem of where the final product will live, even if it’s out of scope for what I am required to deliver. I want to know where the two artifacts I’m delivering live: the digital circular page (digital mailer) and the circulator (internal input tool).
Figure A
Result from the whiteboard session.
Figure A
Figure B
Understanding the user story and how it fits into the online grocery ecosystem.
Figure B
Now that I knew the ecosystem and how everything flows together, I could focus on mapping out the customer needs for each artifact and define the needs for each of the deliverables.
Customer needs:
I started with mapping out everything a customer currently sees with saving money on Amazon Fresh—there were three total different experiences around saving money.
This led to prioritizing customers “must haves” for the digital mailer. What I identified here also connects back to the original asks stated in the first whiteboarding session with the engineer.
Vendor manager (VM) needs:
With the list of customer needs, I could now look at the current VM’s excel spreadsheet and what this new input tool would need to help VMs use their time efficiently. The lead engineer had proposed a prototype he built for the new internal tool, but it was using the same spreadsheet format. So I proposed a new UI and content organization approach…
Phase 2 | Define
Figure C
PHASE 3 | DESIGN
Digital mailer product
The final product is both desktop (left) and mobile (below) forward as many of our customers use both. I was limited by what I could do visually to make them more striking due to the strict online page guidelines and time constraints at the time.
VM circular tool
I proposed the engineer move away from spreadsheet organization style and use pop-ups. VMs are not needing to store and analyze hundreds of data. They need to input individual details to each data set that changes on a daily basis. VMs need a quicker way to input information without the constant vertical scrolling from spreadsheets.
Figure C shows the original spreadsheet tool VMs have to use on a daily basis to input mailer discount information.
Figure D (below) is my new proposed layout and content structure that can allow VMs to input data quickly and efficiently.
The engineer team approved the new proposed changes and this design has now been adopted in the live tool.
Figure D
Here is the full flow of the new tool pages.
Wrap up
Since the engineer was using the existing design system to build the beta, I did not need to make high fidelity mocks for the internal tool at this stage. Next steps for this project would be to review the beta and test with a few vendor managers before launching—I was moved to a new project so I did not conduct this last step for the engineer.