top of page

Bolt Blockchain Explorer

Overview

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

Purpose

This wireframe is for the design of a data explorer website, which serves as a proof of concept UI that aims at demonstrating the merits of Boltchain, a blockchain technique developed by TideiSun, my former company.

​

Background

Different from centralized non-blockchain e-payment systems, transaction through blockchain is decentralized and thus can be assured that the transaction data will not be hacked and changed. However, the transaction speed on the blockchain is rather slow. Nonetheless, the technique of Boltchain enables a system to scale blockchain transaction capacity and speed while retaining the decentralization benefits of a distributed protocol.

​

Boltchain is a Layer 2 protocol method. Boltchain protocol allows a system to periodically produce a hash value of a bunch of off-chain transactions as the evidence of these transactions and record the hash value on highly secure public chains such as Ethereum and Bitcoin.

Screen Shot 2020-12-09 at 11.00.12 AM.pn

My Role

I independently performed information architecture research and wireframe design. 

Contribution

For the demo, the explorer has been employed in

  • our interval office snack bar e-payment service

  • the Fintech Exposition in Taipei

​

For service,

  • In 4 months, 2 clients bought the protocol and used Bolt explorer in their own system.

Design Process

Protocol Understanding

Content Analysis

Understand the main features of Boltchain and the details of the protocol via multiple channels including the official technical white paper, the Github readme and codes, and discussions with our R&D team.


Findings are as follows. Boltchain protocol contains two parts. One is the basic structure of off-chain on-chain transaction process. The other is the unique secure mechanism to protect the system, includes the system’s currency reserves for users’ instant withdraw and auditor mechanism that allows the government or third parties to audit the accuracy of transactions.
 

​

​

Usability

Preliminary User Interview

Due to the time and resource constraint and I interviewed 5 colleagues across various departments that have different levels of blockchain savvy to access their understanding of layer 2 protocol and Boltchain.

​

Insight: An UI similar to the public chain data explorer.

Interviews reveal that the most difficult part for users to understand our mechanism is the complexity of blockchain itself. However, it’s inevitable that users need to understand how the public chain works to trust our system. To elaborate, Boltchain, or any layer 2 method, requires users to get familiar with both UI presenting off-chain transactions and another UI presenting transactions on the public chain, which are the recorded hash values of a set of off-chain transactions. Therefore, I decided to design a UI similar to the public chain data explorers to reduce the barriers to entry of the whole 2-layer system.

​

Besides the complexity of blockchain, users also care about:

1. Has the transactions been recorded?

2. Is the system stable and secure?

​

​

​

Public Chain Explorer Analysis

I analyzed the layout of several popular public chain explorers to understand their current practices.


Result: The main page of a public chain explorer usually contains a search bar on the top, followed by a conspicuous dashboard to indicate the important information regarding security and aggregate transactions, and real-time transaction dynamics on the bottom of the main page. Other commonly important pages include the address(account) page and the transaction details page. Moreover, the tips beside blockchain terms are also crucial.

​

​

​

​

​

​

​

​

​

​

​

​

​

​

 

​

​

​

User Testing and Iterative Design

Conducted cognitive walkthrough to understand which design is the clearest and usable one and improved the design according to user feedback.

 

 

 

​

​

​

​

​

​

​

​

​

​

​

​

 

​

​

​

Engineering Feasibility

I discussed with front-end and back-end engineers to access the feasibility of the design, including front-end web and back-end API implementation complexity and changed the design accordingly.

​

explorer analysis.JPG

Bolt Explorer

The Bolt explorer mainly comprises (1) the main page, (2) the account page, (3) the stage page, and (4) the Light-transaction(Off-chain transaction) page.

​

​

​

​

​

​

​

​

​

​

​

​

​

 

 

 

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

How do users get familiar with Bolt Explorer easier?

The structure of the main page is similar to public chain data explorers such as the arrangement of the elements (search bar, dashboard, and transaction dynamics). The information architecture is also similar to the public chain explorers.

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

How do users know that transaction in Boltchain is fast?

After conducting a transaction, our sales can show the transaction at the main page, there is no need to go to another page to see it nor any delay.

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

​

How do users know that the on-chain process is working?

A stage is an event when a hash value of a bunch of off-chain transactions been produced and recorded on-chain. 

​

There is a progress bar that indicates the progress of recording the hash value on-chain. When the hash value is on-chain, a unique link would be provided for users the confirm the status on the public chain.

 

 

 

 

 

 

 

 

 

 

 

 

​

How does User know that the system is secure?

The dashboard shows the currency reserves and withdraws times to show that users are able to truly withdraw money from the system. 

 

An authorized third-party auditor can also increase users' trust.

 

 

 

 

 

 

 

 

 

 

 

​

Screen Shot 2020-12-09 at 4.41.23 PM.png
Screen Shot 2020-12-09 at 5.02.39 PM.png
Screen Shot 2020-12-09 at 5.37.41 PM.png
Screen Shot 2020-12-09 at 5.52.21 PM.png
Screen Shot 2020-12-10 at 7.02.43 PM cop
35629117_1923368841015794_19755266866151
Screen Shot 2020-12-10 at 7.21.08 PM.png
Screen Shot 2020-12-10 at 7.20.41 PM.png
Screen Shot 2020-12-10 at 7.19.34 PM.png
Screen Shot 2020-12-10 at 7.02.43 PM.png
bottom of page