An overview of our 18-month project to launch the world’s first decentralized MFA system

Project overview

Context

When I began working at Radix, the design team was already six months into a project to create a new multi-factor security system. No other company had ever attempted to build MFA for a decentralised product, so as designers we had no patterns to follow or templates to copy. It’s the biggest design challenge I’ve ever taken on.

Why it matters

Good security is at the centre of every Web3 product. Assets worth real money are an inherent part of all blockchain activity, so users want to know that the cryptocurrency they’re holding is safe. Our job as designers in Web3 is to build features that users trust but that rare also easy to use for everyone – from the casual user to the obsessed fanatic.

My role

This was a company-wide project, including everyone from the tech team to the product team to marketing. As the lead content designer on the project, I worked mostly alongside:

  • Head of Design

  • Senior Product Designer

  • Chief Product Officer

  • Product Manager

  • Wallet Engineering team

The process

Existing assets and getting up to speed

I arrived when the project was already underway and some assets had already been developed:

  • Some initial user journey mapping.

  • Some basic flows in wireframe.

  • Basic filler copy.

When I’m designing content, I prefer to work from a blank page, without prototype copy influencing my ideas. So my early challenge was to look beyond what had already been done and imagine what a user needs to make their Radix Wallet secure using multi-factor authentication.

My initial content designs

The designs that existed when I arrived moved the user quickly through the flows without instructing them. Bearing in mind decentralised MFA has never been done before so these flows won’t feel familiar to a user, it was important that I guided the user with a bit more care than usual.

I had some early ideas for making the flow easier to move through:

  • I changed the name of the feature from ‘Security Set’ to ‘Security Shield’; the latter is a better descriptor of function and is more intriguing.

  • I drip-fed information, delivering it at the beginning of each mini-section throughout the flow. This set expectations for the user and avoided information overload.

  • I added a link to more information on Security Shields, given they’re a brand new concept and people might want to learn more.

Testing & iteration

Design without testing is just guesswork, especially when you’re trying to create something completely new. So we went through multiple rounds of testing, using UserTesting.com and feedback sessions with Radix colleagues.

Spending six hours a day looking at the same set of screens will blind you from seeing some of the biggest flaws in your designs. Sometimes it will be a screen that doesn’t flow on naturally from the previous one. Other times it will be a single word on a button that doesn’t meet a user’s expectations.

From our first round of testing, it became clear that our users didn’t actually know what a Security Shield was. While we were asking them to create one, we’d forgotten to explain why they needed one in the first place.

The new intro screen I created (see iteration 5) cleared up any confusion.

Outcome

In numbers

Our final designs were thoroughly tested and all users were able to successfully use the feature to set up a Security Shield. Here are some facts and figures to show the size of what we accomplished:

  • Project length: 18 months (for initial launch)

  • Number of rounds of testing: 4

  • Number of iterations: 13

  • Final screen count: 100+

  • Number of new flows designed: 17

What we created

Creating a new MFA system isn’t just building some flows for the user to create the Security Shield itself. Along the way, there were multiple sub-flows we realised we needed. These included:

  • New wallet backup flow

  • New Security Center for the wallet

  • Flow for adding security factors to the wallet

  • Migrating wallet control to another phone

  • Making batch transactions

  • New designs for different states (warning message, empty states, success screens)

It was a large and complex project that took perseverance and strong collaboration skills to complete.