MultiversX Tracker is Live!

Metamask - UX Analysis

All Cryptocurrencies

by COINS NEWS 90 Views

Metamask - UX Analysis

Have been building webapps for the past 10 years and want to check how wallets are following good UX patterns. My target user is someone with no experience in the web3 what so ever. Everything is new and confusing for him. I won't go easy on them. But I will provide potential improvements.

Onboarding

Start screen of metamask when opening

A three page slider containing information about:

  • Let's get started - Trusted by millions, MetaMask is a secure wallet making the world of web3 accessible to all.
    • Why metamask is cool and you should trust them
  • Explore decentralized apps - Store, send and spend crypto currencies and assets.
    • What you can do with this software
  • Say hello to your wallet - Use your MetaMask to login to decentralized apps - no signup needed
    • Additional features beyond sending assets

What problems do we have here?

  • Not all users will see all three slides as users have to manually click through them, which they won't. Especially the "what" (second slide) is important imho.
    • Either slide them automatically or show the "Create a wallet" primary action and the last slide. Kinda like a tutorial.
  • The order is more trust focused (trust metamask as first slide) then focusing on explaining features and expectations.
    • Move the "what" slide to first index

Share information for measuring performance and metrics

Analytics

Regardless of which action you choose afterwards (create or import wallet) metamask will ask you to share information. This is the wrong spot. If the users clicks on "create wallet" it wants to create a wallet. If the user clicks on "import wallet" it wants to import wallet.

  • Move as checkbox to previous screen. The added information with text can be shown as overlay/link

Also you don't mix centered and left aligned text. Either everything is centered or everything is left aligned. If you choose centered be cautios how much text you have. This here is too much. One or two lines centered are ok.

  • left align everything for readability

Create Wallet

Create wallet wizard

Missing context (I clicked on "create wallet" now see "create password") No title

  • Add consistent title over all steps. Play a little with typography
  • Additional steps after "Create a new wallet" button click
  • Rename button to "next" as the setup wizard is not done yet (2 steps left)

[I'm conflicted on the secure wallet step. Add more later, maybe]

Finish screen

Complete screen

Good guided final stepped information for easier use, as chrome extensions are hidden by default. As we are forwarded to the overview page inside chrome I question its need here.

  • Show in overview as additional information, not as a "mandatory step" to finish the setup process

What's new

Version change news

Especially for new users this screen is useless. Someone just entering the web3 world doesn't care about the changelog. But nicely done. Has screenshots, extremely user value focused and has even call to actions "try it out"

  • Hide for new users
  • Maybe don't show as dialog instantly. Move to notification are that the user can explicitly open

Overview

Initial view for new users after setup complete

  • Account switcher - New user has just opened its first wallet. Why see a switcher now. This adds unneeded complexity and confusing
    • Only show switcher when more than one account is present
  • Too many primary user actions. Buy, send, swap, bridge, portfolio
    • Why have a send action when nothing can be send? Same for swap and bridge - Disable until funds are in
    • Highlight buy (or add "receive") action more as that will be the very first action new users will interact with
    • Portfolio shouldn't be that emphasized. Move as a secondary action
  • Actions also lack any explanatory information
    • Add hover texts, add subtitles, replace icon buttons with wider cards for additional information

I could go deeper but I think that's enough for today. Maybe I'll check out other wallets if this is interesting for you guys

submitted by /u/Saschb2b
[link] [comments]

Get BONUS $200 for FREE!

You can get bonuses upto $100 FREE BONUS when you:
πŸ’° Install these recommended apps:
πŸ’² SocialGood - 100% Crypto Back on Everyday Shopping
πŸ’² xPortal - The DeFi For The Next Billion
πŸ’² CryptoTab Browser - Lightweight, fast, and ready to mine!
πŸ’° Register on these recommended exchanges:
🟑 Binance🟑 Bitfinex🟑 Bitmart🟑 Bittrex🟑 Bitget
🟑 CoinEx🟑 Crypto.com🟑 Gate.io🟑 Huobi🟑 Kucoin.



Comments