Contest Proposal: Free TON DEX Front-end Interface Design
Description
It is proposed to design a Free TON Decentralized Exchange Front-End interface based on the best practices in the DeFi market. At least some of the submissions to the “FreeTon DEX Implementation Stage 1 Contest” will certainly be based on the widely used Automated Market Maker exchanges like Uniswap, therefore creating a design prototype to complement the DEX contest can be very useful and simple to accomplish. This type of exchanges usually doesn’t have any complex elements, order list, deposit/withdrawal sections, current market trades sections etc. Their design usually consists of several simplistic sections like “Swap”, “Liquidity Pools”, “Governance” and “Charts”. The amount of buttons and menus is minimal to create the most straightforward user experience.
Type
Contest
Contest entry period
Submission period: February 22, 2021 00:01 UTC - March 04 , 2021 at 23:59 UTC
Motivation
Free TON ecosystem is in need of easy-to-use and accessible front-end web interfaces, including one for the upcoming Free TON Decentralized Exchanges. While Free TON heavily relies on DeBots for user interaction with on-chain services, it is crucial to provide a nice and familiar interface for new and experienced users alike.
General requirements
Functional elements of the basic AMM-style Decentralized Exchange include the following:
- Token Swap Interface
- Liquidity Provider interface
- DEX Governance interface
Additional pages that provide insight into the analytics of DEX pairs or voting are optional for this stage.
Token Swap interface
A basic token swap interface allows the user to choose cryptocurrency to swap with a simple selector from the list of available currencies as well as define the amount of coins to swap and a “Swap” button.
A regular user story for Token Swap interface:
- User chooses both cryptocurrencies with selectors
- User sets the amount to swap and presses “Swap” button
- Information summary about the requested exchange operation is shown to provide more details about the exchange amount, exchange rate and fees along with a confirmation dialog
- After the confirmation the DEX logic is requesting the user to sign a transaction using his wallet
- After the transaction is complete the user gets a notification with a summary of the operation
Liquidity provider interface
A basic Liquidity Provider interface allows a liquidity provider to transfer his cryptocurrency to a liquidity pool in a DEX smart contract and receive liquidity provider fee as a reward. A user can either create a new pair to become its first liquidity provider or add liquidity into an existing pair.
A standard user story for Liquidity Provider interface:
- User chooses to create a new pair or supply tokens to the existing pair
- User chooses 2 tokens for a new or existing pair
- User sets the amount of both tokens to supply to a liquidity pool for the token pair and presses “Supply” button
- Information summary about the supply operation is shown to provide more details about the deposit amount, rates and future share of liquidity pool along with a confirmation dialog
- After the confirmation the DEX logic is requesting the user to sign a transaction using his wallet
- After the transaction is complete the user gets a notification with a summary of the operation
DEX Governance interface
A basic Governance/Voting interface allows users to submit proposals for protocol or DEX interface improvement and vote on proposals submitted by other users. There is a simple proposal creation interface along with a list of existing proposals to choose from.
A standard user story for proposal creation:
- A user chooses to create their own proposal.
- Using proposal editing interface, the user specifies the title, description, attached files and stake for a new proposal and submits it to the governance module.
- After the submission the DEX logic is requesting the user to sign a transaction using his wallet.
- After the transaction is complete the user gets a notification with a summary of the operation
A standard user story for voting on existing proposal:
- A user chooses an existing proposal to evaluate and vote on from the list of active votings.
- After choosing the option to vote for a summary is displayed to indicate the effect of the user’s vote on a proposal.
- After the confirmation the DEX logic is requesting the user to sign a transaction using his wallet.
- After the transaction is complete the user gets a notification with a summary of the operation
Artifacts
- A .pdf document with a sample of proposed interface design along with a link to a layered design layout in Figma available for public review, name and contact information of the contestant for communication (Telegram username, e-mail)
- A description document in .pdf format in case there is a need for additional info on the user interface
Evaluation criteria for jury:
- Sufficiently address all the functional tasks identified above;
- Design styles should be inline with Free TON guidelines or at least familiar to crypto community;
- Implementability in reasonable time, e.g. scope of work for first versions
- Unique design, no templates or stock solutions, a submission should not include more than 10% of other contestants’ works;
Voting
- Each of the Free TON Web&Design Subgovernance jurors can vote on a submission. Jurors whose team(s) intend to participate in this contest by providing submissions must abstain from voting in this contest.
- Each juror will vote by rating each submission on a scale of 0 to 10 or can choose to reject it if it does not meet requirements, or they can choose to abstain from voting if they feel unqualified to judge.
- Jurors will provide feedback on each submission they vote/reject for.
Rewards
- 1st place…5,000 TONs
- 2nd place…3,000 TONs
- 3rd place…2,000 TONs
References
- Uniswap decentralized exchange (https://uniswap.exchange/)
- 1inch decentralized exchange (https://1inch.exchange)
- Sushiswap (https://app.sushiswap.fi)
Visual references for DEX interface elements
Token swap interface
Token selector interface
Governance interface
Analytics interface