Designing for Web3 

Product UI/UX

A large part of Web3 was made by nerds for nerds. But that’s a recipe for more bottlenecks if this new ‘internet we deserve’ is to become clear and accessible for everyone. For legal and regulatory systems, public-private partnerships, and users at large. 

This blog unpacks how design can bring the security, trust, and process that the decentralized digital environment Web3 promises. 

The potential

First off, blockchain is likely to influence every significant area of work at its rate of current adoption – some estimates found that blockchain could add $1.77 trillion to the international economy by 2030. Web3 gained currency in 2021 from crypto enthusiasts, large tech companies, and venture capital firms.

Because of its a-legal nature, legislators and regulators are still grappling with its immense possibilities. But where there’s money, there will be traction.

A quick run-down.

  • Web1 was characterized by static web pages, with the focus being on content written by a relatively small number of creators. 
  • Eventually, this developed into what we know today – Web2. Think search engines, social media, podcasts, blogs, cloud tools and storage systems controlled by distinct entities and companies. 
  • Web3, along with the idea of decentralization, incorporates blockchain technologies and token-based economics. For it to grow and be adopted as far and wide as Web2, the design must improve dramatically and be at least familiar with internet products that people know already.
IndieFolio Blog: Designing for Web 3
(source)

Principles of Design for Web3

While decentralized apps (dApps) and decentralized autonomous organizations (DAOs) like the above are exciting entry points into the blockchain, we all know the internet isn’t limited to just trading nerds, gaming with your homies on the couch, or buying art. And expanding Web3 to other sectors has so far proved difficult. A mainstream adoption, Web3 needs intuitive UI features and community-driven user experiences. For innovators, leading with value as opposed to technical know-how is going to be crucial to trust in the infrastructure. In other words, trust (is) the process. 

Design Principles for Web3

Fluency & familiarity

The cognitive load around blockchain tech is too overwhelming for the average user. With all the acronyms and jargon, it can be a confusing place. Glossaries can be embedded as link icons in the text, enabling users to absorb information with a hover. All relevant information should be available clearly. Instead of talking about the formula that goes into the blockchain to start explaining how the system works, stick to the actionable outcomes on the website or dApp. 

The onus falls upon designers and developers to overcome the learning curve. See Ethereum’s glossary. Start with mental models and trust models that anticipate behavioral quirks and known issues. Drizzle and MetaMask are already doing some of that. ‘A decentralized Spotify should look and feel like Spotify.’ See how Audius does it. In other words, don’t make yourself a bottleneck

Value 

Lawyer and co-founder of Flamingo DAO, Aaron Wright describes DAOs as “a subreddit with a bank account.” And transactions on the chain, though transparent and irreversible, have the power to empower users or topple their livelihoods. 

Suggest values for gas prices, the status of smart contracts, and step-by-step actionable routes so users know where they are and where they’re headed. For example, use button taps for non-financial interactions and swipes or slides for financial ones. 

Also, see how a DAO raised 3M in ETH for Ukrainian soldiers facing the Russian army. For designers, communicating these values with visuals and design elements can make or break the product, service, practice, and purpose.  

How-tos

FAQs around how each action influences the user’s life are a must. These how-tos can be open-sourced, peer-to-peer or community-led. True to the blockchain core. Discord communities, Twitter, and subreddits are great examples. Integrating AR and VR elements into design can help visualize product information. Artificial design intelligence (ADI) technology can use machine learning to make websites. Google has a whole collection dedicated to showing how a variety of experiences can work in VR and AR,  “opening up the possibilities of how we interact with the world and information around us.”

Deloitte, when discussing interoperability, states that “learning to manage data from sensors—whether from retail stores’ camera feeds, trackers on trucks, or infusion pump sensors in hospitals—helps prepare the business for handling the volume of data, and also helps them begin to benefit from the insights they can provide.” 

Web designers will need to then prioritize and optimize experiences based on what data would truly be useful to enhance the brand’s offering across a variety of platforms as well. 

Productivity

Web3 is like an infinite labyrinth that lacks the surveillance capitalism, security breaches, and tech monetization of Web2. A dOrg, for example, has no management, leadership, and traditional organizational hierarchy. Designing websites and dApps in such an environment calls for simple, clear communication and navigation. Diem makes it simple for users to make ordinary day-to-day payments like you would on any payment app. 

