top of page

Refund summary

Over view

What did we do?

  • We also identified opportunities to holistically improve the user experience for the dispute workflow beyond charity donations

Updating the messaging to improve clarity and transparency
- Aligned the page design with other products for consistency
- Updated components to align with DS 6.5
 

ROLL

UI/UX*

PLATFORM

iOS, Android
​
*Worked with an outside agency to develop the product. 

Refund at drop off-No incentive

Highlights:

- Added fee credit to the Accept page because it’s important info that was missing from the dispute workflow
- Made updates to the "Accept with Return " messaging to increase user confidence and trust in this process

 

Jira Ticket

 

Cohesion between all productsUse the same system as forward-moving money movementReadability, easily understandableFee credits are understandableTake home fee understandableUpdated look - let’s be really tight with our visual design skillsterminology/ headers language

intro-2.jpg

Multiple item component 

Universal design system for protection products

Purpose statement

We have presented the stacked image for multiple items to the DS team, and it has been approved.

As we now need to implement the approved image in the (multiple) item summary components across our products, we want to ensure that this component is cohesive with the overall look and feel of eBay's design, and then receive approval from the Design System (DS) team.

Flow and page information
What is the purpose of this page and section?

SHP
Seller found an un-authorized purchase


Page where the component will be


We will use the components on the Unauthorized Dispute case pages as the first implementation among our products. ]

We are implementing a cohesive function within our protection products to handle transactions involving multiple items at once.

This component represents the item summary tile for multiple items.

On dWeb, the multiple item image is displayed on the right rail, and on mobile, the component will be displayed at the top as the item summary section, represented by the multiple item image and the first line of item information. These lead users to the detailed item information page which will appear in a popup modal.

Design Process - Studies 1

There are variants that depend on the number of items.

Design Process - Studies 2

We chose the design B direction for the item summary component

The content of item summary information is subsidiary and the body section below is the primary information.

The use of a grey background is intended to visually separate the item component from the rest of the information and to de-prioritize it.

The grey background intended to make users focus on the main white body section of the page.

Research Insights and Findings

Usability Testing - eBay account holders in US ~ 14 participants
Refund at Drop-off, No incentive
Refund at Return Creation, No incentive
Refund at Return Creation, With incentive
Survey - eBay enthusiasts US, CA, AU, & UK ~ 1500 participants
Purpose: To understand if there are significant differences in the level of interest in an account credit across buyers and situations
Overview: Have participants make real trade off decisions in certain refund situations to understand preferred choice
With large sample size, we wouldn’t have to worry about the complexity of having to recruit specifically nonP&A buyers or Gen Z, we would cast a wide net and slice the data accordingly upon analysis

Fast refund scenario with Store credit option

Ignite test result

User problem

Sellers don’t understand eBay is giving their fee credits back when they give a refund.

Customer Insights This design research was a high level walkthrough of the fee credit discovery audit in the seller journey.

Voice of the customer

eBay charged sellers incorrect fees after issuing a full refund back to buyer.

Sellers requested for fee credits and didn’t receive a timely resolution.

Sellers were never reimbursed for their fee credits.

Sellers couldn’t access fee credit due to broken link.

Sellers are frustrated by post-transaction process and fee credits.
‘eBay will not give back my fee credit.’
‘Shouldn’t I receive a final value fee credit for the cancellation?’

 

Secondary problem

In general, refund pages were testing as confusing to users.

Discovery testing session and insights:


The refund experience is inconsistent across protection products. It is confusing when switching from one product to another.

When mentioning fee credit across all post transaction flows are inconsistent.

Some terminology around fee credits are not clear.

Money reconciliation is confusing due to the (pos and neg) fee credit amounts.

On return, each item need to return separately and it is tough. I need to figure out a lot of numbers such as combined shipping fees.

Research objectives

Business context and objectives

Sellers are able to easily understand fee credits and refund breakdown. This will increases TRUST with sellers.

What are we testing?

Finding the most clear and intuitive usability and design (UX/UI) to help our customers reconcile the various refund and credit amounts easily and quickly.

1 

Do sellers understand what the fee credits are and that they are getting them back?

2

Is the Refund summary understandable?

3

Can we use negative instead of positive numbers on refund pages?

Method

A/B test for direct seller’s feedback to confirm which Refund Summary layout (2 designs+ 1 variation) is more usable and easier to reconcile and fasten the payment process to complete.　

Participant

Mid to small business US sellers who have previously processed refunds on the site. 

