Phantom wallet is a crypto wallet reimagined for DeFi & NFTs, it’s an extension for accessing distributed applications deployed on the Solana blockchain.
UX design
UI Design
User Research
Storytelling
- Overview
- The challenge
- The proposed solution
- The approach
- Benefits
Phantom wallet is a crypto wallet reimagined for DeFi & NFTs, it’s an extension for accessing distributed applications deployed on the Solana blockchain.
Phantom lets users create their own identities (private keys etc), so when a dapp wants to perform a transaction and write to the blockchain, the user gets a secure interface to review the transaction, before approving or rejecting.
In my experience with blockchain design and development, we know that one process that needs to be simplified is how to onboard Web3 users. Thus, if we can make the onboarding process smooth and seamless by adding a positive UX, high-quality and user-friendly UI, we’ll acquire more users, and our dApps will more likely be successful.
No doubt that Phantom wallet possess a high quality UI, but what I discovered is that the onboarding isn’t user-friendly enough. With the rate at which whitelists are being distributed and airdrops are being shared, Phantom wallet won’t be able to serve newcomers to the crypto realm properly because they want to get things done as quick as possible so as to not miss an airdrop or a whitelist. I’ll present a proper solution for this limitation below. However, let’s take a closer look at some of the main problems with the onboarding:
- Field Repetition - The password field is currently two, users have to input the same password twice, so it creates input struggles. (i.e a user with a password that is 17 characters long, has numbers, uppercase and special characters, it’s a nightmare when having to enter all of that TWICE.
- Show/hide Password - There is no way to confirm if a mistake was made when entering the password.
- Loss of Seed Phrases - The only option here is for you to write out the seed phrase which in my experience will get lost without proper management.
Less is more! From a UX point of view, asking users to input password once should be enough. The initial number of password field has been reduced to one to make the process more precise, meaning (airdrop and whitelist) users who are using Phantom for the first time will have easy access without missing out.
It’s not enough to remove the second field (confirm password), if users mistype their password, masking will prevent them from recognizing it which can lead to frustration and password resets.
I included a toggle icon inside the password field for users to be able to mask and unmask their passwords to correct mistakes in the field.
There is no best way to store your seed phrase, because where you decide to store your seed phrase is unique to you, just like many things in life; what works for you, might not work for someone else.
Phantom will have a specific way of storing seed phrases for the users, how will this work? There will be a specific link for each user.
i.e will contain first letters of the first two seed phrases and 3 randomly generated numbers ”https://www.phantom.app/?ke123”
While doing my research I stumbled on a gem that was needed for this to be accomplished this research study stated that the confirm password field was responsible for over a quarter of all users that abandoned their sign up form. It was also responsible for hundreds of user corrections, including field refocuses and deletes.
In summary, when they removed the confirm password field and replaced it with an unmasking option, the number of user corrections decreased and also increased the conversion rate.
- Increase conversion rate
- Reduced user correction
From Zero to Web3 Hero: Buttons Lab's Landing Page Design