Cash Pickup Feature

 

Cash Pickup Web Flow & Mobile App

UI/UX, RESEARCH, CONTENT STRATEGY
TIMELINE: 8–12 WEEKS | LAUNCHED: JAN 2016

Press: Yahoo Finance

The “Cash Pickup” feature allows Serve and Bluebird pre-paid card users to withdraw cash at any Walmart, as an alternative to using an ATM. In 2014, a large amount of tax season call volume regarded withdrawal limits that prohibited users from receiving their tax refunds in cash. By building cash withdraws at retail stores, we alleviate this pain point while also reducing call volume.

 

Design Approach

Along with a lead designer, front-end developer, and design manager, I held a co-creation workshop for the design team to sketch a user's potential journey, beginning with initiating a transaction, through picking up the cash at Walmart. We identified the three most critical moments in this journey: feature education, making a withdrawal, and cash pickup. 

Sketching and identifying the key moments of the experience

OUR KEY MOMENTS

Feature Education

Encourage users to adopt this feature by providing general information, such as fees, limits, and store locations. 

Make a Withdrawal

Clean and clarify form, so that users can complete the transfer with ease and confidence. Communicate Ria’s role in this service to our users. 

Cash Pickup

Streamline the experience between the online and in-store pickup by enabling users to easily access their pickup code. 

 

Logic Map & Service Blueprint

After creating “successful transaction” and “canceled transaction” logic maps with a front-end developer, we made a service blueprint that outlined the user's key moments, channels, phases, user action, user mindset, server/API calls, and potential errors when completing a withdrawal.

Key Takeaways

Seeing the user’s key moments outlined in a service blueprint helped our team plan our delivery structure. For example, we foresaw that the “Making a withdrawal” key moment would be the heaviest tech lift, as many server and API calls would be made between our platform and Ria’s separate server, so we designed and delivered that piece first. 

 

Competitive Audit  

Looking at competitors such as Google Wallet, Transferwise, Square Cash, and others, we determined to use visuals to simplify information and user flow into clear, concise moments, while meeting our users at the key moments of their journey.

 

Field Work

The team and I did field work at several New Jersey Walmart locations to get a feel for what a user might experience when sending and withdrawing cash at a Walmart MoneyCenter.

RESEARCH GOALS:
• Build empathy with our users during the initial purchase experience
• Learn about our users and their behaviors
• Understand the landscape of options presented to our users in all aspects of their lives
• Learn how competitor products work from
a user experience perspective

KEY TAKEAWAYS

We learned we’d need to make the online withdraw process more streamlined, quick, and immediately digestible, because of long wait times at the MoneyCenter and unreliable machines.

 

Site Map

Since the user action is similar to withdrawing funds or moving money, we decided to elevate this feature by placing it under a new “Withdraw Funds” section within the Pay & Transfer tab in the navigation. All of our main nav items in the mobile app launch directly into flows, so this feature was placed in the main navigation.

 

Sketching Approach

By leveraging as much as we could from existing platform patterns, we can make the transaction experience quick, focused, and simple for the user.

 

Sketching: Making a Transaction

After synthesizing the field work and competitive audit, the lead designer and I sketched our three key moments—beginning with the “Making a withdrawal” flow—for the web and mobile app.

 

Sketching: Feature Education

The three most important aspects of feature education were to clearly state the feature, clarify what other companies are in partnership for the feature, as well as communicate the fee and limit structure.

 

Sketching: Access Pickup Code

We wanted to make sure notifications were clear regarding successful transactions and that cash pickup codes could be accessed quickly, especially considering the user might have multiple active transactions. We also considered how could this screen work as a receipt.

Animation storyboards

 

Successful Transaction Web Flow

In leveraging existing platform patterns, the front-end developer and I began by polishing up our sketch directions and iterating on some quick visual mocks. Other flows that were designed: cancellation, pended scenario, and empty sets.

STORYBOARDS

 

View Past Transactions

 

Mobile App

The web experience was extended to our mobile app, where we again leveraged existing patterns to help support the backend tech lift.


User Testing & Rapid Prototyping

As we completed each phase of the project, working prototypes were assessed in qualitative user testing sessions. I strategized testing methods based on what kind of user feedback we were looking for, then sat in on the day-long sessions, synthesizing takeaways and updating the designs per user feedback, and identifying potential opportunities within the design. 

“It would be nice to have a way to save this without pulling out a post-it.” —User

 

Next Steps

As this feature rolls out, we’ll refer to our data to see how this experience could expand—for example, to users sending cash to other individuals.

 

More Projects