Refund summary usability on Mobile and Web 

 

One Refund experience

07.25.2023

Link to Figma

 

Open questions  

We want to test:

 

  1. Do users understand the Refund summary page?

  2. Does the seller understand the fee credits without a tooltip?’

  3. What information or numbers do users want to evaluate/confirm in order to refund buyers?

 

Other questions 

We want to test:

 

  1. (Compared to the existing design) Are the new 3 layouts easier to calculate for the refund process?

  2. (Compared to the existing design) Are the new 3 layouts easier to understand the fee  credit?

  3. Which layout is easier to find numbers to reconcile? (A/B test on 3 new designs)

  4. This page should only be used for calculating the refund? 

  5. Do users need the itemized receipt ?

  6. What do users expect on this page? What do they need in this page?

  7. Does the seller need the items info with the photos?

  8. Confirmation page- do users understand this page?

 

  1. (Do you understand fee credit?) Does it make sense to use color to indicate seller’s fee credit and debits?

 

  1. Do users need the option to relist the canceled item on this page?

  2. Opt *Should the canceled item(s)  list be at the top on the page or in a drawer? How important is it for users to scan the items?

 

Make of copy of this template

 

  1. Send this template to your partners for this concept test

    1. DPM to schedule Working Session 1

    2. DPM to schedule Working Session 2 to lock document

    3. DPM to grant access to Ignite

  2. Ignite to schedule walk through the Wednesday/Thursday prior to your Tuesday session


 

(Name of flow/concept)

 

(One) Refund flow (from Pre-refund as Refund summary page to post-refund pages)

 

A/B testing to find the best usability/design from 3 different layouts

 

Dweb testing only due to only 15 min testing (Please confirm the testing timing)

 

Context:

 

A Seller received the cancellation notice and needed to determine the refund balance to the buyer. ( Cancellation case)

 

  • Opt: Or a seller initiated the cancellation and went through the refund process (SIR case)

 

Goal:  To get feedback for determine the easiest and clearest refund experience for sellers

 

  1. Find the most clear and intuitive usability and design (UX/UI) to help our customers reconcile the various refund and credit amounts easily and quickly.

 

  1. Find the most transparent and effective UX/UI for our customers to understand fee credit (i.e. Provide immediate breakdown of fee credits on the page). 

 

  1. Find easy accessibility and scannability of info for users who need it



 

Testing methodology: Initial questions, “imagine if” scenarios, form completion

 

“Imagine if” scenarios

You had sold your product on eBay and received the payment from the buyer. Unfortunately, the buyer canceled the purchase and requested a refund.

Scenario 1:  I want you to imagine that you agreed to either full or partial refund to the buyer and now you are on the refund summary page to reconcile the refund amount in order to submit the transaction for refunding the buyer.

 

High level questions

  1. “ Do you understand the refund summary?” 

Link to Prototype  

Steps to easily interact: 

Entrer point 

  1. Show the enter point (email)  [Entry point ] Email notification; the buyer wants to cancel the order, and requested a refund to the seller.

Prototype 1: Existing refund summary design 

 

In order to test and compare the 2 new design layouts + 1 variation, showing the existing design first.

 → refund summary page (Pre-refund)

Click the info icon right after the line item, “Fee credits”  → the infotip pops up (Read the infotip and ask if the user understands the fee credit.)

Click expansion control to show (fee credit) details → Fee credit details are shown. (What do you think about the detail info? Do you understand the fee credit?)

↓↑

Click the control button to collapse

Click the CTA to submit the refund request

 

