A deep dive into how I redesigned the account backup feature for the Radix Wallet.
Project overview
Context
As part of a large project to build a new security platform in the Radix Wallet, we realised the existing Account Backup feature was not good enough. It was unnecessarily complicated and intimidating for users. It went against the Radix ethos of creating products that delight. This screen was scary and it was my job to fix it.
Why it matters
Without an activated Account Backup, a user could lose access to their Radix Wallet if they were to misplace their phone or have it stolen. In the world of Web3, where people hold digital assets worth real money in accounts, losing access to your Radix Wallet would be a disaster.
My role
This was mostly a one-man project and my brief was simple: redesign Account Backup to be better than it currently. Once I’d come up with designs for prototypes, I ran them by:
Head of Design
Chief Product Officer
Then I worked with a product designer to turn the content into screens for the Radix Wallet.
The process
Gathering information and ideation
First things first: I took a look at the existing Account Backup screen. As you can in the image, it’s long and wordy – a result of someone wanting to give all the information all at once, and not just the necessary information at the right time.
One study shows that people read only 28% of the words on a screen. And that the more words there are, the lower this percentage goes. My job was to cut the wordcount down to the bare required minimum.
I isolated the key information that a user would need and took to Whimsical to create five prototypes. When I shared these with the Chief Product Officer and the Head of Design, we selected parts from two of the four prototypes.
Then I was back to the drawing board.
Designing
I used Whimsical to design the new screen:
The feature name changed to Configuration Backup. The CPO requested we change it because he felt “Account Backup” or “Wallet Backup” were too vague in their description of what this feature delivered for the user.
A short piece of body copy explains what the configuration backup does.
A component showing when the last backup was taken, with a small graphic to signify the component’s function.
Toggle switch to easily turn backups on and off.
An export backup file button allows the user manually export a backup as a file. Extra security feature for the expert user.
Testing and iterating
I carried out some testing with colleagues from different areas of the organisation. This image shows the final draft, the one that we tested with users.
Their feedback suggested:
They still weren’t quite sure what a Configuration Backup was.
They didn’t know what was backed up in the four different sections under Configuration Backup status.
The ‘i’ icons implied a tooltip. They should have been exclamation marks instead, to denote a warning.
If I had more resources, I would have tested the prototype with users from outside the company. It would have been more helpful to test it on people who’ve never seen the product and will be more willing to see flaws in teh design. But the feedback I got was still helpful and informed our final designs.
Outcome
The final product
After two rounds of testing and three iterations, I delivered the final product (the image at the top to shows the old and the new screens side-by-side).
The new Configuration Backup design now serves a key function in the updated Security Centre. According to the six users we tested, they find the screen more informative than the previous one, and easier to use.
This task only took three days to complete. But it ended up serving as a good example to my colleagues of good content design practices:
Function is key – understand your user’s goals. Then design your content so they can achieve them easily.
Be concise – give only necessary information at the moment the user needs it.
Use non-text content – different colours, symbols and buttons can help a user reach their goal quicker without increasing their mental load.
