Aerodrome Finance
Aerodrome Finance
Redesigning Aerodrome Finance
for Seamless DeFi Experiences
Redesigning Aerodrome Finance
for Seamless DeFi Experiences
Redesigning Aerodrome Finance for Seamless DeFi Experiences
Solo Project
My Role
Product Design
User Research
UI Design
Timeline
Aug 2024 - Nov 2024
Sector
Cryptocurrency
Decentralised Exchange (DEX)
Decentralised Finance (DeFi)
Backstory
Backstory
From Frustration to Innovation:
Reimagining the Aerodrome Experience
From Frustration to Innovation:
Reimagining the Aerodrome Experience
From Frustration to Innovation: Reimagining the Aerodrome Experience
While searching for high-potential tokens for my crypto portfolio, I discovered Aerodrome Finance and its native token, $AERO. Excited by its prospects, I tried to buy it on Coinbase—but as a non-US resident, I couldn’t access the platform. Determined, I turned to Aerodrome’s decentralised exchange, only to face a series of frustrating and inefficient transaction processes that made successful swaps difficult.
Despite these obstacles, I was drawn to Aerodrome’s low fees, decentralisation, and liquidity options on the BASE network. This experience sparked my drive to address its usability flaws and create a seamless, user-friendly experience.
While searching for high-potential tokens for my crypto portfolio, I discovered Aerodrome Finance and its native token, $AERO. Excited by its prospects, I tried to buy it on Coinbase—but as a non-US resident, I couldn’t access the platform. Determined, I turned to Aerodrome’s decentralised exchange, only to face a series of frustrating and inefficient transaction processes that made successful swaps difficult.
Despite these obstacles, I was drawn to Aerodrome’s low fees, decentralisation, and liquidity options on the BASE network. This experience sparked my drive to address its usability flaws and create a seamless, user-friendly experience.
HIGHLIGHTS
Redefining the Decentralised Trading Experience
Redefining the Decentralised Trading Experience
Say goodbye to trading friction and uncertainty. From flexible trading options like Limit Orders and Dollar Cost Averaging to portfolio analytics and real-time market insights, Aerodrome’s redesigned features empower users to trade with clarity and confidence. Every feature is crafted to provide seamless navigation, essential tools, and actionable insights, all in one decentralised platform.
Say goodbye to trading friction and uncertainty. From flexible trading options like Limit Orders and Dollar Cost Averaging to portfolio analytics and real-time market insights, Aerodrome’s redesigned features empower users to trade with clarity and confidence. Every feature is crafted to provide seamless navigation, essential tools, and actionable insights, all in one decentralised platform.
HIGHLIGHTS
Dashboard
Dashboard
Dashboard
Provides an overview of balance, portfolio performance, historical activity, and quick access to features on Aerodrome Finance.
Provides an overview of balance, portfolio performance, historical activity, and quick access to features on Aerodrome Finance.
Swap Feature
Swap Feature
Swap Feature
Streamlines token swapping with a clean, intuitive interface, real-time price updates, and enhanced accessibility to ensure a seamless and efficient trading experience for users.
Streamlines token swapping with a clean, intuitive interface, real-time price updates, and enhanced accessibility to ensure a seamless and efficient trading experience for users.
Limit Orders
Limit Orders
Limit Orders
Provides greater trading flexibility by enabling users to set custom buy or sell prices with adjustable expiry, empowering strategic and controlled trading decisions.
Provides greater trading flexibility by enabling users to set custom buy or sell prices with adjustable expiry, empowering strategic and controlled trading decisions.
Dollar-Cost Averaging (DCA)
Dollar-Cost Averaging (DCA)
Dollar-Cost Averaging (DCA)
Empowers users to invest strategically by automating recurring purchases, reducing market timing risks, and ensuring consistent portfolio growth over time.
Empowers users to invest strategically by automating recurring purchases, reducing market timing risks, and ensuring consistent portfolio growth over time.
Buy Feature
Buy Feature
Buy Feature
Simplifies token purchases by allowing users to buy directly with fiat currencies, ensuring a seamless and intuitive onboarding experience for all traders.
Simplifies token purchases by allowing users to buy directly with fiat currencies, ensuring a seamless and intuitive onboarding experience for all traders.
Token Analytics & Comparison
Token Analytics & Comparison
Token Analytics & Comparison
Provides comprehensive price charts, performance trends, and key metrics alongside side-by-side token analysis, enabling informed and smarter trading decisions.
Provides comprehensive price charts, performance trends, and key metrics alongside side-by-side token analysis, enabling informed and smarter trading decisions.
Profit & Loss Tracker
Profit & Loss Tracker
Profit & Loss Tracker
Offers a detailed breakdown of portfolio performance, including net worth, asset trends, and realised and unrealised gains, helping users evaluate and optimise their trading strategies.
Offers a detailed breakdown of portfolio performance, including net worth, asset trends, and realised and unrealised gains, helping users evaluate and optimise their trading strategies.
What is Aerodrome Finance?
Decentralised Exchange on BASE network
Decentralised Exchange on BASE network
Decentralised Exchange on BASE network
Aerodrome Finance is a decentralised exchange (DEX) and liquidity platform built on Base, Coinbase's Ethereum Layer 2 network. By leveraging Base's low fees and fast transaction speeds, Aerodrome enables token swaps, liquidity provision, and staking. With over $1.3 billion in total value locked (TVL) and growing trading volumes fueled by trends like memecoin speculation, Aerodrome has established itself as a key player in the ecosystem.
Aerodrome Finance is a decentralised exchange (DEX) and liquidity platform built on Base, Coinbase's Ethereum Layer 2 network. By leveraging Base's low fees and fast transaction speeds, Aerodrome enables token swaps, liquidity provision, and staking. With over $1.3 billion in total value locked (TVL) and growing trading volumes fueled by trends like memecoin speculation, Aerodrome has established itself as a key player in the ecosystem.
However, despite its strong market position, Aerodrome’s user experience leaves much to be desired. The platform lacks essential features that users expect from centralised exchanges, creating frustration and barriers to adoption. This gap presents an opportunity to reimagine the user journey and elevate the platform’s usability.
However, despite its strong market position, Aerodrome’s user experience leaves much to be desired. The platform lacks essential features that users expect from centralised exchanges, creating frustration and barriers to adoption. This gap presents an opportunity to reimagine the user journey and elevate the platform’s usability.
Go to Aerodrome
Current Aerodrome Website
Current Aerodrome Website
Research and Findings
Where Frustration Begins: Uncovering Aerodrome’s UX Roadblocks
Where Frustration Begins: Uncovering Aerodrome’s UX Roadblocks
Where Frustration Begins: Uncovering Aerodrome’s UX Roadblocks
To validate my hypothesis that other users face similar difficulties, I conducted a usability test with two participants given them the goal of purchasing $AERO via the platform. The process revealed several obstacles preventing a smooth transaction experience.
To validate my hypothesis that other users face similar difficulties, I conducted a usability test with two participants given them the goal of purchasing $AERO via the platform. The process revealed several obstacles preventing a smooth transaction experience.
User Goal
Successfully purchase or swap tokens on Aerodrome.
Reality
Numerous blockers led to transaction failures or prolonged completion time.
Usability Test Findings
Lack of Upfront Guidance
Both users failed their first swap attempt due to the lack of upfront guidance on network requirements (e.g., bridging funds or needing ETH on Base for gas fees).
Frequent Transaction Failure
Frequent transaction failures occurred because token exchange rates didn’t update automatically, forcing users to refresh the page and restart the process.
Lack of Error Feedback
When issues occurred, the platform offered no explanation. Actions were either disabled without context or the system froze, leaving users unsure of the problem or how to proceed.
Fee Charges Before Swap Attempt
The "Grant Allowance" step charges a fee, misleading users to think the swap is complete. However, it only grants wallet access, requiring another fee for the actual swap.
No Real-time Price Reference
The platform lacks real-time token price data, causing uncertainty and forcing users to rely on external platforms for price charts.
Lack of Transaction Feedback or History
The absence of transaction feedback or history forces users to manually check their wallets to confirm if a swap was successful.
User Interview Insights
In addition to usability testing, I conducted user interviews with the participants to delve deeper into their pain points and expectations.
In addition to usability testing, I conducted user interviews with the participants to delve deeper into their pain points and expectations.
Advanced Trading Tools
Users desire greater flexibility in trading beyond simply swapping at the current market price. They prefer features that allow them to set orders to execute automatically when the market reaches a specific price, enabling more strategic entry points without the need for constant monitoring.
Direct Token Purchase
Users want the option to buy tokens directly with fiat on the platform. For instance, when extra gas fees are needed, they prefer purchasing tokens instantly rather than using external exchanges and transferring funds, reducing unnecessary steps and hassle.
Price Charts and Analysis Tools
Users highlighted the inconvenience of not having live token prices or historical charts on the platform. This forces them to rely on external tools to determine optimal entry and exit points, making it harder to make informed trading decisions.
Order History and Tracking
Users value a detailed transaction history to track trades and monitor performance, including profit and loss insights. Without this, managing records and evaluating trading outcomes becomes unnecessarily difficult.
Device Preference
Users prefer trading on mobile devices for their convenience and ability to execute trades on the go. While they also use desktop devices for a broader view, mobile offers the flexibility they value most.
Competitor Analysis
How Competitors Address These Challenges
How Competitors Address These Challenges
How Competitors Address These Challenges
To identify gaps in Aerodrome Finance, I compared it features against leading DeFi platforms including Uniswap, PancakeSwap, SushiSwap and Jupiter.
To identify gaps in Aerodrome Finance, I compared it features against leading DeFi platforms including Uniswap, PancakeSwap, SushiSwap and Jupiter.
Competitor Analysis
What Do They Have in Common?
What Do They Have in Common?
From this analysis, I identified several strengths in competitor platforms that contribute to a user friendly experience. These include:
From this analysis, I identified several strengths in competitor platforms that contribute to a user friendly experience. These include:
Feature-Rich Trading Option
Uniswap, SushiSwap, and Jupiter offer tools like limit orders and token price charts, catering to traders seeking flexibility and transparency.
Jupiter offers unique Dollar Cost Averaging (DCA) options, enabling users to automate recurring trades, which is particularly valuable for long-term strategies.
Post-Transaction Usability
All platforms offer users access to their transaction history. Uniswap and Jupiter go further by providing views of open orders and order history, including limit orders.
Additionally, each platform offers success confirmation messages, which helps build trust and reduce user uncertainty.
Pre-Swap Check & Bridging
Competitor platforms offer early pre-swap checks, like insufficient fund notifications, to inform users promptly.
Uniswap provides network-specific bridging guides, reducing transaction failures. PancakeSwap features internal bridging, and SushiSwap supports cross-chain swaps for seamless user experience.
User Centric Tool
Uniswap and Jupiter offer token price charts, simplifying market analysis for users.
All competitors also provide trading asset estimations in USD, helping users plan and make informed trading decisions.
Define the Problem
Based on these findings, I developed a problem statement and framed a How Might We (HMW) question to better align with the user’s goals and needs, creating a strong foundation for design solutions.
Based on these findings, I developed a problem statement and framed a How Might We (HMW) question to better align with the user’s goals and needs, creating a strong foundation for design solutions.
PROBLEM STATEMENT
“Aerodrome users face significant friction when attempting to complete transactions, stemming from unclear processes, insufficient feedback, and a lack of essential tools that support informed and flexible trading. These issues create uncertainty, force reliance on external resources, and undermine trust in the platform, preventing a seamless and intuitive user experience. ”
HMW
“HMW provide clearer guidance and feedback to help users feel more confident and informed during transactions?”
“HMW equip users with essential tools that enable more flexible and informed trading decisions directly within the platform?”
“HMW enhance post-transaction feedback to provide clarity and reinforce users’ confidence in completed actions?
PROBLEM STATEMENT
“Aerodrome users face significant friction when attempting to complete transactions, stemming from unclear processes, insufficient feedback, and a lack of essential tools that support informed and flexible trading. These issues create uncertainty, force reliance on external resources, and undermine trust in the platform, preventing a seamless and intuitive user experience. ”
HMW
“How might we improve the user experience on Aerodrome to ensure clarity, trust, and flexibility throughout the trading journey? ”
“HMW equip users with essential tools that enable more flexible and informed trading decisions directly within the platform?”
“HMW enhance post-transaction feedback to provide clarity and reinforce users’ confidence in completed actions?
Ideation and Design Process
Transforming Insights into Actionable Designs
Transforming Insights into Actionable Designs
Transforming Insights into Actionable Designs
I began the ideation stage by sketching ideas to improve user clarity during the swapping process and to offer greater flexibility in the trading journey. Prioritising user convenience, I chose a mobile-first approach for the prototype, enabling seamless on-the-go trading.
I began the ideation stage by sketching ideas to improve user clarity during the swapping process and to offer greater flexibility in the trading journey. Prioritising user convenience, I chose a mobile-first approach for the prototype, enabling seamless on-the-go trading.
I began the ideation stage by sketching ideas to improve user clarity during the swapping process and to offer greater flexibility in the trading journey. Prioritising user convenience, I chose a mobile-first approach for the prototype, enabling seamless on-the-go trading.
I began the ideation stage by sketching ideas to improve user clarity during the swapping process and to offer greater flexibility in the trading journey. Prioritising user convenience, I chose a mobile-first approach for the prototype, enabling seamless on-the-go trading.
After sketching initial design ideas, I developed an application flow to map out the connections between each feature, ensuring a seamless user journey and cohesive experience.
After sketching initial design ideas, I developed an application flow to map out the connections between each feature, ensuring a seamless user journey and cohesive experience.
I developed a mid-fidelity prototype to outline the interface and user flow of the exchange, refining the user experience for each key feature. This was followed by creating a high-fidelity prototype that focused on visual design, ensuring it captured Aerodrome’s branding, colours, and overall aesthetic.
I developed a mid-fidelity prototype to outline the interface and user flow of the exchange, refining the user experience for each key feature. This was followed by creating a high-fidelity prototype that focused on visual design, ensuring it captured Aerodrome’s branding, colours, and overall aesthetic.
Mid-Fidelity
High-Fidelity
Usability Test and Findings
Effectiveness of the Redesigned
Effectiveness of the Redesigned
Effectiveness of the Redesigned
To evaluate the effectiveness of the redesigned user experience, I conducted usability testing with three crypto traders who are experienced with decentralised exchanges. Participants were asked to test the prototype feature by feature, ensuring they could complete key actions effectively.
To evaluate the effectiveness of the redesigned user experience, I conducted usability testing with three crypto traders who are experienced with decentralised exchanges. Participants were asked to test the prototype feature by feature, ensuring they could complete key actions effectively.
The tasks included:
Landing Page
Connect Wallet successfully
Dashboard
Navigate to the correct location for each feature
Swap Feature
Complete a successful token swap
Swap Feature
Complete a successful token swap
Limit Feature
Set up and complete a limit order
Limit Feature
Set up and complete a limit order
DCA Feature
Set up and complete a DCA order
Buy Feature
Complete a buy order
Single Token View
Locate single token information from the dashboard
Profit & Loss Feature
Find profit and loss details
Overall Feedback
Share details user experience and insights on each feature
Overall Feedback
Share details user experience and insights on each feature
Landing Page
Connect Wallet successfully
Dashboard
Navigate to the correct location for each feature
Swap Feature
Complete a successful token swap
Limit Feature
Set up and complete a limit order
DCA Feature
Set up and complete a DCA order
Buy Feature
Complete a buy order
Single Token View
Locate single token information from the dashboard
Profit & Loss Feature
Find profit and loss details
Overall Feedback
Share details user experience and insights on each feature
Key Findings
Successful Outcomes and Areas for Feature Refinement
Successful Outcomes and Areas for Feature Refinement
Successful Outcomes and Areas for Feature Refinement
While users successfully completed all tasks, their feedback highlighted key preferences, suggestions, and pain points. These insights offer valuable opportunities for refining and improving the overall user experience.
While users successfully completed all tasks, their feedback highlighted key preferences, suggestions, and pain points. These insights offer valuable opportunities for refining and improving the overall user experience.
Positive Feedback
User-Friendly Features
Users found the features intuitive and easy to use, with smooth swap and order processes.
Clear Notifications
Users appreciated clear feedback for insufficient funds or gas fees, boosting their confidence during transactions.
Advanced Trading Options
Users liked the advanced trading features, such as Limit Orders and DCA, typically found on centralised exchanges.
Token Price Comparison
All users found the token price chart comparison feature highly useful.
Profit-Loss Feature
Users found the Profit & Loss feature particularly useful, as competitors do not offer it.
Feedback
Spending Amount First
Users preferred keying in the spending amount first, rather than the buying amount.
Missing Bridge Banner
The bridge token to Base banner was missing or not prominent enough.
Bridging Confusion
Users found the bridging process confusing and preferred an automated solution.
Limit Setting Confusion
Users found the limit setting section unclear due to a lack of visual hierarchy.
Goal-Oriented DCA
Users wanted the option to set DCA with specific goals rather than a total investment amount.
Checkout Payment Options
Users missed the link button to select payment and provider options.
Wallet Balance Privacy
Users wanted the option to mask their wallet balance for better privacy.
Spending Amount First
Users preferred keying in the spending amount first, rather than the buying amount.
Missing Bridge Banner
The bridge token to Base banner was missing or not prominent enough.
Bridging Confusion
Users found the bridging process confusing and preferred an automated solution.
Limit Setting Confusion
Users found the limit setting section unclear due to a lack of visual hierarchy.
Goal-Oriented DCA
Users wanted the option to set DCA with specific goals rather than a total investment amount.
Checkout Payment Options
Users missed the link button to select payment and provider options.
Wallet Balance Privacy
Users wanted the option to mask their wallet balance for better privacy.
Spending Amount First
Users preferred keying in the spending amount first, rather than the buying amount.
Missing Bridge Banner
The bridge token to Base banner was missing or not prominent enough.
Bridging Confusion
Users found the bridging process confusing and preferred an automated solution.
Limit Setting Confusion
Users found the limit setting section unclear due to a lack of visual hierarchy.
Goal-Oriented DCA
Users wanted the option to set DCA with specific goals rather than a total investment amount.
Checkout Payment Options
Users missed the link button to select payment and provider options.
Wallet Balance Privacy
Users wanted the option to mask their wallet balance for better privacy.
Spending Amount First
Users preferred keying in the spending amount first, rather than the buying amount.
Missing Bridge Banner
The bridge token to Base banner was missing or not prominent enough.
Bridging Confusion
Users found the bridging process confusing and preferred an automated solution.
Limit Setting Confusion
Users found the limit setting section unclear due to a lack of visual hierarchy.
Goal-Oriented DCA
Users wanted the option to set DCA with specific goals rather than a total investment amount.
Checkout Payment Options
Users missed the link button to select payment and provider options.
Wallet Balance Privacy
Users wanted the option to mask their wallet balance for better privacy.
Spending Amount First
Users preferred keying in the spending amount first, rather than the buying amount.
Missing Bridge Banner
The bridge token to Base banner was missing or not prominent enough.
Bridging Confusion
Users found the bridging process confusing and preferred an automated solution.
Limit Setting Confusion
Users found the limit setting section unclear due to a lack of visual hierarchy.
Goal-Oriented DCA
Users wanted the option to set DCA with specific goals rather than a total investment amount.
Checkout Payment Options
Users missed the link button to select payment and provider options.
Wallet Balance Privacy
Users wanted the option to mask their wallet balance for better privacy.
Re-iteration
Implementing the Feedback
Implementing the Feedback
Implementing the Feedback
Using insights from usability testing, I refined the design to address pain points and align with user feedback, creating a smoother and more intuitive experience. The testing also provided valuable input for enhancing new trading features and overall usability.
Using insights from usability testing, I refined the design to address pain points and align with user feedback, creating a smoother and more intuitive experience. The testing also provided valuable input for enhancing new trading features and overall usability.
01: Prioritising Spending Amount
Feedback Implementation
Feedback Implementation
To address this, I updated the interface to prioritise the spending amount input, followed by the selection of the token to swap into.
To address this, I updated the interface to prioritise the spending amount input, followed by the selection of the token to swap into.
Before
After
Swap
Before
After
Swap
Swap
Before
Swap
After
02: Network Bridging Requirement
To address network compatibility and bridging issues, I added informational banners and prompts. Usability feedback showed users ignored these and preferred direct error messages or actionable feedback.
To address network compatibility and bridging issues, I added informational banners and prompts. Usability feedback showed users ignored these and preferred direct error messages or actionable feedback.
Feedback Implementation
Feedback Implementation
Provide immediate feedback if the user selects a token from an unsupported network.
Provide immediate feedback if the user selects a token from an unsupported network.
Add a network icon in “Your Tokens” to show which tokens are on the Base network.
Add a network icon in “Your Tokens” to show which tokens are on the Base network.
Place a “Bridge token to Base” information banner at the bottom of the swap page.
Place a “Bridge token to Base” information banner at the bottom of the swap page.
Network Icons display
Network Compatibility Feedback
Immediate Feedback - Network Compatibility
Thoughts: The ideal solution for network compatibility would be enabling cross-chain transactions, as seen in major decentralised exchanges. However, since Aerodrome currently only supports the BASE network, this isn't feasible at the moment.
Thoughts: The ideal solution for network compatibility would be enabling cross-chain transactions, as seen in major decentralised exchanges. However, since Aerodrome currently only supports the BASE network, this isn't feasible at the moment.
Immediate Feedback - Network Compatibility
Network Icons display
Immediate Feedback - Network Compatibility
Network Compatibility Feedback
03: Limit Setting Confusion
Feedback Implementation
Feedback Implementation
Users found the limit-setting section confusing due to a lack of visual hierarchy between the limit and swap boxes.
Users found the limit-setting section confusing due to a lack of visual hierarchy between the limit and swap boxes.
I addressed this by enhancing visual hierarchy and clearly separating the swap box.
I addressed this by enhancing visual hierarchy and clearly separating the swap box.
Before
After
Limit
Limit
Before
Limit
After
04: Goal Oriented DCA
Usability Feedback: A user proposed a goal-based DCA option to accumulate a specific token amount instead of allocating a total fund. While this idea has merit, I decided against it due to potential challenges. If token prices fluctuate drastically, funds could deplete before the DCA period ends, requiring the platform to request additional funds.
Usability Feedback: A user proposed a goal-based DCA option to accumulate a specific token amount instead of allocating a total fund. While this idea has merit, I decided against it due to potential challenges. If token prices fluctuate drastically, funds could deplete before the DCA period ends, requiring the platform to request additional funds.
Complexity: As a decentralised exchange, it lacks push notification capabilities, making it difficult to alert users effectively. Given these complexities, further consideration would be needed to determine the feasibility and value of implementing such a feature.
Complexity: As a decentralised exchange, it lacks push notification capabilities, making it difficult to alert users effectively. Given these complexities, further consideration would be needed to determine the feasibility and value of implementing such a feature.
Feedback Implementation
Feedback Implementation
Instead, I refined the DCA feature interface to match the limit order page, ensuring clear hierarchy and consistency.
Instead, I refined the DCA feature interface to match the limit order page, ensuring clear hierarchy and consistency.
Before
After
DCA
DCA
Before
DCA
After
05: Checkout Payment Options
Users completely overlooked the “Debit Card” and “MoonPay” hyperlinks, which allow them to select their preferred payment method and service provider before checkout.
Users completely overlooked the “Debit Card” and “MoonPay” hyperlinks, which allow them to select their preferred payment method and service provider before checkout.
Feedback Implementation
Feedback Implementation
To resolve this, I removed the hyperlink settings and integrated the payment method and service provider selection directly into the checkout flow, ensuring users don’t miss these options.
To resolve this, I removed the hyperlink settings and integrated the payment method and service provider selection directly into the checkout flow, ensuring users don’t miss these options.
Before
After
Buy
Payment Method
Payment Provider
Continue to 3rd party app
Buy
Payment Method
Payment Provider
Continue to 3rd party app
Buy
BUY
Before
BUY
After
BUY
Payment Method
BUY
Payment Provider
BUY
Continue to 3rd party app
06: Wallet Balance Privacy
The wallet dashboard is a new feature that provides users with a quick overview of their portfolio and easy navigation across Aerodrome. Users suggested adding an option to mask wallet balances for enhanced privacy.
The wallet dashboard is a new feature that provides users with a quick overview of their portfolio and easy navigation across Aerodrome. Users suggested adding an option to mask wallet balances for enhanced privacy.
Feedback Implementation
Feedback Implementation
I implemented a "Hide Balance" option to enhance user privacy.
I implemented a "Hide Balance" option to enhance user privacy.
Balance Displayed
Balance Hide
Dashboard
Dashboard
Balance Displayed
Dashboard
Balance Hide
The Solution
The Solution
Streamlining Trading Process and Providing More Flexibility to suits user’s need
Streamlining Trading Process and Providing More Flexibility to suits user’s need
Streamlining Trading Process and Providing More Flexibility to suits user’s need
This solution aims to offer users greater flexibility in trading, resolve existing usability issues that hinder successful trades, and introduce features that support informed decision-making and effective portfolio tracking.
This solution aims to offer users greater flexibility in trading, resolve existing usability issues that hinder successful trades, and introduce features that support informed decision-making and effective portfolio tracking.
Flexibility
Enhanced Trading Options for Greater Flexibility
Enhanced Trading Options for Greater Flexibility
Enhanced Trading Options for Greater Flexibility
Feature:
Feature:
Limit, Dollar-Cost Averaging (DCA), Buy Now
Limit, Dollar-Cost Averaging (DCA), Buy Now
Rationale:
Rationale:
To provide users with more control over their trades, these features offer alternatives to direct market swaps, enhancing trading flexibility and allowing users to customise their strategies.
To provide users with more control over their trades, these features offer alternatives to direct market swaps, enhancing trading flexibility and allowing users to customise their strategies.
Limit
Dollar-Cost Averaging
Buy
Limit
Dollar-Cost Averaging
Buy
Clarity & Trust
Making Inform Trading Decision
Making Inform Trading Decision
Making Inform Trading Decision
Feature:
Feature:
Historical price chart on single token view
Trade page, token price reference to USD
Historical price chart on single token view
Trade page, token price reference to USD
Rationale:
Rationale:
To empower users to make better trading decisions, the trading page now includes a USD price reference for selected tokens. Additionally, the single token view provides access to historical price charts and detailed token information, enhancing users' ability to analyse trends and make informed choices.
To empower users to make better trading decisions, the trading page now includes a USD price reference for selected tokens. Additionally, the single token view provides access to historical price charts and detailed token information, enhancing users' ability to analyse trends and make informed choices.
Redesigned: Swap Feature
Single Token View
Redesigned: Swap Feature
Single Token View
Clarity
Insightful Trading Experience
Insightful Trading Experience
Insightful Trading Experience
Feature:
Feature:
Token Performance Chart Comparison
Token Performance Chart Comparison
Rationale:
Rationale:
To improve the user experience in making informed trading decisions, enabling users to compare the price performance chart of their selected token against others will provide valuable insights.
To improve the user experience in making informed trading decisions, enabling users to compare the price performance chart of their selected token against others will provide valuable insights.
Compare Token
Select Pairing
Compare Token
Select Pairing
Clarity & Trust
Enhanced Transaction Feedback and Order Tracking
Enhanced Transaction Feedback and Order Tracking
Enhanced Transaction Feedback and Order Tracking
Feature:
Feature:
Transaction Feedback, Transaction History, and Ongoing Orders
Transaction Feedback, Transaction History, and Ongoing Orders
Rationale:
Rationale:
Previously, Aerodrome lacked transaction feedback and history pages, making it difficult for users to confirm successful trades. By adding these, users receive immediate feedback on completed transactions. The "Activity" tab provides access to historical trades, while the "Order" tab shows active Limit and DCA orders.
Previously, Aerodrome lacked transaction feedback and history pages, making it difficult for users to confirm successful trades. By adding these, users receive immediate feedback on completed transactions. The "Activity" tab provides access to historical trades, while the "Order" tab shows active Limit and DCA orders.
Swap Completed
Dashboard Activity Tab for accessing transaction history
Dashboard Activity Tab for accessing transaction history
Swap Completed
Dashboard Orders History
Activity Tab for Transaction History
Clarity
Upfront Guidance and Immediate Feedback
Upfront Guidance and Immediate Feedback
Upfront Guidance and Immediate Feedback
Feature:
Feature:
Network Compatibility and Bridging Requirement Guidance
Insufficient Fund Feedback
Network Compatibility and Bridging Requirement Guidance
Insufficient Fund Feedback
Rationale:
Rationale:
To ensure a smooth trading experience, it's crucial for users to be aware of network compatibility and bridging requirements upfront. This guidance helps prevent errors and delays during transactions. Additionally, providing clear feedback for insufficient funds ensures users are informed in real-time, reducing frustration and enhancing confidence in managing their trades.
To ensure a smooth trading experience, it's crucial for users to be aware of network compatibility and bridging requirements upfront. This guidance helps prevent errors and delays during transactions. Additionally, providing clear feedback for insufficient funds ensures users are informed in real-time, reducing frustration and enhancing confidence in managing their trades.
Network Icons display
Network Compatibility Feedback
Insufficient Fund for Gas Fee
Network Icons display
Network Compatibility Feedback
Insufficient Fund for Gas Fee
Trust
Fee Charges Upon Trade Confirmation
Fee Charges Upon Trade Confirmation
Fee Charges Upon Trade Confirmation
Feature:
Feature:
Review Order
Review Order
Rationale:
Rationale:
The "Review Order" feature provides users with a final opportunity to confirm their trade details before execution. This ensures transparency and prevents accidental transactions, enhancing user confidence and control over their trading decisions.
The "Review Order" feature provides users with a final opportunity to confirm their trade details before execution. This ensures transparency and prevents accidental transactions, enhancing user confidence and control over their trading decisions.
Existing: Granting access to allowance charges fee even before the swap attempt
Fee only charges if user decide to confirm their swap
Existing: Granting access to allowance charges fee even before the swap attempt
Fee only charges if user decide to confirm their swap
Reflection
Reflection
Reflection
Reflection and Future Directions
Reflection and Future Directions
Reflection and Future Directions
What I Learned
What I Learned
Designing a decentralised exchange was a rewarding challenge, offering valuable insights into wallet integration, network compatibility, and bridging requirements. By analysing competitors and addressing unique design challenges, I deepened my understanding of web3 design principles and the nuances of blockchain product development. This experience reinforced my passion for crafting innovative, user-centric solutions in the blockchain space.
Designing a decentralised exchange was a rewarding challenge, offering valuable insights into wallet integration, network compatibility, and bridging requirements. By analysing competitors and addressing unique design challenges, I deepened my understanding of web3 design principles and the nuances of blockchain product development. This experience reinforced my passion for crafting innovative, user-centric solutions in the blockchain space.
Next Steps
Next Steps
Having adopted a mobile-first approach, my next step is to design a desktop prototype to ensure the dApp meets the needs of both mobile and desktop users. I also plan to expand my expertise in blockchain-specific UX design, stay updated on emerging web3 trends, and tackle more complex projects to refine my ability to balance technical constraints with user-friendly design. Continuous iteration based on user feedback will remain a priority to deliver seamless, innovative solutions.
Having adopted a mobile-first approach, my next step is to design a desktop prototype to ensure the dApp meets the needs of both mobile and desktop users. I also plan to expand my expertise in blockchain-specific UX design, stay updated on emerging web3 trends, and tackle more complex projects to refine my ability to balance technical constraints with user-friendly design. Continuous iteration based on user feedback will remain a priority to deliver seamless, innovative solutions.
Next Project
Next Project
