Chen Yu Pan
Make Decentralized Trading Easier
I turned a broad protocol partnership into a focused trading product, then redesigned how users understood and moved assets between their wallet and the DEX.
Role
Main Product Designer
Scope
MVP · Design system
Timeline
1 month to initial Design · 2 months to first launch
See It Live
From a partnership to a focused MVP
The brief was to build a working decentralized exchange on NEAR using Orderly’s orderbook infrastructure. I worked with the PM to define the first release around spot trading, wallet transfers, account information and orders.
I owned the product flows, UI and lightweight design system. A supporting designer handled animation and selected visual effects. I worked with one PM and one frontend developer.
First Release
Spot trading
Wallet transfers
Account information
Order history
Out of MVP
Futures
Deferred to a later release
Swap
Removed from Scope
Keep trading familiar
The spot trading interface adopts established design patterns from centralized exchanges to ease users’ transition to decentralized trading.
Two balances. One visible relationship.
In the first prototype, colleagues unfamiliar with DeFi needed help understanding the relationship between their personal wallet and DEX balances. I redesigned the wallet to show these as two distinct asset spaces.
Before: A table of balances
A single table placed the DEX balance and personal wallet balance in different columns. The user still had to infer the relationship.
After: Two explicit asset spaces
Trading Wallet on the left. DeFi Wallet on the right. Transfer controls sit between matching assets, making direction visible.
Three assets. One transaction.
I worked with the PM and frontend engineer to confirm what the protocol could support, then designed a transfer flow that let users deposit or withdraw up to three assets together.
Complete the journey
The receive panel names the Trading Wallet, reinforcing where the assets are going.
Keep each amount independent
Each asset has its own available balance, amount and percentage control.
Show the transfer limit
A shared receive summary and remaining-asset count keep the three-asset limit visible.
A system that grew with the product
I established a lightweight system of trading colors, panel structures, components and interaction states. It supported the spot MVP and provided the foundation for the Futures experience that followed.
I owned the complete Futures design, extending the existing foundation to cover collateral, leverage, liquidation price, positions and P&L.
From a focused launch
to a broader trading product
The first release brought spot trading, wallet transfers and account essentials into production in two months. I later owned the complete Futures design, carrying the initial foundation into a broader trading experience.
Focus
A working spot MVP with clear release boundaries.
Clarity
An explicit relationship between personal and trading balances.
Continuity
A shared design foundation extended into Futures.
See The Product Live
More case studies?
Let’s work together.
Make Decentralized Trading Easier
I turned a broad protocol partnership into a focused trading product, then redesigned how users understood and moved assets between their wallet and the DEX.
Role
Main Product Designer
Scope
MVP · Design system
Timeline
1 month to initial Design · 2 months to first launch
See It Live
From a partnership to a focused MVP
The brief was to build a working decentralized exchange on NEAR using Orderly’s orderbook infrastructure. I worked with the PM to define the first release around spot trading, wallet transfers, account information and orders.
I owned the product flows, UI and lightweight design system. A supporting designer handled animation and selected visual effects. I worked with one PM and one frontend developer.
First Release
Spot trading
Wallet transfers
Account information
Order history
Out of MVP
Futures
Deferred to a later release
Swap
Removed from Scope
Keep trading familiar
The spot trading interface adopts established design patterns from centralized exchanges to ease users’ transition to decentralized trading.
Two balances. One visible relationship.
In the first prototype, colleagues unfamiliar with DeFi needed help understanding the relationship between their personal wallet and DEX balances. I redesigned the wallet to show these as two distinct asset spaces.
Before: A table of balances
A single table placed the DEX balance and personal wallet balance in different columns. The user still had to infer the relationship.
After: Two explicit asset spaces
Trading Wallet on the left. DeFi Wallet on the right. Transfer controls sit between matching assets, making direction visible.
Three assets. One transaction.
I worked with the PM and frontend engineer to confirm what the protocol could support, then designed a transfer flow that let users deposit or withdraw up to three assets together.
Complete the journey
The receive panel names the Trading Wallet, reinforcing where the assets are going.
Keep each amount independent
Each asset has its own available balance, amount and percentage control.
Show the transfer limit
A shared receive summary and remaining-asset count keep the three-asset limit visible.
A system that grew with the product
I established a lightweight system of trading colors, panel structures, components and interaction states. It supported the spot MVP and provided the foundation for the Futures experience that followed.
I owned the complete Futures design, extending the existing foundation to cover collateral, leverage, liquidation price, positions and P&L.
From a focused launch
to a broader trading product
The first release brought spot trading, wallet transfers and account essentials into production in two months. I later owned the complete Futures design, carrying the initial foundation into a broader trading experience.
Focus
A working spot MVP with clear release boundaries.
Clarity
An explicit relationship between personal and trading balances.
Continuity
A shared design foundation extended into Futures.
See The Product Live
More case studies?
Let’s work together.
Make Decentralized Trading Easier
I turned a broad protocol partnership into a focused trading product, then redesigned how users understood and moved assets between their wallet and the DEX.
Role
Main Product Designer
Scope
MVP · Design system
Timeline
1 month to initial Design · 2 months to first launch
See It Live
From a partnership to a focused MVP
The brief was to build a working decentralized exchange on NEAR using Orderly’s orderbook infrastructure. I worked with the PM to define the first release around spot trading, wallet transfers, account information and orders.
I owned the product flows, UI and lightweight design system. A supporting designer handled animation and selected visual effects. I worked with one PM and one frontend developer.
First Release
Spot trading
Wallet transfers
Account information
Order history
Out of MVP
Futures
Deferred to a later release
Swap
Removed from Scope
Keep trading familiar
The spot trading interface adopts established design patterns from centralized exchanges to ease users’ transition to decentralized trading.
Two balances. One visible relationship.
In the first prototype, colleagues unfamiliar with DeFi needed help understanding the relationship between their personal wallet and DEX balances. I redesigned the wallet to show these as two distinct asset spaces.
Before: A table of balances
A single table placed the DEX balance and personal wallet balance in different columns. The user still had to infer the relationship.
After: Two explicit asset spaces
Trading Wallet on the left. DeFi Wallet on the right. Transfer controls sit between matching assets, making direction visible.
Three assets. One transaction.
I worked with the PM and frontend engineer to confirm what the protocol could support, then designed a transfer flow that let users deposit or withdraw up to three assets together.
Complete the journey
The receive panel names the Trading Wallet, reinforcing where the assets are going.
Keep each amount independent
Each asset has its own available balance, amount and percentage control.
Show the transfer limit
A shared receive summary and remaining-asset count keep the three-asset limit visible.
A system that grew with the product
I established a lightweight system of trading colors, panel structures, components and interaction states. It supported the spot MVP and provided the foundation for the Futures experience that followed.
I owned the complete Futures design, extending the existing foundation to cover collateral, leverage, liquidation price, positions and P&L.
From a focused launch
to a broader trading product
The first release brought spot trading, wallet transfers and account essentials into production in two months. I later owned the complete Futures design, carrying the initial foundation into a broader trading experience.
Focus
A working spot MVP with clear release boundaries.
Clarity
An explicit relationship between personal and trading balances.
Continuity
A shared design foundation extended into Futures.
See The Product Live
More case studies?
Let’s work together.
Make Decentralized Trading Easier
I turned a broad protocol partnership into a focused trading product, then redesigned how users understood and moved assets between their wallet and the DEX.
Role
Main Product Designer
Scope
MVP · Design system
Timeline
1 month to initial Design · 2 months to first launch
See It Live
From a partnership to a focused MVP
The brief was to build a working decentralized exchange on NEAR using Orderly’s orderbook infrastructure. I worked with the PM to define the first release around spot trading, wallet transfers, account information and orders.
I owned the product flows, UI and lightweight design system. A supporting designer handled animation and selected visual effects. I worked with one PM and one frontend developer.
First Release
Spot trading
Wallet transfers
Account information
Order history
Out of MVP
Futures
Deferred to a later release
Swap
Removed from Scope
Keep trading familiar
The spot trading interface adopts established design patterns from centralized exchanges to ease users’ transition to decentralized trading.
Two balances. One visible relationship.
In the first prototype, colleagues unfamiliar with DeFi needed help understanding the relationship between their personal wallet and DEX balances. I redesigned the wallet to show these as two distinct asset spaces.
Before: A table of balances
A single table placed the DEX balance and personal wallet balance in different columns. The user still had to infer the relationship.
After: Two explicit asset spaces
Trading Wallet on the left. DeFi Wallet on the right. Transfer controls sit between matching assets, making direction visible.
Three assets. One transaction.
I worked with the PM and frontend engineer to confirm what the protocol could support, then designed a transfer flow that let users deposit or withdraw up to three assets together.
Complete the journey
The receive panel names the Trading Wallet, reinforcing where the assets are going.
Keep each amount independent
Each asset has its own available balance, amount and percentage control.
Show the transfer limit
A shared receive summary and remaining-asset count keep the three-asset limit visible.
A system that grew with the product
I established a lightweight system of trading colors, panel structures, components and interaction states. It supported the spot MVP and provided the foundation for the Futures experience that followed.
I owned the complete Futures design, extending the existing foundation to cover collateral, leverage, liquidation price, positions and P&L.
From a focused launch
to a broader trading product
The first release brought spot trading, wallet transfers and account essentials into production in two months. I later owned the complete Futures design, carrying the initial foundation into a broader trading experience.
Focus
A working spot MVP with clear release boundaries.
Clarity
An explicit relationship between personal and trading balances.
Continuity
A shared design foundation extended into Futures.
See The Product Live
More case studies?
Let’s work together.
Make Decentralized Trading Easier
I turned a broad protocol partnership into a focused trading product, then redesigned how users understood and moved assets between their wallet and the DEX.
Role
Main Product Designer
Scope
MVP · Design system
Timeline
1 month to initial Design · 2 months to first launch
See It Live
From a partnership to a focused MVP
The brief was to build a working decentralized exchange on NEAR using Orderly’s orderbook infrastructure. I worked with the PM to define the first release around spot trading, wallet transfers, account information and orders.
I owned the product flows, UI and lightweight design system. A supporting designer handled animation and selected visual effects. I worked with one PM and one frontend developer.
First Release
Spot trading
Wallet transfers
Account information
Order history
Out of MVP
Futures
Deferred to a later release
Swap
Removed from Scope
Keep trading familiar
The spot trading interface adopts established design patterns from centralized exchanges to ease users’ transition to decentralized trading.
Two balances. One visible relationship.
In the first prototype, colleagues unfamiliar with DeFi needed help understanding the relationship between their personal wallet and DEX balances. I redesigned the wallet to show these as two distinct asset spaces.
Before: A table of balances
A single table placed the DEX balance and personal wallet balance in different columns. The user still had to infer the relationship.
After: Two explicit asset spaces
Trading Wallet on the left. DeFi Wallet on the right. Transfer controls sit between matching assets, making direction visible.
Three assets. One transaction.
I worked with the PM and frontend engineer to confirm what the protocol could support, then designed a transfer flow that let users deposit or withdraw up to three assets together.
Make the destination explicit
The receive panel names the Trading Wallet, reinforcing where the assets are going.
Keep each amount independent
Each asset has its own available balance, amount and percentage control.
Show the transfer limit
A shared receive summary and remaining-asset count keep the three-asset limit visible.
A system that grew with the product
I established a lightweight system of trading colors, panel structures, components and interaction states. It supported the spot MVP and provided the foundation for the Futures experience that followed.
I owned the complete Futures design, extending the existing foundation to cover collateral, leverage, liquidation price, positions and P&L.
From a focused launch
to a broader trading product
The first release brought spot trading, wallet transfers and account essentials into production in two months. I later owned the complete Futures design, carrying the initial foundation into a broader trading experience.
Focus
A working spot MVP with clear release boundaries.
Clarity
An explicit relationship between personal and trading balances.
Continuity
A shared design foundation extended into Futures.
See The Product Live
More case studies?
Let’s work together.