Albertsons ECHO refund transparency
Role: Senior UX Designer
The ECHO Refund web application was a customer support application, which enabled CSR agents to provide refunds to customers, review past reports and determine fraudulent customer activities.
Team:
1 UX Designer (me)
1 Project Manager
1 Visual Designer
2 Engineers
1 User Researcher
1 Product Manager
the challenge
The challenge was to design a tool used by customer support rep agents to provide and manage refunds to customers. The existing tool was created as a way for CSR agents to provide refunds to customers, however using the tool required a lot of training and the design wasn't based on the mental model of users. It wasn't based on a user-centered design process.
The goal was to create an engaging experience for CSR agents who would quickly adopt the tool for all of their tasks
research
Ideate: I created mockups that revolved around the three personas that addresses their goals and struggles using the portal.
Validate: A user researcher conducted a usability test using a prototype based on the wireframes to validate against a set of metrics and objectives.
Design Approach to Developing a User-Centered Product
Develop Personas: Based on the interviews, we developed three personas that encompasses typical users of this type of application.
Conduct Interviews: We conducted interviews with store associates, product managers, and business owners of several retail stores in the Bay Area to understand their task flows, goals and motivations.
Research - Discovery Sessions with Stakeholders and Product Team
I conducted three discovery sessions with stakeholders to understand the problem we're trying to solve and gather insights about the product.
During the discovery sessions, I identified insights regarding the customer refund process. Namely that there were discrepancies in the total refund amounts based on whether it was before or after refunds were submitted in the system. In order to address this challenge, I collaborated with developers on how refunds are submitted in the backend and provide necessary messaging to allow CSR agents to provide accurate information to customers.
design explorations
Here are some design explorations about different patterns for customer refunds. By collaborating with the cross functional teams, I made several design iterations that led to the final designs.
Escalated Refunds Alternative Design
Eventually, I removed the radio buttons from this page based on my discussions with cross-functional teams since we decided that the agent needed more details before rejecting/approving a refund request. Despite this, the idea of a quick approve/reject action from the list page provided an efficient way for agents to quickly sort through their queue without the extra click of going to the details page.
View Receipt Alternative Design
The reason for providing a modal window for receipts was so agents can have a convenient way of referencing the receipts, which had the accurate price amount. However, after reviewing the task flow for agents, they required a side-by-side.
Escalated Refunds Detail Alternative Design
This option had a link to view receipts. However, after consulting with stakeholders, they mentioned that CSR agents need to have a view of receipt at all times since the system didn't provide accurate pricing at this stage before submitting refunds to the system. The receipt did contain the accurate price that the customer was charged.
final designs
Based on the findings from the usability study, I designed the screens that were handed over to the development teams during the development sprints.