UX/UI design for today’s blockchain platforms

Alternative Text
by Dmitry Elisov
Oqtacore CTO
982

Table of content

alt

The popularity of blockchain and Web3 is witnessing an exponential boom right now. Insider Intelligence has reported that the number of U.S. adults who own at least one cryptocurrency will surge to 33.7 million by the end of 2022, up 19% over last year. The report also shows that 3.6 million people will pay with crypto in the US, up 68.6% over the year 2021. According to  Blockchain.com, the number of crypto wallets increased from 44.71 million in 2020 to 80.26 million in 2022. 

Earlier we talked about what UX design is and why it is important for any digital product. Today, we’ll look at the specifics of UX and usability for Web3 digital platforms and blockchain-based apps.

OQTACORE will talk about why UX/UI design largely plays a crucial role for such digital products. We will also touch on the existing design principles and patterns for decentralized digital products.

Why can’t any blockchain project succeed without top-quality UX design?

For now, decentralization can’t replace the more traditional and popular technologies, for example, in the world of digital and internet banking. However, it is already penetrating deeply into the life of the average user. Very soon, blockchain-based platforms will become commonplace among users. 

OQTACORE have highlighted three reasons why UX is essential for decentralized digital products:

  1. New users would always want to trust a product. Blockchain offers a new financial system in the form of cryptocurrency, new art in the form of NFTs, and a new form of social interaction in the form of metaverse. However, people usually view new technology with skepticism. Here, financial products are the worst affected. So, the user needs to adapt to the new environment and ask themselves the question, “What if they scam me?” UX and UI design has a strong influence on user trust. A study by researchers from the University of Surrey has shown that users’ judgments on website credibility are 75% based on a website’s overall aesthetics. According to MyTechnology, 94% of users don’t trust outdated or poorly designed websites. Therefore, today’s blockchain app designers need to pay more attention to user experience and how users will interact with the product.
  2. Users care about comfort and ease of interaction. If a person wants to use some product on a daily basis to solve their tasks, that user expects that the product can be used without struggling to figure out what to do. Convenience and comfort, to put it differently, usability and user experience, are directly related to the speed of performing a user task and the frequency of using the product in general. For example, if a person wants to add a new token to their NFT collection, they expect that the NFT marketplace would allow them to buy a token in just a few clicks, without complex navigation, long search for the right buttons, and so on.
  3. New users prefer a distinctive product. Each of the categories of blockchain-based products always share a few basic features. For example, in most crypto wallets, you can manage and view your crypto assets, control your private keys, send and receive cryptocurrency, etc. However, these basic features do not make all crypto wallets the same. If that were the case, there wouldn’t be such diversity on the market. UX makes your product stand out from competitors. In the blockchain business, your UX design is often your unique selling proposition. That’s why you would see a crypto wallet with a well-functioning chatbot and a user-friendly menu, and another that clearly visualizes data and displays transaction information to the user in detail, but in a simple way. Therefore, from all the market offerings, the user will choose for themselves the wallet that suits them most.

So, we have figured out the reasons why high-quality UX is not just important but necessary for new blockchain-based apps. Now let’s move on to the design features. What’s different about UX and UI design for such apps?

Blockchain Design Principles

OQTACORE uses 3 principles of UX/UI design that allow you to design a quality user interface for blockchain-based projects:

Consistency

This is a universal principle of UX/UI design, but it has its own peculiarities for decentralized products. Consistency originally means repetition of elements in design, which allows the user to apply past experience to the current product. This is mainly done through common elements in UX – layout and positioning of menus, checkboxes, cards, radio buttons, and so on, as well as strict use of grid in layout, color, and typographic hierarchy in UI design. A designer uses available templates in the interface and lets the user know how to interact with the interface. Since the user has already seen common elements many times on other sites or in mobile apps, they will comfortably solve their tasks.

The peculiarity of consistency for blockchain-based apps is that the user does not yet have much experience with such apps. The user doesn’t have strong cues, so designers need to be careful in styling, especially when it comes to text and iconography. If you come up with a visual metaphor in your design (for example, an image of a completed transaction in a crypto wallet, when transferring currency using a cube depicting a block in a blockchain, with a green checkmark “done”), you should first check, through UX research methods, how well the user understands it.

Simplicity

Make your app as simple as possible. This will make the user experience easier because any decentralized digital product creates an almost endless stream of transaction data. This principle will also help the user more quickly understand how the product works. With that said, there are a few points to keep in mind when designing for blockchain, while keeping it simple.

