Uphold card for EU and UK users
Assigned task: Craft copy for the user flow that’ll enable EU users to order and start using the Uphold Card.
My role: UX writer and Copywriter.
Expected outcome: The user orders and uses the Uphold card, whilst taking advantage of its virtual version for online purchases.
Copy categories covered: Banner copy, modal copy, push notification, bottom screens, CTAs, form fields, coach marks.
The challenge
The Uphold card was being released to the UK and EU market, whilst previously it was exclusively available to the US market. For the US, the users had to download a distinct app for the Uphold card alone in order to order, use and track all transactions made with it. For the EU users, the objective was to discard the need for a separate app and to integrate the card’s flow within the Uphold app and web. Therefore, while some screens came with pre-existing copy that merited improvement, there were a whole bunch of new screens that needed freshly drafted copy.
The Uphold user should be able to order the Uphold card in the app itself;
If the user is not verified, they should be prompted to do so when they tap to request the card;
If the user does not have sufficient funds in their account to pay for the issuance fee, they should be prompted to fund when ordering the card.
A few days after the user orders the card, the activation option will pop up in the app. When the user gets the physical card they just need to tap it to activate the card;
Immediately after the user orders the card, a virtual card with the card details same as the physical card will be available for them to use for online transactions.
The Uphold card’s user flow needed to accommodate the following:
The different stages of placing an order for the Uphold card,
Introducing the virtual equivalent of the physical card and its benefits,
Making transactions using the Uphold card and tracking the same,
Allowing the user to change the card’s funding source,
Reporting the card as being lost or stolen.
My approach
I collaborated with the Product Manager, the Lead Designer and the COO for the purpose of this user flow.
I explored the Uphold card app for US users to examine what worked and what didn’t.
I conducted a competitive analysis of the user flows for Revolut and Binance cards to gauge the tone, information architecture, flow, and copy.
I reviewd the user complaints and feedback recieved for the Uphold card app vis-a-vis USA.
In terms of crafting the copy, it needed both copywriting to promote the card and UX writing for ordering and using the card. For the purpose of promoting the card, after discussing with the COO, we decided to use the same language used by the Marketing team which involved focusing on the card’s versatility, accessibility, and ease of use.
Ordering the Uphold card and meeting the requirements for ordering it:
Requirements that need to be completed to be able to order the Uphold card:
User identity needs to be verified (if not already completed).
2-step verification enabled (if not already enabled).
Have a minimum of $5 in their account for the card’s shipping cost.
Confirm address for card’s delivery.
Set up the card’s security PIN code.
Copy before:
Headline: Swipe to change view
Body: Swipe left to navigate the Uphold card and swipe right at any time to get back to your balance and accounts.
Copy after
Coach mark: Swipe to get your Uphold card
Copy before:
Heading: The Uphold debit card
Body: Get a Mastercard debit card that lets you spend fiat and crypt at nearly 50 million merchants worldview.
CTA: Get your card
Card shipping costs $4.99
Copy after:
(I suggested moving the info about card shipping cost above the CTA since it’s best if the user reads it before he orders the card)
Heading: Uphold card
Body: You can spend any of your assets on the Uphold card as cash, from physical gold to Bitcoin! Order yours now to access instant liquidity.
Includes a one-time fee of $4.99 for shipping
Card shipping costs $4.99
CTA: Order your card
Where the user quits the app when prompted to complete any of the above-mentioned steps before he can order the app, he’d be displayed the following banners every time he’d access the app:
(Copy drafted/edited directly on Figma. There’s no ‘before’ version of the copy available)
Phone number and address verification:
Updating address:
Before
After
Setting the PIN
(Copy drafted/edited directly on Figma. There’s no ‘before’ version.)
Funding the card:
(Copy drafted/edited directly on Figma. There’s no ‘before’ version.)
Card’s production stages
(Copy drafted/edited directly on Figma. There’s no ‘before’ version.)
Copy as drafted for the bottom sheet.
Copy as drafted for the bottom sheet.
Copy as drafted for the bottom sheet.
Activating the card
(Copy drafted/edited directly on Figma. There’s no ‘before’ version of the copy available.)
Copy as drafted for the ‘Activate card’ banner.
Copy as drafted for the ‘Activate card’ CTA.
Copy as drafted for the confirmation dialogue.
Copy as drafted for the success toast.
Order successfully placed!
(Copy drafted/edited directly on Figma. There’s no ‘before’ version of the copy available)
Final copy iteration:
Heading:
Your Uphold card is on its way!
Body:
We’ll send the physical Uphold card to your address with instructions for activating it.
You can start transacting as soon as now with your virtual Uphold card!
What can I do with my virtual Uphold card?
CTA:
Start using the virtual card
Final copy iteration:
Heading:
Make your first transaction!
Body:
While we’re getting your physical Uphold card to you, get started with online purchases immediately using your virtual Uphold card.
Copy as suggested for the heading and subheading.
Card’s security: Freeze card
(Copy drafted/edited directly on Figma. There’s no ‘before’ version of the copy available)
Copy drafted for ‘Card settings’ bottom sheet.
Error toast: Once the user toggles on the ‘Freeze card’ option and tries to perform a transaction.
Error toast: If the user tries to activate the car while it’s frozen.
Card’s security: Report card as lost or stolen
(Copy drafted/edited directly on Figma. There’s no ‘before’ version of the copy available)
Copy as suggested for the entire screen.
Copy as suggested for the entire screen.
Copy as suggested for the bottom sheet.
Card’s security: View pin
(Copy drafted/edited directly on Figma. There’s no ‘before’ version of the copy available)
Card transactions
(Copy drafted/edited directly on Figma. There’s no ‘before’ version of the copy available)
Uphold card coach marks
(Copy drafted/edited directly on Figma. There’s no ‘before’ version of the copy available)
