MetaMask Web Navigator

[cjeria]

Seeing this site, made me think of a possible new experience we can provide for users. http://s.muz.li/N2M1OWRiOGQw on the right side is a list of websites you can click loads in an iframe container in the same tab.

I want to propose an additional (experimental) experience to our current extension and full screen mode from new UI.

The Problem

Context switching: The problem I see with the current experience is that there's still a lot of friction and context switching required in the process of using MetaMask to login in to Dapps. Not to mention the steep learning curve and many obstacles new users face entering the space.

The current UX

User end goal: Login to dapp with MetaMask.

• User visit Dapp
• If not logged into MetaMask
• • Open extension
• • insert password
• • • if password is long complex password, user may need to open their password manager, (metamask plugin disappears), login, search for metamask, copy PW to clipboard, go back to metamask, paste password, click unlock.
• • Make sure your on the dapp tab and logged in
• • Not on the right network?
• • • Open the extension
• • • click network dropdown, select the right network
• • • check dapp
• • Not using the right account?
• • • Open the extension
• • • Open list of accounts. Which of my accounts did I use? If I didn't name my accounts properly I need too...
• • • Try switching to all accounts and hope the dapp reloads or dapp somehow indicates to me I'm using the account I previously used.
• Logged in
• End

Requirements to login

• MetaMask unlocked
• Right network
• Right account (if part of the goal is to use same account previously used).

With each step, opening the extension is required to move ahead in the process of logging in to a dapp. This adds a lot of friction and I believe we can improve this ux.

How can we improve the login experience while reducing context switching?

The full page mode in new UI doesn't help with the problem of context switching (would be good to measure how many users are opening full screen mode) but I think we can do better by merging the extension controls (unlocking, networks, accounts and balances) and the dapp experience into one, seamless experience. Less context switching between extension, full screen mode, PW manager apps and dapps.

Suggestions

Auto-detect accounts

Auto-detecting previously used accounts when visiting a dapp and have metamask suggest to the user which account to login in with. We can add a step every time at login that asks the user which account to login with and a check box that says, "Always login using this account?"

• [ ] Always login using this account?
• [ ] Remember this preference and log in automatically next time?

MetaMask Web Navigator

User visits a metamask domain we serve and they can access dapps right from within this website-like-browser experience. I believe I've seen some early versions of MetaMask play with something like this.

The UX would be similar to how mobile ethereum wallet/browsers work (Cipher, Toshi) accept instead of opening a local mobile app (since I'm talking desktop web experience here), they visit web app (e.g. navigator.metamask.io) then visit a dapp. MetaMascara is kind of this, but I'm thinking beyond just a wallet, a dapp navigator within the wallet experience.

The user interface would be an immersive, full-width experience where users have access to their accounts, balances, network controls per tab and view dapps within a contained navigator-like experience. My hypothesis is will significantly reduce context switching.

User Experience

• User visits navigator.metamask.io
• Creates account or if they have MetaMask installed, logs in. Requires downloading the extension for secure storage of keys and signing tx.
• Navigator landing page
• • Off to the far left, user sees their account details, balance, ability to switch accounts, etc.
• • The body section: user sees a grid of dapps to visit and play with.
• • On the right side, there's a drawer that slides in where it's used to display confirm screens, signature screens, etc. (or we still use popups).

[bitpshr]

This is an interesting idea. Instead of attempting to build or bootstrap a new browser entirely (very hard) and instead of relying on a user-installed browser extension (arguably odd UX), this is essentially a web3-enabled portal that can be used in any browser that supports iframes. This is also distinctly different from Mascara in that dapp authors don't explicitly set anything up on their dapp's back end; instead, the user visits a dapp through the MetaMask navigator, just like they would using a true dapp browser like Toshi.

I think this approach has significant advantages over an extension. I'm very interested in exploring this more.

[tmdoit-zz]

The only valid UX to access dapps is the same as for apps. People shouldn't change their behaviour because internet architecture changes. Browsers should support dapps natively. People don't bother about web 2, why they should bother with its third version?