The Developer’s Stack For Frictionless UX
Ever wonder how smart wallets, MPC, auth, etc., work together to enhance dapp UX?
Hello 0xPass community,
Ever wonder how smart wallets, MPC, auth, etc., work together to enhance dapp UX?
In this post, we'll explore their interactions and a stack that seamlessly integrates (0xPass, ZeroDev, and Alchemy).
Also, check out all of the new features we’ve launched with 0xPass here!
Account Abstraction - An Introduction
The Era of EOAs
Externally Owned Accounts (EOAs), such as Metamask and Ledger, have played a pivotal role in driving the growth of dapps. However, as we enter the next phase of web3 and aim to onboard the next billion users, it is becoming increasingly clear that EOAs, in their current state, have inherent limitations that may hinder mass adoption. Let's explore a few challenges for which we need better solutions:
Reliance on private keys:
If a user loses their private key, they lose access to their funds. This is especially problematic considering that mainstream users may not be as crypto-savvy. Therefore, we need a way to minimize dependence on a single key while still adhering to the principles of decentralization.
User-friendly transaction experiences:
To truly abstract away the blockchain, end-users should not have to know which blockchains they are transacting on or what native tokens they need. The existing clunky transaction approval processes need to be automated and streamlined while ensuring high levels of security.
Smart Wallets and Account Abstraction
By utilizing programmable smart contract wallets, the account abstraction standard ERC-4337 offers more frictionless user experiences. Programmable wallets provide features such as:
Account Recovery: Smart wallets can be made recoverable through multiple signers, reducing dependence on a single private key.
Gas Sponsorships: The cold start problem of users not having a chain’s native token can be solved by allowing developers or dapps to sponsor gas.
Session Keys: Transactions can be securely automated, enabling a "blockchain-abstracted" in-app experience.
The Developer's UX Stack - Part 1
Let's walk through the components and tools (0xPass, Alchemy, and ZeroDev) that work together to bring frictionless user experiences.
Step 1 - Choose a Smart Wallet
Select a smart wallet implementation that suits your use case. Some available implementations in the space include Safe, Kernel, Soul Wallet, Biconomy, and more. 0xPass's first smart wallet connection is built for ZeroDev's Kernel, which you can read more about here.
ERC-6900: The case of interoperability
Multiple smart wallet implementations such as Kernel allow for a plugin system that allows third-party developers to enhance the contract’s features. EIP-6900 by Alchemy accounts for this by providing a common interface between smart contract accounts and plugins allowing for interoperability. Kernel and Biconomy are moving towards compatibility with Soul Wallet exploring a similar direction as well.
Step 2 - Smart Wallets and Signers
Smart contract wallets are controlled by signers, which can cryptographically sign messages and transactions.
As shown below, different signing schemes and key management methods can be paired together to control smart wallets.
For simplicity, we can also have traditional EOAs control these smart wallets.
So, once you have chosen a smart wallet implementation for your users, you will need to connect it to a signer (in this example, an EOA) that can control it.
So for instance, let's consider a scenario where a new user has a Metamask wallet connected to a smart wallet. Whenever they attempt to make a transaction with the smart wallet, their Metamask account will prompt them for a signature.
Tools -
To address this, wallet adapters like RainbowKit or ConnectKit can be used to aggregate EOAs (Externally Owned Accounts). However, this approach only caters to users who already have a wallet!
Step 3 - Enabling Social Logins
It is likely that you also want to onboard users who do not already possess an EOA. This necessitates finding a way to convert social accounts into signers.
Tools -
Key management service providers such as Magic, Web3Auth, or other "Wallet-as-a-Service" providers can be of assistance in this regard.
Furthermore, depending on your implementation, you may need to merge wallet-based and social logins into a unified sign-in process.
Step 4 - Authentication and User Management
Modern dapps are becoming contextual. So if you’re creating any sort of user profiles, or building any contextual user experiences, you will need to authenticate the user using the “Sign In With Ethereum” standard and manage user profiles and sessions on your backend.
Tools -
To make this happen, you can leverage tools such as Next-Auth, Firebase, Clerky or others.
Simplify the Login Experience with 0xPass
Instead of paying for or gluing together 3+ tools to build your own wallet and login management system, you can use just 0xPass to simplify your wallet management and authentication infrastructure.
0xPass offers an advanced wallet adapter that enhances your "Connect Wallet" or login flow for your dapp.
0xPass serves almost as an upgraded version of RainbowKit, providing several benefits for your dapp:
Aggregate both web2 and web3 login methods
Seamless integration with embedded wallets or Key Management Service (KMS) providers
Management of user authentication and sessions.
For more information about 0xPass, you can refer to our documentation and explore the demo.
Connecting to the Kernel Smart Wallet (Made by ZeroDev)
With 0xPass's connector, you can establish the connection between the signers and ZeroDev's Kernel smart wallet using just a single line of code as shown here.
Alternatively, you can also use ZeroDev’s SDK to establish the same connection.
To learn more about ZeroDev and their offerings, you can explore their documentation here.
Kernel Connector Deep Dive: Alchemy AA SDK
The Kernel Connector provided by 0xPass is integrated into our "Account SDK," which in turn is built on top of Alchemy's open-source AA SDK. You can find the AA SDK on Alchemy's GitHub repository here.
0xPass's Account SDK provides two wrapper methods: 'smartConnector' and 'smartWallet.' These methods are compatible with any existing WAGMI connectors (including 0xPass’s wallet connectors).
They create a proxy that enhances the internal WAGMI connectors with smart wallet features, while preserving their core functionality.
This means that as a developer, you can seamlessly integrate these smart wallet connectors into your workflow without any changes.
To learn more about the smart wallet connectors, you can refer to our documentation here.
Why Alchemy's AA SDK?
We prioritized finding a highly composable system with the potential for future integrations of multiple paymasters and bundlers. Alchemy's AA SDK met these criteria, making it the ideal choice for our development. With its open-source nature, the Alchemy AA SDK encourages community contributions, ensuring constant evolution and improvement.
Why Kernel?
At 0xPass, we believe in building systems that evolve and improve over time. We chose to build a connector to ZeroDev's smart wallet, Kernel, because it aligns with this philosophy. Kernel supports plug-ins, empowering developers to personalize and expand their smart wallets according to their specific requirements.
The Developer's UX Stack - Part 2
While we have covered authentication and smart wallet systems, there is one final piece to the UX puzzle: bundler and paymaster infrastructure.
Smart contract accounts themselves cannot directly initiate transactions on chains that don’t have native account abstraction support. Instead, they send an object called a "user operation."
These user operations are monitored and packaged by bundlers, which have their own EOAs (Externally Owned Accounts), into a transaction that can be sent to the blockchain. Bundlers initiate and send these transactions, paying for the gas. They are later compensated either by the sender or a paymaster, which is a contract that allows for gas-sponsored transactions.
Companies like Alchemy, Stackup, Pimlico, and others serve as bundlers and paymasters for developers.
In the context of Account Abstraction, Alchemy provides crucial infrastructure components, including Bundlers and Paymasters, along with a readily deployable SDK. These tools greatly simplify the implementation process, enabling developers to quickly access account abstraction features.
By leveraging the combined strengths of 0xPass, ZeroDev, and Alchemy, the entire UX stack can be simplified, significantly easing the lives of developers.