Flow 2: Design A

  1. Refund summary page (In this case, ‘Accept’ is chosen.)

    • The users look at this layout and examine the contents. (All questions about what they see in the summary. Do they understand the summary section?) Reconciliation is easier than the existing? Is there anything that they doubt about the numbers? Do they hesitate to click the CTA? Do they need more/less information?)

 

  1. Click Info icon in Fee credited to refund box  (What do you think about the clarity of fee credit? Is this clearer about fee credit? )

 

  1. Click ‘ See details’ expansion control

    • It shows the fee credit details (What do they feel about fee credit details? Is it irrelevant or relevant? Is it helpful to understand the fee credits?)

     4.   Click CTA to submit the transaction (Was it easy to reconcile the refund total? Did it take a shorter time to complete the refund? Did they hesitate to commit the action? Any confusion? 

     5.  Post transaction page : Completion


 

Flow 3: Design B

1.　Refund summary page　(same process with Layout A)

  • The user examine this layout comparing previous design. ( What do you feel about this layout? Is this easier to reconcile the refund number? Do you understand Fee credit? Is it easier to understand the fee credit? )

2.　Click ‘ See details’ expansion control

  • It shows the fee credit details (What do they feel about fee credit details? Is it irrelevant or relevant? Is it helpful to understand the fee credits?)


 

Flow 5: Design C

1.　Refund summary page　

  • The user examines the numbers. This is exactly the same layout with B-1 nit symbols are reversed (+ to -, - to pos)

(What do you think about the numbers? Is this confusing or easier to understand? ) 


 

____________________________________________________________________________

Questions after interactions

 

A. Questions before any interaction on pre-refund pages  (ask before each flows on existing, A, B & C)

  1. Clarity:

    •  “ Do you understand this page?”

    •  “Is there anything unclear or confusing in categories, line items or other information on this page?” “ Are you able to reconcile from the information you see on the page?”

 

  1. Completeness: 

    • “Do you understand the fee credits?” “Do you understand the fee credits (without tooltips)?” ←this question is only asked on only design A (and existing)

    • “Is everything on the right page when you need it? ”  

 

B. Questions after interactions on pre-refund pages

  • “Does this page have all the information that you need to reconcile and make refund transactions? (existing, A & B-1 or B-2)

 

  • “What more information would be helpful prior to committing your action for the refund? Do you need to find any additional information in order to reconcile your refund?

    • Do you need an itemized receipt for a multiple item cancellation case? 

    • Do you need refund item detail information? If so, what information would you like to see?

  • “ Do you need an itemized receipt?” 

  • Which design is the clearest and easiest to reconcile the refund? Tell the 

  • “ Should this page only be used for reconciling the refund?  “ Do you need the items that you are re-listing on this page? ” 

 

C. After showing post-refund pages (all existing, A, B & C)

  1. Completeness (cont.) : 

    • Which page/design is easiest to find the information you need?

 

  • Comparing the 2 (+1 variation ) layouts: “ Which layout is the easiest and most clear to go through the refund process?” - Should this question be asked before or after showing 3 new design layouts?

 

  1. Meet quality and eBay standards:

    • “Is this page clear for what you need to do?” 

    •  “What do you expect on this refund pages? What do you need in each page?”  

 

  1. What is your overall impression of …

    • the refund summary page on all A,B-1,and B-2 layouts?

    • the easiest and clearest to go through the refund process?

    • Comparison between 2 layouts and existing page?

   Scenario 1 mobile: Refund summary page only:  on mobile only 

                       Same as A :

 

 

   Scenario 2 mobile : Refund summary page only:  on mobile only 

  • → click the icon after Items and bottom drawer shows up and the category description information will be read

  • → click the icon after Fee credit and bottom drawer shows up and the category description information will be read

  • → click the icon after How you’ll refund and bottom drawer shows up and the category description information will be read

      You are on mobile, and reconciling refund to the buyer. 

  • Do you understand these sections?

  • Do you understand the fee credit section without any explanation?

  • Do you need to look into infotip from the info icon?

  • Do you prefer the sec description is in the info icon? Or do you prefer to hide the info in the icon?

 

 

Scenario 3:   Item receipt in drawer

It won’t be tested for the drawer opt to be tested. (Confirm)


 

Scenario 4:   Color test on numbers

Scenario 5: Post- transaction design A/B

 

 

Design C

      2.　Refund summary page　(accept a cancellation as default)

  • → click View all 3 items to extend 

      3.   All items shows up

  • → click View less items to collapse

      4.   Click CTA to submit the transaction

      5.   Post transaction pages : Pending and completion



 

 

 

—----

Clarity questions on mobile

  • Only on Mobile: “ Do categories need additional descriptions, especially in the case of  fee credit? Is it preferable the additional info is hidden under the info icon or on the page? Which is more usable to you? 






 

One Refund experience

5.30.2023


 

How to use this template to capture the context, goals, methodology, questions and more


 

Open questions  

We want to test:

 

  1. Do users understand the Refund summary page?

  2. Does the seller understand the fee credits without a tooltip?’

  3. What information or numbers do users want to evaluate/confirm in order to refund buyers?

 

Other questions 

We want to test:

 

  1. Which layout is easier to find numbers to reconcile? 

  2. This page should only be used for calculating the refund? 

  3. Do users need the itemized receipt ?

  4. Do users need the option to relist the canceled item on this page?

  5. What do users expect on this page? What do they need in this page?

  6. Does the seller need the item info with the photo?

  7. Confirmation page- do users understand this page?

  8. (Do you understand fee credit?) Does it make sense to use color to indicate seller’s fee credit and debits?

 

  1. Opt *Should the canceled item(s)  list be at the top on the page or in a drawer? How important is it for users to scan the items?

 

Make of copy of this template

 

  1. Send this template to your partners for this concept test

    1. DPM to schedule Working Session 1

    2. DPM to schedule Working Session 2 to lock document

    3. DPM to grant access to Ignite

  2. Ignite to schedule walk through the Wednesday/Thursday prior to your Tuesday session


 

(Name of flow/concept)

 

(One) Refund flow (from Pre-refund as Refund summary page to post-refund pages)

 

A/B testing to find the best usability/design from 3 different layouts

 

Context:

 

A Seller received the cancellation notice and needed to determine the refund balance to the buyer. Or a seller initiated the cancellation and went through the refund process.

 

Goal:  To determine the easiest and clearest refund experience for sellers

 

  1. Find the most clear and intuitive usability and design (UX/UI) to help our customers reconcile the various refund and credit amounts easily and quickly.

 

  1. Find the most transparent and effective UX/UI for our customers to understand fee credit (i.e. Provide immediate breakdown of fee credits on the page). 

 

  1. Find easy accessibility and scannability of info for users who need it

 

Testing methodology: Initial questions, “imagine if” scenarios, form completion

 

“Imagine if” scenarios

You had sold your product on eBay and received the payment from the buyer. Unfortunately, the buyer cancel the purchase and requested a refund.

Scenario 1: You agreed to either full or partial refund and now you are on the refund summary page to reconcile the amount in order to submit the transaction for refunding the buyer.


            Scenario 2: Prior to reconciling the refund, you want to take a look at your item to recall what it was and how much you price on the item. 

 

High level questions

  1. “ Do you understand the refund summary?” 

 

Link to Prototype

Steps to easily interact:

  1. Show the enter point (email)　→　VOD　→

Design A

      2.　Refund summary page　(accept a cancellation as default)

  • → click Info icon in Fee credited to refund

      3.   Infotip shows up → X (Exit)

      4.   Click CTA to submit the transaction

      5.   Post transaction pages : Pending and completion

 

Design B

      2.　Refund summary page　(accept a cancellation as default)

      3.   Click View itemized receipt link →Modal to check items

      4.   Click CTA to submit the transaction

      5.   Post transaction pages : Pending and completion

 

Design C

      2.　Refund summary page　(accept a cancellation as default)

  • → click View all 3 items to extend 

      3.   All items shows up

  • → click View less items to collapse

      4.   Click CTA to submit the transaction

      5.   Post transaction pages : Pending and completion

 

On Design B Category description on mobile

 2.　Refund summary page　(accept a cancellation as default)

Design 1

  • Descriptions are under each category.

Design 2

  • → click the icon after Items and bottom drawer shows up and the category description information will be read

  • → click the icon after Fee credit and bottom drawer shows up and the category description information will be read

  • → click the icon after How you’ll refund and bottom drawer shows up and the category description information will be read

On Design B Item receipt in drawer

It won’t be tested for drawer opt.

 

Questions after interaction

  1. Clarity:

    •  “ Do you understand this page?”

    • Comparing the 3 layouts: “ If you understand better or worse depending on how it is laid out, please identify the best layout out of 3.”

    • Only for  Mobile: “ Do categories need additional descriptions, especially in the case of  fee credit? Is it preferable the additional info is hidden under the info icon or on the page? Which is more usable to you? 

 

  1. Completeness: 

    • “Do they understand the fee credits (without tooltips)?” 

    • “Is everything on the right page when you need it? ” 

    • “Does this page have all the information that you need to reconcile and make refund transactions?

    • “What more information would be helpful prior to committing your action for the refund? Do you need to find any additional information in order to reconcile your refund?

      • Do you need an itemized receipt for a multiple item cancellation case? 

      • Do you need refund item information? If so, what information would you like to see?

    • “ Do you need an itemized receipt?” 

    • “ Should this page only be used for reconciling the refund? ” 

    • “ Do you need the items that you are re-listing on this page? ” 

 

  1. Meet quality and eBay standards:

    • “Is this page clear for what you need to do?” 

    •  “What do you expect on Pre and post refund pages? What do you need in each page?”  

 

  1. What is your overall impression of …

    • Refund summary=pre-refund page and post-refund page?

bottom of page