PRODUCT UPDATES
Trading Terminal Major Upgrade
Introducing 23 UI/UX updates in order to give our traders the best trading experience
We are excited to introduce a major UI/UX upgrade aimed at providing our traders with the best trading experience possible. Over the past few weeks, our product team has been diligently working on a brand-new trading interface designed to enhance crypto bond trading on Secured Finance.
Our new terminal is also optimized for mobile, maximizing space efficiency. Key features will be nested under buttons near the header for easy access on smaller screens.
For easy reference, we’ve created comparison boards to highlight the improvements from the original UI/UX to the upgraded version.
UX Problems and Solutions:
To address common UX problems, we’ve implemented the following solutions:
UX Problem 1: Lack of CTA for user to deposit funds or know what to do when they first log in
Solution 1.1: Implement deposit button
Solution 1.2: Alert to welcome message and prescribe an action
Solution 1.3: CTA button shows Enable Trading button rather than disabled state
These solutions provide users with more than one avenue of understanding what to do when they first start using the Secured Finance app.
UX Problem 2: Complicated navigation to search for different product types
Solution 2.1: Design dropdown menu to combine both assets and maturities
Solution 2.2: Integrate favourites into the dropdown menu and main trading interface
Solution 2.3: Different categories to sort particular data columns
(This solution is also to prepare for our future structured products segment)
These solutions help to improve navigation by way of search, sort and listing assets in a simpler and clearer way. Instead of first choosing the asset then the maturity, now users can simply click on the contract itself based on the categories. It also helps when we release synthetic ETFs later.
UX Problem 3: Trading terminal is not compact and the important trading info is not accessible without scrolling
Solution 3.1: Added a countdown timer to see when the contract expires or rolls over
Solution 3.2: Everything fitted to 1440 x 1024 px for desktop for easier navigation
Solution 3.3: Breakpoints for widescreen and tablet are designed for tighter control over design
Solution 3.4: Switch positions of order panel, charts and order book to stay up to date with latest mental models
By introducing these solutions, we hope to reduce the time taken for the user to navigate our trading terminal and make faster trading decisions.
We also want to ensure that our users have the best trading experience no matter which device they are on.
UX Problem 4: Lack of liveliness to show product is live and users are using it
Solution 4.1: Order book’s rows blink when updated
Solution 4.2: Order book shows price spread and percentage change
Solution 4.3: Trades tab next to order book to promote transparency
Solution 4.4: Upon hover over a particular price row, a tab opens up to show the user additional information about the orders (average price, average APR, total value of orders (in native currency and USD)
Solution 4.5: Status bar on the footer of the page
These solutions further highlight the fact that our order book is fully on-chain and transparent, allowing us to be a fair and transparent trading platform for all traders.
UX Problem 5: Order panel does not give users enough trading information to execute a trade
Solution 5.1: Add current position and available currency to trade
Solution 5.2: Place price and quantity inputs in adjacent order
Solution 5.3: Mid price input button within input field
Solution 5.4: Size input can be switched between native currency and USD
Solution 5.5: Slider bar also has an input field to key in percentage value
Solution 5.6: Future value price estimation
Solution 5.7: Margin calculation and fees before confirmation
These solutions aim to make the trade execution process easier to understand for users who are unfamiliar with bond trading. Crypto bond trading is a relatively new concept and many users are still figuring out how to use fixed income instruments to earn yield.
Bonds are one way of mitigating principal risk while earning a healthy yield on your crypto assets. With these changes, users would be able to place orders more easily as they would understand the relevant trade information prior to executing a trade.
UX Problem 6: The web application is not optimized for a mobile browser
Solution 6: Add breakpoints for mobile and mobile-specific navigations
Our focus is to ensure all necessary information is visible without scrolling. Information flows logically from left to right, facilitating informed trading decisions.
Enhanced navigation through a dropdown menu helps users easily differentiate between product types. The favorites function allows traders to quickly access their preferred pairs, making bond trading almost second nature.
We aim to prevent information overload for new users. Key features are nested under buttons near the info bar, ensuring the most important elements — like the order book and order panel — are front and center. Users can customize their view, such as turning off the order book if they prefer.
These updates significantly enhance the trustworthiness, responsiveness, and ease of use of our product.
New Feature: Historical Yield Curve and Yield Spread Analysis Tool
We’re excited to introduce our new historical curve comparison feature.
This tool allows traders to identify trading opportunities and apply advanced bond trading strategies such as carry and rolldown, mean reversion, butterfly spread, and more.
Gain fresh insights into the interest rate market and the term structure of the yield curve with this powerful addition.
Conclusions
This UI/UX upgrade provides a central-exchange-grade trading experience for bonds, allowing users to navigate our product easily and trade fixed interest rates with confidence. While the Advanced Trading page is geared towards experienced traders, we are committed to simplifying it, along with the Simple Trading page, to make crypto bond and structured product trading accessible to all users. Our goal is to achieve financial inclusion and ensure that everyone can benefit from these advanced trading tools.
Next Steps
This upgrade focuses on the pre-trade to execution phase of the trade lifecycle. Moving forward, we will continue to enhance the entire trade lifecycle, including order confirmations, post-trade notifications, and portfolio analysis. These improvements will be accompanied by a new UI/UX for Zero-Coupon bond tokenization.
As an innovator in the DeFi space, Secured Finance aims to deliver a cleaner and more intuitive user experience for trading new financial instruments. We thank our users for joining us on this journey and look forward to working together to make Secured Finance a DEX that is transparent, fast, and liquid.
Recent Articles
- Secured Finance Unveils Historical Charts
- Secured Finance Web3 Event Recap
- Secured Finance’s Multi-Chain Strategy
Secured Finance Video: Thanks to Protocol Labs and GSR
Reference
Secured Finance Official Links
Website | Twitter | GitHub | Galxe | Link3 | Guild
