Chen Yu Pan
0→1 Trading Product
I owned the product flows, UI and lightweight design system for a DEX built on Orderly. The work began with a spot MVP on NEAR, followed by a complete Futures design.
Role
Main Product Designer
Scope
Spot MVP · Futures · 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. Futures was deferred to a later release, while Swap was removed from scope.
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 spot trading familiar
The spot interface drew on established centralized-exchange layouts and interaction patterns, giving users a familiar starting point as they moved into 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. The shared balance table was replaced with two explicit asset spaces. Matching assets aligned across the wallets, with transfer controls between them to make direction visible. A follow up review checked the revised wallet experience.
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 foundation for the next trading stage
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 later 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.
0→1 Trading Product
I owned the product flows, UI and lightweight design system for a DEX built on Orderly. The work began with a spot MVP on NEAR, followed by a complete Futures design.
Role
Main Product Designer
Scope
Spot MVP · Futures · 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. Futures was deferred to a later release, while Swap was removed from scope.
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 spot trading familiar
The spot interface drew on established centralized-exchange layouts and interaction patterns, giving users a familiar starting point as they moved into 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. The shared balance table was replaced with two explicit asset spaces. Matching assets aligned across the wallets, with transfer controls between them to make direction visible. A follow up review checked the revised wallet experience.
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 foundation for the next trading stage
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 later 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.
0→1 Trading Product
I owned the product flows, UI and lightweight design system for a DEX built on Orderly. The work began with a spot MVP on NEAR, followed by a complete Futures design.
Role
Main Product Designer
Scope
Spot MVP · Futures · 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. Futures was deferred to a later release, while Swap was removed from scope.
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 spot trading familiar
The spot interface drew on established centralized-exchange layouts and interaction patterns, giving users a familiar starting point as they moved into 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. The shared balance table was replaced with two explicit asset spaces. Matching assets aligned across the wallets, with transfer controls between them to make direction visible. A follow up review checked the revised wallet experience.
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 foundation for the next trading stage
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 later 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.
0→1 Trading Product
I owned the product flows, UI and lightweight design system for a DEX built on Orderly. The work began with a spot MVP on NEAR, followed by a complete Futures design.
Role
Main Product Designer
Scope
Spot MVP · Futures · 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. Futures was deferred to a later release, while Swap was removed from scope.
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 spot trading familiar
The spot interface drew on established centralized-exchange layouts and interaction patterns, giving users a familiar starting point as they moved into 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. The shared balance table was replaced with two explicit asset spaces. Matching assets aligned across the wallets, with transfer controls between them to make direction visible. A follow up review checked the revised wallet experience.
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 foundation for the next trading stage
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 later 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.
0→1 Trading Product
I owned the product flows, UI and lightweight design system for a DEX built on Orderly. The work began with a spot MVP on NEAR, followed by a complete Futures design.
Role
Main Product Designer
Scope
Spot MVP · Futures · 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. Futures was deferred to a later release, while Swap was removed from scope.
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 spot trading familiar
The spot interface drew on established centralized-exchange layouts and interaction patterns, giving users a familiar starting point as they moved into 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. The shared balance table was replaced with two explicit asset spaces. Matching assets aligned across the wallets, with transfer controls between them to make direction visible. A follow up review checked the revised wallet experience.
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 foundation for the next trading stage
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 later 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.