WEB3 + Product Design: Introduction
While there is a long way to go until Web3 is fully adopted, products that use blockchain technology currently exist. They also demonstrate the potential of the technologies that underlie them.
The market for Web3 blockchains is now worth $2.9 billion. Also, by 2028, its size is projected to increase by 41.6% to $23.3 billion.
Today, we’d want to address the following questions and share what we’ve discovered about Web3 UI/UX design thus far:
- How does Web3 vary from Web2 and Web1? What is Web3?
- What are the main obstacles to the adoption of Web3?
- Why does UI/UX design matter for Web3 products?
- What is Web 3 design, and what are its best practices?
1. WEB1 vs WEB2 vs WEB3?
No one requested a history lesson, but one is provided anyway due to the basic distinctions between how people utilized the internet during each internet development (and therefore how to design for users was done). Knowing how something develops and the distinctive qualities of each stage help us understand the design issues that were there at the time. Consider the 1886 launch of the first vehicle and today’s self-driving Teslas. Because of the contextual variations, the design choices for the two would have been very different. This also holds true for the internet.
WEB1: Users were considered passive consumers of content in Web 1.0. Pages were “made” in a static environment, and there weren’t many makers (developers).
WEB2: More user involvement, interactivity, and personalization define it. Users weren’t just passive consumers anymore; they were also producing, sharing, and posting in a constantly changing environment. Take into account apps, podcasts, social media, blogging, tweeting, etc.
The success of a small number of software businesses (think Twitter, Facebook, Instagram) with highly user-friendly platforms allowed us to surf the internet so easily. Design came to have a different meaning when more people joined the internet and started utilizing it for everything. Businesses were concerned with more than simply appearance; they were also concerned with the whole “experience” a user had when using their platform and services.
WEB3: It intends to address many of these monopolistic issues, putting a strong emphasis on decentralization. Several blockchain-based applications (sometimes referred to as “dApps”) inherit the qualities that blockchain symbolizes, including openness, security, equitable distribution, community-drivenness, and self-governance. Without going into too much detail, it basically implies that power will be divided among us, the plebeians, the everyday people who don’t have unlimited funds, rather than being concentrated in the hands of the overlords (investors and CEOs). You’ve obviously noticed that this is a completely different approach from web 2.0; we’re switching from privately owned to publicly owned online platforms.
2. What are the main obstacles to the adoption of Web3?
Due to the two main challenges, the adoption of Web3 could not go as smoothly as some anticipate.
2.1 The process of onboarding might be overly complicated: It may be very stressful for a new user to launch a Web3 application, such a crypto trading platform, for the first time.
“What in the world is a wallet?” or “What in the world is gas fees?” they could utter. while determining how various chains function and how exchange rates are set. Not to mention hidden fees and difficult-to-remember wallet addresses!
2.2 Bitcoin and blockchain not very popular in the mainstream: Blockchain initiatives often only receive attention from the general public when they are scams or fail. For instance, the recent collapse and bankruptcy of FTX received extensive media attention. Bitcoin crashes and hacks like The DAO one frequently makes it into the media.
Thus it seems sensible that for others, the word “blockchain” conjures up images of scams. Others could be aware of the technology’s potential but remain wary due to its past performance.
3. Why does UI/UX design matter for Web3 products?
Before we analyze Web3 design trends, let’s take a time to consider the advantages of a well-planned UI/UX.
3.1 It aids in cultivating loyalty and trust: Because your product uses a blockchain, users could be wary of it, especially if it involves money. Your job is to reassure customers that their money and personal information are secure. The most effective method to achieve that is through your UI/UX design.
3.2 It’s the Secret to bringing in fresh blockchain Users: Blockchain technology is no longer only for programmers and techies. There is one “but,” though: only if you make your product simple to use and intuitive will new users come to you. Few people would want to study online blockchain dictionaries for hours only to utilize your product.
3.3 Your product becomes unique due to It: UI/UX design was frequently an afterthought in Web3 goods because tech-savvy people have long been their target market. Modern and user-friendly UI/UX is therefore less common than you may expect. The UI/UX may provide your product a competitive edge when done properly.
4. What is Web 3 design, and what are its best practices?
In terms of the acceptance and use of web3, design is crucial. The majority of consumers will be introduced to blockchain technology through dApps, therefore the way that people navigate this technological environment may be severely hampered or aided by design.
Depending on the dApp type, design considerations will differ somewhat from those for typical web 2.0 apps (e.g. finance vs gaming vs arts and collectibles). But, given the nature and level of blockchain adoption, there are a few fundamental design concepts to take into account, which I discuss in more detail below: encouraging trust and irreversibility while teaching via design.
4.1 Enable blockchain literacy:
Web3’s status makes one thing quite clear: individuals won’t typically have the mental models and methods of thinking that it will demand (yet). It is the responsibility of designers to assist users in navigating the blockchain learning curve as they become more aware of the technology and its possibilities. Just as it is our responsibility to convey the value of SaaS goods or services in an understandable way, we will also need to channel our product design expertise from web 2.0 into web 3 so that the general public can quickly comprehend basic concepts related to security, trust, and procedure.
As designers, helping educate can be done by:
- To assist users to fill up the knowledge gap, connecting them back to what they already know is important: A fantastic example is the MetaMask film, which employs simple language like “The internet isn’t particularly safe, credit cards get stolen, identities get hacked… By promoting the benefits of being censorship-free, Ethereum makes a wonderful metaphor by citing Twitter, a medium that consumers are already familiar with. What is MetaMask?
- Limiting the use of technical language: When it comes to blockchain, a whole new vocabulary has emerged. Websites that make languages easier to understand for the common individual will be miles ahead. Particularly when I think about de-fi (also known as decentralized finance) dApps, concepts like “liquidity pools,” “mining,” “tokens,” “protocols,” and “smart contracts” come to mind. In fact, if you’re not familiar with blockchain technology, you might as well be reading hieroglyphics. It is more difficult for people to appreciate the benefits of your dApp when you utilize technical terms. Glossaries and help icons should be used to assist the user comprehend and refer back to information when language cannot be obscured.
Actionable paths are essential for directing people who are unfamiliar with the area to the next steps. These are referred to as “common” and “generally favored” routes by Peter Ramsey. After watching a Netflix episode, for instance, one of the actionable options they present is to watch the subsequent episode, while another option is to watch another series. An example of this being poorly done is in POAP, a dApp that lets you bookmark life experiences as digital keepsakes. On the front page, there aren’t any clickable links that direct users to starting points, though.
4.2 Generate Trust: Be Open About the App’s Internal Workings:
The secret to conveying dependability, stability, and trustworthiness is transparency. The foundation for building trust consists of these three terms. As a result, you’ll need to strike a delicate balance between transparency and making blockchain simple to grasp. Here is what it may actually imply:
- Before the user completes a transaction, break out all fees, including petrol fees.
- Display each transaction’s status along with an expected wait time.
- Add security safeguards, such as preventing copy-pasting in specific fields.
- Describe hidden security measures like the encryption process.
4.3 No Retreating
Blockchain’s immutability and self-governing features are very important. As the dApp is decentralized, some stages during user tasks need to be spelled out if they are irreversible or beyond its control. This includes transactions and sign-ins. Benefits of this include:
- Supporting education by repeatedly emphasizing irreversibility;
- Generally being ethical, especially in situations where livelihoods can be instantly impacted or changed by accidental taps and swipes (on that note, user interactions and gestures that are less prone to errors, e.g. swiping/sliding instead of tapping for a transaction to go through).
Conclusion
There is still plenty to be talked about regarding user experience concerns for the blockchain itself that are more backend driven, such as security and speed issues to mention a few. Although a poor user experience may easily be a deterrent for many joining the area, numerous creative businesses are now working to remedy problems.
With web 3.0, it’s much more crucial for designers to comprehend the workings of a blockchain, just as it was extremely helpful in web 2.0 to grasp the issues and constraints our engineers confront while creating the backend and frontend. By doing this, we are better able to understand and communicate with developers, avoiding the need to rely on them to inform us of what is feasible so that we can build our designs on it. Understanding the stakeholders around us and being able to communicate effectively with them ensures that design is not an afterthought. Communication is half the fight in design.
And where is everything going right now? The year 2022 was a rollercoaster for WEB3.0, and this piece, in my opinion, just touches the surface of all that happened. Whether this is a phase or not, the potential of blockchain is making us reevaluate established practices, and that, in my opinion, is always a positive thing.
Thank You so much for reading 😊!
If you want to hear more from me (and why wouldn’t you?) follow me on Twitter and Instagram
