Redesigning Utrust’s Crypto Payment Gateway

I conducted a thorough UX audit for all products and redesigned the Payment Gateway and Payment Flow in collaboration with the team. The major additions were integrating De-Fi wallets and improving navigation. User interviews validated assumptions, revealing preferences for personal wallets and Bitcoin for larger payments. The achievements included support for new currencies, a smoother payment flow, cost reduction, and improved customer support for authenticated users. Close collaboration with the team ensured a successful outcome.

ORG

Utrust

Year

2022

Position

Sr. Product Designer

Contributions

  • Product Design
  • Product Discovery
  • UX Research

Collaborators

  • Max Bilichenko's image
  • Antonin Hackenberg's image
  • Bugra Kocak's image
  • Emre Akinci's image
  • Zdenko Nevrala's image
  • Sanja Kon's image
  • Pierre Dutheil's image
  • Rita Vilaça's image
  • Martinho Aragão's image
  • João Gonçalves's image

Redesign of a Crypto Payment Gateway

redesign-prototype-lightbg-1080p-30fps.gif

In my first week, I did a UX audit for every product Utrust had. Upon presenting my findings to the product team, I mentioned what could be done to improve the product from a UX perspective, and after discussing and evaluating the feasibility of the proposals with the team we redesigned and implemented the Payment Gateway and Payment Flow with close collaboration with the developer teams and project managers.

Most important additions to the redesign

Wallet integrations

Enable users to connect and use their De-Fi wallets, in a very easy way.

Much better navigation

The previous implementation had its limits and because of those limitations, there were some pain points in the navigation. Namely; going back between steps. Displaying the steps in a payment process – or in any process in general really – is helping users to understand what’s going to happen in the next step. Also, it ensures this process will not take much of their time.

Laptop-Mobile-Teaser.gif

Assumptions needed to be validated

Based on the UX Audit and discussions with other teams, we had a pretty good idea of what to build and improve. Right around we were starting the design sprint, we wanted to reach out to people who had previously paid for something using Utrust. They’ve been invited to answer some questionnaires and afterward, we interviewed some of them.

happy-flow-prototype.gif

Some key takeaways from the interviews:

People prefer their own wallets to custodial wallets like CEX

  • Some interviewees mentioned that even if they don’t have any holdings in their wallets they would prefer to move their funds from centralized exchanges to their wallets and then make the payments. This was interesting because while it validates one of our assumptions it also shows the priority gap between wallets and custodial wallets.

Rainbow on Mobile, MM on Desktop

  • Our assumption was MM would be a clear winner on both mobile and desktop followed by Trust Wallet on Mobile.

People prefer Bitcoin for big payments

  • There might be some bias involved with this, big investors are usually keen to take fewer risks while small portfolios have more exposure to more volatile assets. When asked, which one they would prefer to use for payment if they had the same amount (in fiat) on both BTC and ETH, the majority answered ETH because of the block times.

micro-interaction.gif

payment-flow-2.jpg

I’ve closely collaborated with the head of engineering (DRI of Payment Flow’s backend), product manager of the project, and QA Manager and we worked on improving the flows I first imagined. We then decided to use a time-based diagram to see all the use cases and edge cases more clearly and cover guide and took decisions based on that.

payment-flow.png

work-session.jpg

loom-recordings-ss.png

I paired up with @Rita (the QA & Delivery Manager of Utrust) to perform Design QA. I like to over communicate my findings with the developers/engineers because not everyone understands the same things from the same words. So I screen record and talk over it, as well as write up detailed repro paths and expected behavior/implementation. I also pay attention to explain the design decision behind why it should be as it’s described. This pulls devs into the design process as well and it’s sometimes just what the product is needed. A new set of ideas!

The achievements of the redesign

  • Support for new currencies and new payment methods
  • Much easier payment flow
  • Reduce the fees that the company spends
  • Authenticated users for better communication and reliable after-sale customer support
Joao Goncalves
Joao GoncalvesProduct Designer @ Utrust
I like how you keep asking for opinions on what you’re working on. All the times we’ve paired to review design changes or fixes on the HTP or the Payment Gateway have felt really productive. We feed off of each other’s ideas very well and we’ve come out of it with something great. You’re also always available to do it the other way around and helped me unlock the KYT actions feature for the MT when I was struggling with that for example. Your ability to deal with constant changes and just keep on delivering fast is also a great attribute.
Rita Vilaça
Rita VilaçaQA & Delivery Manager @ Utrust
“The fact that AK joined with an incredible will to make things happen and to bring up new cool and up-to-date inputs, aligned with his specific knowledge about similar niche products, made all the difference and we can see it on the new Widget.”
Pierre Dutheil
Pierre DutheilProduct Manager @ Utrust
“From what I saw in the Widget screens, I think you’re bringing a real knowledge of web3 in general and that’s very useful. You helped clarifying the needs for the widget and that unlocked the redesign.”

Previous

Creating the Design System of Utrust

Next

Rush

Book a free discovery call

I help startups with product design, design critics, QA testing and design advisory.

crafted by ak