Disclaimer: This article shares best UX practices that we’ve seen over the years in designing for crypto & Web3 products. YOU are responsible for the safety of your funds, tokens, and assets. This should not be taken as financial or custodial advice, and we recommend that you consult with a financial advisor.
Where the Web3 Journey always begins…
When it comes to Web3, there are many barriers to entry: getting lost while trying to understand how the blockchain works, getting frustrated on how to even setup or buy crypto, being worried about that one horror story about someone losing millions… the list goes on.
Most give up at the basics (understanding blockchain) because everything feels so overwhelming. BUT, once in a while, people hear something to get them over the hump. Maybe they hear that their cousin’s friend from work made $1M flipping NFT’s on Magic Eden last year…
That’s when they fall into the rabbithole.
Most newbie Web3 users come in and will stop by an exchange like Coinbase to purchase their first BTC, ETH, or SOL. They will likely create an account, connect their bank, complete KYC (Know Your Customer) information, and be off to the races!
However, the crypto newbies still have their worries tucked away in the back of their minds… The #1 biggest concern that we’ve learned from dozens of user interviews we’ve conducted is this:
How can I keep my assets safe?
Why is safety & security such a big deal in Web3?
Web3 was created to put the power in the hands of the people (YOU!). This concept of “decentralization” is a core tenet of Web3. This means the crypto users get to keep custody of their assets! But this also means they have the responsibility to keep their funds safe, to keep them away from hackers, to avoid getting phished, to avoid losing their keys, and so much more.
Most people, unfortunately, are wildly unprepared for this reality. That’s where good design comes in.
At Matcha Design Labs, we’ve been designing digital wallets of some sort since 2018. Over the years, we’ve gathered a few tips and tricks that we believe create more awareness and safety for the end user. In this article, we’ll cover 3 of them:
- Wallet setup practices
- In-context education
- Visual hierarchy to encourage safety
Crypto Wallet Setup Practices
Frequently, when a user is setting up a new Metamask wallet, they are trying to go through it quickly in order to complete some other action (send funds to buy a Bored Ape Yacht Club NFT, connect to a dApp, or be ready for an Airdrop). In this case, the user is flying through the setup and trying to get through as quickly as possible.
These are the moments mistakes happen.
This is why making the user slow down during wallet setup is crucial. We want them to physically write their mnemonic phrase or private key down so they are able to store it in a safe place offline. One of the best ways to make the user slow down is to have them select a word in their mnemonic phrase to ensure they actually wrote down the word.
Another really great way to have the user slow down and remind them to save their phrase/key is to have simple checkboxes that they have to interact with before moving forward. These can be as simple as confirming that they acknowledge if they lose this phrase, they can never recover their funds.
Slowing the user down in this case is good friction because it asks the user to think before completing an action. Most times, in product design, we avoid friction. In this case, getting through with as few clicks as possible could be detrimental in the long run.
In-Context Education
One of our favorite ways to continue to encourage users in DeFi, NFTs and dApps is to practice safety by having embedded reminders in the wallet or product interface. At Matcha Design Labs, we call this “in-context education.”
In-context education can be little “pro-tips” in the margins, highlighted callouts with icons, or tooltips that the user can hover over to learn about a certain industry term. Although the UI is simple, these little nuggets can really reinforce ideas in users’ minds.
It’s always important to keep the in-context education short and sweet. One thing we do know about ALL users after hundreds of hours of usability testing is that none of them like to read ;)
Visual Hierarchy to Encourage Users
One great way to nudge users to better safety and security practices is through visual hierarchy of an interface.
For example, using a hardware wallet (offline, cold storage) is much safer than using a digital wallet (Metamask or Phantom or similar). A hardware wallet uses encryption to store private keys offline, which creates safety because no one can hack into your computer or password manager to steal keys. It’s recommended to keep most of your funds in a hardware wallet like a Trezor or Ledger.
Let’s say you’re creating a new account on MyCrypto to setup a wallet and you’re asked how you’d like to connect, we could create a design where we highlight the hardware wallet options over the alternatives. They could be highlighted by using a certain order of buttons, having larger size buttons or using different colors. This visual hierarchy encourages the user to think that they should choose that option over another.
Visual hierarchy can also be as simple as using primary and secondary buttons in strategic ways. The designer can prioritize a safer action with a bigger/bolder primary button and de-emphasize the less desirable action with a more subdued secondary button.
Simple touches like this can guide the user to safer practices subconsciously and even save them from losing thousands of dollars (or more!).
We hope you loved our hot tips for designing safer products for the Web3 space. Whether it’s DeFi, a DEX, an NFT Marketplace, or a digital wallet, there’s LOTS to consider when you have the responsibility to guide users as they enter the world of Web3. It can be daunting.
At Matcha Design Labs, we believe that we can change how daunting Web3 is by practicing and embedding safety best practices within the designs and flows we create. This is the 1st step to making Web3 a more accessible place for everyone!
