Axon Staking Platform
Axon is a layer2-based platform that provides users a secure, fast, and reliable way to stake, delegate and earn rewards. The platform divides users into two categories: validators and delegators. Validators are responsible for staking and validating transactions, while delegators provide the funds to secure the network.
PROJECT
Axon Staking and Election Platform
SUMMERY
I am creating a new app to help people find a good place for their dogs and use it to make friends. I need to determine if the primary user experience, finding and taking part in the PETUP activities, is easy for users to complete. We’d also like to understand the specific challenges that users might face in searching, chatting, and joining processes.
UI UX Design
Web 3 project design
Application Design
THE PRODUCT
This product describes the validator selection procedure in Axon, which is critical for ensuring the security and stability of the network. Validators are in charge of participating in the consensus process. In essence, anyone can join the validator selection process by either staking their AT tokens in the stake type script or delegating their tokens to another participant via the delegate type script, who acts as a validator candidate with the delegated tokens. Afterward, a metadata-type script selects the stakers with the highest stakes to become future validators. We have also designed the corresponding incentive mechanism, encoded in the checkpoint-type script, to encourage the participants to act honestly.
​
DURATIONS
2023, April~ 2024, June ( 2 Months)
T​HE CHALLENGE
This project has almost no references, and only documentation files are given to me. I must find the product logic and draw the corresponding prototype diagram. There are considerable challenges in product design from zero to one.
STEP 1
The first thing I got was the document file, my first step was to turn them into a wireframe.
What I got from the backend engineer
I used Balsamiq to prototype the first edition
My primary reference site is : https://stake.lido.fi/
STEP 2
I started doing wireframes on Figma, I expanded them to 10 pages and started talking to the team about the accuracy of my graphs.
The first problem we found was expressing the option of allowing users to input the token amount. If the user is only allowed to input, the initial users may be confused and not know how much to input, so I gave slider and segmented control two options and gave some comparison schemes.
Option 1
Option 2
To facilitate the judgment of the team members, I made a table that can be compared, and finally, we chose to use the UI form of segmented control to express it.
STEP 3
Next, I entered the step to check user flow, and the number of pages increased from 11 to 21. (The interface design comes from the theme of the official website, which I also design.https://axonweb3.io/)
At this step, I started to build the design system simultaneously, specifying the font color and some components that will not change.
At this time, I found a huge problem. After I understood each requirement, I designed tables for the needs separately, but each table differed. In subsequent discussions with back-end programmers, how to gradually classify tables into one category has become a challenge.
STEP 4
Next, I designed HI-fidelity. I subdivided the behavior according to each action and then conducted round after round of discussions.
After several rounds of combing, we found that the concept of stake in our product is different from that of other chains (anyone can be a staker), which may cause some confusion for users, so to better cultivate user habits, we decided to divide the entrance into two types of people, delegator and validator.
THE FINAL DESIGN
Take away
This project let me understand that not every web3 product can be researched, and not everyone will give you the time to do a usability test. As an MVP product, it is far more important to go online first than to polish it mindlessly before reaching out to users.
What's Next
Build Axon brand pages
Do usability test after launch
Find real pain point after launch