One of the core values, and value proposals, of web3 is to take control out of siloed, centralized service providers, and give that control to the individual users. MetaMask is the tool that developers use to expose that functionality to users, and the interface through which users manage those privileges. In this way, MetaMask should be thought of as a decentralized identity manager for the next version of the web.
MetaMask is a big area, as it touches concerns from both the developer and the end user's perspective. The following articles are broken up into discrete topics; first, let's take a look at some high-level developer's concerns.
Platform Considerations: Mobile-first or Desktop?
While this is a standard discussion when building any web app, there are some additional nuances when building against MetaMask’s design. In the desktop environment, users will be using the MetaMask Extension (repo), which is inaccessible on mobile browsers:
Mobile users will need to use the MetaMask Mobile app (repo), in either its iOS or Android variant:
There are differences, at the feature level, between Extension and Mobile, due to differences in their original codebases. There are also differences at the technical level which translate into UX; for example, detecting and connecting to the user’s MetaMask.
On mobile, you’ll need to provide a deeplink between your dapp and MetaMask. There are a few ways you can address this:
- There’s a whole section in the docs on deeplinking, and MetaMask has even generated a deeplink creation tool that makes the process a breeze.
- You can import the MetaMask SDK (more below) into your dapp, which will take care of the connections between your dapp on both Extension and Mobile.
If you architected your dapp for the desktop environment first, or maybe even built a POC, and are wondering how much work is involved in getting it mobile-compatible, start with the Site Compatibility Checklist and go from there. In fact, even if you are designing mobile-first, that checklist is a good set of design parameters to build against.
One additional question you can ask yourself at this point is: are you going to build a web-based dapp, or a mobile app?
Bottom Line: No matter the environment, the MetaMask SDK will make the connection work
As web3 use cases have developed and expanded, the possibilities, and complexities, have as well. The MetaMask SDK was built to make connecting to MetaMask easy, regardless of whether you’re in a mobile app environment, a gaming environment using Unity or Unreal, React Native, nodejs, Electron, or a traditional web app environment.
The SDK is backwards-compatible, in the sense that it returns the same provider as those dapps that are built to access window.ethereum (more on this in the following article). In other words, importing the SDK into your dapp is a straightforward way to enable access to MetaMask seamlessly, regardless of whether you’re building an app for the first time or making the jump to Mobile compatibility. For details on the many contexts that the SDK enables connection to MetaMask, check out the docs here.
An alternate architecture: MetaMask Snaps
Before we jump to discussing MetaMask from the user's perspective, let's take a moment to explore the next iteration in MetaMask's developer toolkit. As web3 has grown and diversified, the use cases for wallets, and wallet experiences, have grown and diversified as well. Rather than trying to keep up and build a solution for everyone--impossible--or choose which projects MetaMask's team thought the most worthy--deeply antithetical to their ethos--MetaMask restructured the way it handles users' private information, in order to expose an API that allows developers to build custom functionality into the wallet.
This allows for all kinds of things, starting with being able to use MetaMask on non-EVM compatible blockchains, and the ability to program custom UI into the wallet, permissionlessly.
If this sounds like what you're looking for, jump to our article on it here.