Speed

Web3 has the potential to do what traditional clunky systems have failed to do. Circle offers a financial system ‘at internet speed.’ While all Web3 tech emerges in the dark web, well-funded companies have the potential to offer faster and more resilient fintech systems. 

Before Web2, it was impossible to dream of WhatsApp. And yet here we are. 30 years later, email remains unencrypted when WhatsApp becomes end-to-end encrypted overnight. With AI-enabled contracts, content, and communication, the possibilities are limitless. For designers, this means constant upskilling, deep and wide understanding of products or platforms, and swift delivery of tech architecture. 

Transparency

Beltran in his blog on UX principles busts the myth of trustlessness and transparency. 

Everybody in this space, and their mother, talks about how the Blockchain is “trustless” and “transparent”…

If a technical [user], can’t recognize by looking at the UI if a dApp is actually a dApp or a normal web app, nor can she verify [the] contents she is seeing… then she isn’t granted the trustlessness and transparency that the Blockchain is supposed to deliver.

Source

In this case, designers are expected to anticipate problems and ‘launch forward’ cognizant of user experience. They should be able to know who will see their data, where is their activity stored, etc for Web3 to become a universal infrastructure.

Security 

All blockchain transactions are final, no returns. Most people are conditioned to expect that they will always be able to reset a password or reverse a bank payment. Designers will need to implement extra layers of verification with a reminder that sending assets to the wrong address will result in the complete loss of funds, accompanied by timely delivery notifications. We should put ourselves in the shoes of the user and ask ‘Is it safe for me to do this action’ and other double checks to prevent thefts or hacks. Transactions should specify status, the value in fiat currency, gas fees, and time to complete. Other questions around security revolve around both the tech and social aspects of all things internet.

Watch how Ethereum suffered from an absurd hack in 2016 

Uncensorability

While Web3 offers uncensorability, much like Twitter, polarizing narratives can be either net positives or net negatives to the fabric of society. Community Canvas has compiled useful frameworks and guides for more thoughtful, inclusive, fun, and structured communities that are actionable for both Web2 and Web 3. As innovators in the blockchain environment go find their community-market fit, design warrants unbiased research, actionable questions, and the joy of simple communities that transcends competing ideologies of the times. 

How VitaDAO is democratizing longevity through biotech research

Designer at Coinbase-backed startup Derek David recommends iterations in the: 

  • Application of mental models
  • UX writing
  • Accessibility and Usability
  • Simplicity in aesthetics and interface layouts

In 2006, Tim Berners-Lee described the semantic web as a component of Web3. Standing on the shoulders of giants, Web3 can make beautiful synergies between technology and human knowledge. What was once understandable by computers in terms of keywords and numbers can become more semantic and contextual. In order for information to become more specific, layered, and textured, it will need the expertise of designers to do the job. 

As AI/ML tools become more commonplace in healthcare, education, retail, virtual assistants, and information systems, the internet still doesn’t line up with the human experience on its own. Designers, as the guardians of the human experience,  need to craft routes that are both organic and digital, intentional and computed, for users to navigate.

Closing 

As a core idea in Web3, decentralization offers a pivotal moment in the development of the next major infrastructure layer of the internet. It offers alternative ways around tech giants like Google, Meta, Microsoft, and Facebook controlling user data, content, interactions, and transactions. Being agnostic of the user’s race, gender, nationality, income, or digital spends, the blockchain permanently and publicly records trades and interactions. No room for errors, biases, fraud, systemic risk, counterparty risks, or central clearinghouse. 

Most Web3 early adopters will be onboarded by dApps or DAOs. Be it in fundraising, gaming, digital collectibles, finance, wholesome livelihoods, research, building more meaningful communities, and fulfilling experiences. All offer equitable ownership, less censorship, and more transparency. Before the uptake of the tech, it’s fundamentally important for it to become a way of life for users. There’s no need to reinvent the wheel. UX designers already have a thing or two to learn from Web2. To listen, learn, ask questions, and trim down jargon. And make it possible to use Web3 without feeling its presence. 

Recommended Articles