Web3Pay, an embedded web browser multi-chain wallet, powered by Account Abstraction. It aims to enhance Web3Auth’s product attractiveness and drives greater user conversions to premium subscription tiers by providing a seamless transaction experience.
During this project, I was the designer who collaborates with another designer, the product engineers and key stakeholders, manages the project timeline, ensures consistent design language with the other existing products as well as agrees on the product strategy.
We conducted 3 intense designs sprints in 1.5-2 months, include further iterations to add more features.
Keeping mobile-first for design
I joined the product team and key stakeholders to narrow down the product direction of the project. Due to timeline constraints, I suggested to the product team that we should stick to mobile-first as the scope is pretty large, also this makes easier for prototype to be tested going forward as well.
Ideation with market research
With the rising use of Account Abstraction, I cross-referenced existing wallets in the market that have implemented similar concept , and the common design language which users are already familiar with multi-blockchains networks. Then I did an initial set of Mid-fi screens to stakeholders to give an idea of how the flows will be like. We had a timeline of 1 sprint to work together to get the key basic flows of onboarding, wallet transaction and settings screens up for a first iteration.
Incorporate existing design system to new designs
Due to the tight timeline, I also made the decision to use existing components from design system without having to create new ones. This would save time for developers to implement new components from scratch, also reducing effort to update design system going forward. If there are new ones, they are likely to be multiple blockchains related e.g. token-chain icons, graphics as below to convey the message.
Freedom of choice to users
Besides allowing users to change payment accounts and gas tokens freely without switching chains, I too want to give them the freedom to filter the chains they are on to reduce content saturation with less information. This helps users to focus on information they need, making overall experience more positive.
Ensuring accessibility of design
Nonetheless, I also designed for both light and dark mode to match to users' preferences, improve accessibility, reduce possible eye strains - giving users the control over their wallet experience. This ensure users’ experience are not compromised despite the short timeline.
📮 Every task is a learning point
Every design task is a learning in-progress as it is practice case to be better at what we do as a designer. Take every chance to learn from other designers’ work while putting in our best to deliver high quality product to end users.
📦 Not shipping a product does not mean that it is bad
It maybe heartbreaking to see that product is not shipped but not all great ideas get to be shipped in businesses. This project was ultimately discontinued due to business direction changes, despite of completing 90% of the implementation work.
👩🏻🏫 Being a UX generalist
Besides involved in creating screens, I also had to take out time to create marketing materials such as gif as part of campaign preparation. Collaborating with Marketing team allows me a better understanding of the product growth direction from their point of view.