Security and privacy

This relates to entering login credentials (be it a strong password or biometrics) even with 2FA. Moreover, every page, file and transaction should give the user a sense of security through the UI, while keeping the design and navigation as simple as possible. 

  • Data exposure. Blockchain projects 5-7 years ago were clearly unable to cope with content visualization; transaction data were the most affected. For instance, the user was shown long chains of cryptographic hashes. But these were unreadable and therefore useless to the user. Before showing some data to the user, you must decide whether it is actionable or necessary to build trust. If not, such data can be left out of the design.
  • Feedback. It is also a universal design principle. This involves providing the user with information about the status of a task – whether the command is being executed or not, and if so, what progress is being made. For decentralized products, this principle is particularly important, especially for any pages of their interface where transactions are done. This is because blockchain as a high-bandwidth platform is asynchronous, transactions can be delayed. And the UI response time is one of the most important components of user experience. According to UX researcher Neil Patel, even a one-second delay in page response time can immediately reduce your conversion rate by 7%. Therefore, you need to indicate to the user the response time via animation and feedback.

These are general principles of UX/UI design that are worth paying attention to when designing the user interface of any blockchain-based product. However, depending on the type of product, more specific UX/UI patterns can be highlighted. Let’s talk about them.

Examples of UX/UI design solutions for different types of blockchain projects

Based on the principles discussed above, the OQTACORE team presents the following examples of UX/UI solutions:

For crypto wallet:

  • Making the wallet address simple to handle. Each wallet has its own transaction address. It is a specially generated set of numbers and letters that is hard to remember and can be misspelled. Modern crypto wallets should always find the easiest way to store this address, look it up and send it. For example, the user could copy the address directly from the main menu page. Just don’t forget to additionally remind the user about this using a visual cue.
    Copying account wallet
  • Security patterns. The user must confirm the account and access to the wallet. You could make them enter a phrase, a numeric code or any other password generated by the wallet itself. The user should not be able to copy and paste the code in the input field. 

Selecting each phrase to confirm your own sect phrase

For DeFi platforms:

  • User error messages. There are not many DeFi users yet, people are still learning how to use these platforms and will naturally make mistakes. You should warn or notify them when connection to the wallet in the DeFi platform fails, when there are not enough tokens in the account, when the wrong address is entered, etc. It is important to tell them why the error occurred; just a warning will not help the user. 

The wallet window is already open text

  • Learning. DeFi uses a lot of new blockchain terms. A user, especially a beginner, won’t always understand what staking or farming is. The easiest way to educate the user through the interface is to give them a visual cue. For example, you can show them the definition of a new term when they hover over a word or tap on it. 

For decentralized exchange:

  • Swap. The main function of DEX is swap. DEX always has a separate page with a swap window for transactions. There should be available information about what cryptocurrency you can choose, a window where you can enter the amount for exchange, the exchange rate, your wallet balance, and the exchange balance. At the same time, it is worth experimenting with the layout of this information and windows – via UX testing – to find out which option would be most convenient for the user. 

Swap ETH to USD window

For an NFT marketplace

  • View your collection. It may seem strange, but not all marketplaces allow users to view their purchased NFTs right inside the site or app. OpenSea, which is a hub for Ethereum-based NFTs, is more of an exception to this rule. And in order to view your tokens, for example, on the Binance Smart Chain network, you’ll have to use third-party personal analytics platforms. So, inside your NFT marketplace, you should also design a separate menu for overview. 

Given that blockchain technology is just evolving, all the design features for such projects have not yet been implemented. It’s important not only to follow the design principles that are emerging right now, but also to experiment on designs on your own. This combination will bring more customers to your platform. 

OQTACORE uses cutting-edge tech trends in the creation of its products. We also keep an eye on all UX/UI design features for decentralized platforms.

FAQ
Why can’t any blockchain project succeed without top-quality UX design?
  • New users would always want to trust a product. 
  • Users care about comfort and ease of interaction.
  • New users prefer a distinctive product.
What are Blockchain Design Principles?
  • Consistency
  • Simplicity
  • Security and privacy
3 Main Use Cases for Web3
  • Decentralized Autonomous Organizations (DAOs)
  • Web3 Gaming (GameFi) & Metaverse
  • Decentralized Finance (DeFi)
Rate this article
Please wait...